正しいアプローチに関するアドバイスや現在のエラーに関するヘルプを探しています。
データ駆動型サイトの管理者とフロントエンドの 2 つの個別の MVC3 アプリを構築しています。管理者は、最終的にフロントエンドのサブドメインに住むことになります。
私の要件の 1 つとして、プレビュー機能を管理者に組み込む必要があります。ユーザーはプロファイルなどを編集し、実際に保存せずに変更内容を確認したいと考えています。
まず、バックエンドからのデータを使用してフロントエンドからページを表示するための提案されたアプローチを誰かが持っていますか?
第二に、私のアプローチと私が得るエラー:
まず、ユーザーが管理アプリでプレビューをクリックすると、フォームがシリアル化され、フロントエンドのコントローラー アクションに投稿されます。
<script>
$("#previewPost").click(function () {
$.ajax({
async: false,
type: 'POST',
url: 'http://localhost:51569/Home/PreviewIndex',
data: $("form").serialize(),
dataType: 'html',
crossDomain: true,
success: function (data) {
var popup = window.open();
//popup.document.write(data);
}
,
error: function (data) {
console.log(data);
alert('error: ' + data);
}
});
});
コントローラーでは、渡されたモデルを取得し、フロントエンドが期待するものに一致するように調整してから返します。
[HttpPost]
public ActionResult PreviewHome(CurationAdminHomeEditModel postedModel)
{
...some stuff populating the model...
return View("PreviewHome", retModel);
}
最終的な目標は、その応答を受け取り、それを新しいウィンドウに書き込むことです。
しかし、そこまでは行きません。最初の POST は正常に動作し、コントローラー アクションに到達して応答を送信します。return ビューをステップ実行すると、データが取り込まれていることがわかります。しかし、その応答が jquery の結果にフィードバックされると、エラーとして次の詳細が表示されます。
[Exception... "Failure" nsresult: "0x80004005 (NS_ERROR_FAILURE)" location: "JS
frame :: http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js ::
<TOP_LEVEL> :: line 4" data: no]
それで、何か考えはありますか?
編集 ケビンとの以下の議論に従って、これも各アプリのweb.configに追加しました:
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
Firefox でも同じ応答が得られます。Chrome で実行すると、次のエラーが表示されます。
XMLHttpRequest は localhost:51569/Home/PreviewIndex? を読み込めません。Origin localhost:51566 は Access-Control-Allow-Origin で許可されていません。
編集 2 - 疑似ソリューション
これの原因はまだ不明ですが、実際にフォームをポストバックするだけで機能させることができます (ajax は使用しません)。だから私は今のところそれで行きます(新しいウィンドウをポップしないことを意味しますが)。誰かが追加する輝きを持っているなら、私はそれを聞いてうれしいです.