0

自分のボックスでWebサービスを呼び出すと、Chromeでエラーが発生します。エラーは次のとおりです。

Origin http://localhost:52386 is not allowed by Access-Control-Allow-Origin.

私はここで他の質問とこのような記事を読みました： Cross Domain AJAX ; しかし、IEが正しく機能しないという問題に対処する傾向があり、Chromeに問題があります。

以下をwebservice/Global.asax.csに追加しました。

protected void Application_BeginRequest(object sender, EventArgs e)
{
    //HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");
    // Changed to this:
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "http://localhost:52386");
    HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "http://localhost:80");

}

これが私のHTMLコードです（これをプレーンHTMLで保持する必要があり、コードの背後にはありません）：

    $(document).ready(function () {
        var user = 'testuser';
        var pwd = 'abc123';
        var auth = 'Basic ' + Base64.encode(user + ':' + pwd);
        if ($.browser.msie) {
            jQuery.support.cors = true;
            $.ajax({
                type: "GET",
                url: "http://localhost/Website.Webservice/api/TaxDocument",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "text json",
                headers: { Authorization: auth },
                crossDomain: true,
                success: function (data, textStatus, jqXHR) { ProcessOutput(data); },
                error: function (jqXHR, textStatus, errorThrown) { alert('Error: ' + textStatus + ' ' + errorThrown); }
            });
        } else {
            $.ajax({
                type: "GET",
                url: "http://localhost/Website.Webservice/api/TaxDocument",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                crossDomain: true,
                dataType: "json",
                headers: { Authorization: auth },
                success: function (data, textStatus, jqXHR) { ProcessOutput(data); },
                error: function (jqXHR, textStatus, errorThrown) { alert('Error: ' + textStatus + ' ' + errorThrown); }
            });
        }
    })
4

1 に答える 1

0

さて、これはかなり大きな問題であることが判明しました。まず、IIS 7.5とVS開発サーバー、およびIISExpressはCORSを異なる方法で処理します。主な問題は、私のWebサービスがchromeとfirefoxからのOPTIONSリクエストに応答していなかったことです。IEとSafariは本当に気にしません。

CORSハンドラーを持つThinkTectureのNuGetパッケージを使用しました。ここでの説明を参照してください：CORSサポート。

私の改訂されたJSはブラウザを気にしません（IE、Safari、Chrome、FireFoxでテストしました）

<script type="text/javascript">
        var GetTaxDocument = function () {
            var url = "http://myWebService.com/WebService/Api/Products;
            var user = "myUser";
            var pwd = "pwd123";
            var auth = Base64.encode(user + ':' + pwd);

            jQuery.support.cors = true;
            $.ajax({
                type: "GET",
                url: url,
                //data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "text json",
                headers: { Authorization: 'Basic ' + auth },
                crossDomain: true,
                success: function (data, textStatus, jqXHR) {ProcessOutput(data); }
                error: function (jqXHR, textStatus, errorThrown) { alert('Error: ' + textStatus + ' ' + errorThrown.message); }
            });
        };

        var ProcessOutput = function (data) {
            var body = "";
            $.each(data, function () {
                var row = "";
                row += "ID:   " + this.ID + "<br />";
                row += "Desc: " + this.Desc + "<br />";
                body += "<p>" + row + "</p>";
            })
            $('#results').html(body);
        };
    </script>

global.asax.csに以下を追加しました。

        protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();

        WebApiConfig.Register(GlobalConfiguration.Configuration);
        FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        BundleConfig.RegisterBundles(BundleTable.Bundles);

        GlobalConfiguration.Configuration.MessageHandlers
          .Add(new BasicAuthMessageHandler()
          {
              PrincipalProvider = new AuthenticationPrincipalProvider()
          });
        //This is the CORS handler
        CorsConfig.RegisterCors(GlobalConfiguration.Configuration);

    }

そして、私のApp_start \ CorsConfig.csには、次のようなものがあります。

public class CorsConfig
{
    public static void RegisterCors(HttpConfiguration httpConfig)
    {
        WebApiCorsConfiguration corsConfig = new WebApiCorsConfiguration();

        // this adds the CorsMessageHandler to the HttpConfiguration’s
        // MessageHandlers collection
        corsConfig.RegisterGlobal(httpConfig);

        // this allow all CORS requests to the Products controller
        // from the http://foo.com origin.
        corsConfig
            .ForResources("TaxDocument")
            //.ForOrigins("http://localhost", "http://localhost:49878", "http://localhost:52386")
            .AllowAllOrigins()
            .AllowAll();
    }
}

localhost：52386とlocalhost：49878は、localhostで実行されているWebサービスを呼び出し、VSからWebページをデバッグする際の問題を解決しました。ローカルホストを追加すると、49878で実行されているWebサービスをデバッグし、ローカルホストまたは52386でWebページを実行しているときに役立ちます。FILE .AllowAll()：/// c：/myWebPage.htmlからHTMLをロードしていたため、今のところに切り替えることになりました。

フィードバックをお寄せいただくか、詳細を追加する必要がある場合はお知らせください。

于 2012-10-31T17:55:12.443 に答える