2

2 つの Web API プロジェクトがあります。

  • Api1 は JavaScript フロントエンドのテスト環境ですが、テスト用にも API バックエンド (デフォルトの ValuesController) があります。
  • Api2 は「真の」バックエンドであり、実験的な JavaScript UI はそこからデータを取得する必要があります。テストのために、ここでもデフォルトの ValuesController を使用します。同じ出力が必要だからです。

現状

  • Api1-UI は、独自の API の ValuesController からデータをクエリできます

  • Api2 は正しいデータを返します (Firefox および Fiddler でテスト済み)

コード

JavaScript クライアント:

    var _load = function (url) {
        $.ajax({
            url: url,
            method: 'GET',
            accepts: "application/json; charset=utf-8",
            success: function (data) {
                alert("Success: " + data);
            },
            error: function (data) {
                alert("Error :" + data);                  
            }
        });
    };

WebApi コントローラ メソッド:

    public IEnumerable<string> Get()
    {
        return new string[] { "value1", "value2" };
    }

問題

実験的なフロント エンドの JavaScript UI は、Fiddler によると、正しく送信された API 2 からのデータを表示することも、受信することもできません。

私の最初の考えは、間違った方法を使用しているということでしたが、試し $.getJSONて み$.ajax.ましたが、常にエラーになります。statusText = "Error" とだけ表示されます。なぜ、独自の ApiController からのデータを表示できるのに、"External" からのデータは表示できないのでしょうか...

ヘルプ/提案をありがとう

4

1 に答える 1

2

ajax を使用して、別のドメイン Y から X のデータにアクセスしているようです。これは、従来のクロス ドメイン アクセスの問題のようです。

応答ヘッダーでAccess-Control-Allow-Originを値 " * " に設定する必要があります。

 Response.Headers.Add("Access-Control-Allow-Origin", "*")

これを解決できるさまざまな方法があります

  • IIS でこのヘッダーを定義する
  • 以下のような actionfilter 属性を使用する

FilterAttribute

public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
{
    public override void OnActionExecuted(HttpActionExecutedContext actionExecutedContext)
    {
        if (actionExecutedContext.Response != null)
            actionExecutedContext.Response.Headers.Add("Access-Control-Allow-Origin", "*");

        base.OnActionExecuted(actionExecutedContext);
    }
}

コントローラ アクションでの属性の使用

[AllowCrossSiteJson]
public Result Get(int id)
{
   //return appropriate result
}
于 2012-12-31T19:12:18.797 に答える