webapi 2.0 跨域行为

Posted

技术标签:

【中文标题】webapi 2.0 跨域行为【英文标题】:webapi 2.0 cross origin behaviour 【发布时间】:2018-01-21 21:42:58 【问题描述】:

我正在使用下面的默认 webapi ApplicationOAuthProvider 代码登录。我添加了

   <add name="Access-Control-Allow-Origin" value="*" />

在 web.config 中,客户端可以通过 www.testapi.com/token 登录。 一切正常。

但是当我创建一个自定义 webapi 函数时。它仍然要求我启用访问源控制。所以我通过在WebapiConfig.cs中添加这行代码来做到这一点

 EnableCorsAttribute cors = new EnableCorsAttribute("http://www.myweb.com:82", "*", "*");
        config.EnableCors(cors);

这次它提示错误说

''Access-Control-Allow-Origin' 标头包含多个值'http://www.myweb.com:82, *',但只允许一个。因此,Origin 'http://www.myweb.com:82' 不允许访问。

所以我删除了 web.config 中的 &lt;add name="Access-Control-Allow-Origin" value="*" /&gt; 并且它可以工作!!。

我返回登录并要求添加&lt;add name="Access-Control-Allow-Origin" value="*" /&gt;。但如果我添加这个。我的 webapi 方法将无法调用。

如果我不添加。客户端将无法登录。

有没有办法让两者都工作? 以下是 200 错误的响应。

更新 1 startup.auth.cs

   public void ConfigureAuth(IAppBuilder app)
    
        // Configure the db context and user manager to use a single instance per request
        app.CreatePerOwinContext(ApplicationDbContext.Create);
        app.CreatePerOwinContext<ApplicationUserManager>(ApplicationUserManager.Create);

        // Enable the application to use a cookie to store information for the signed in user
        // and to use a cookie to temporarily store information about a user logging in with a third party login provider
        app.UseCookieAuthentication(new CookieAuthenticationOptions());
        app.UseExternalSignInCookie(DefaultAuthenticationTypes.ExternalCookie);

        // Configure the application for OAuth based flow
        PublicClientId = "self";
        OAuthOptions = new OAuthAuthorizationServerOptions
        
            TokenEndpointPath = new PathString("/Token"),
            Provider = new ApplicationOAuthProvider(PublicClientId),
            AuthorizeEndpointPath = new PathString("/api/Account/ExternalLogin"),
            AccessTokenExpireTimeSpan = TimeSpan.FromDays(14),
            // In production mode set AllowInsecureHttp = false
            AllowInsecureHttp = true
        ;

        // Enable the application to use bearer tokens to authenticate users
        app.UseOAuthBearerTokens(OAuthOptions);
        app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);//as instructed

webapiconfig.cs

 public static void Register(HttpConfiguration config)
    


        // Web API configuration and services
        // Configure Web API to use only bearer token authentication.
        config.SuppressDefaultHostAuthentication();
        config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));

        // Web API routes
        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/controller/id",
            defaults: new  id = RouteParameter.Optional 
        );
        WebApiConfig.Register(config);
        config.EnableCors(new EnableCorsAttribute("*", "*", "GET, POST, OPTIONS, PUT, DELETE"));
        //var jsonp = new JsonpMediaTypeFormatter(config.Formatters.JsonFormatter);
        //config.Formatters.Insert(0, jsonp);
    

【问题讨论】:

在你的 Api 控制器中添加这个 [EnableCors(origins: "*", headers: "*", methods: "*", exposedHeaders: "X-My-Header")] 这是控制器级别。您可以在特定的操作方法中添加相同的内容以启用核心。 它仍然显示相同的错误“只允许一个。我没有删除 web.config 中的访问源。 【参考方案1】:
    安装Microsoft.AspNet.WebApi.Corsnuget包 安装Microsoft.Owin.Corsnuget包 在Startup.cs 文件的WebApiConfig.Register(config); 行的上面添加config.EnableCors(new EnableCorsAttribute("*", "*", "GET, POST, OPTIONS, PUT, DELETE"));。 将app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll); 添加到Startup.Auth.cs 文件中。这必须在致电IAppBuilder.UseWebApi 之前完成

【讨论】:

还是同样的错误。我还尝试通过删除 web.config 中的访问策略进行反复试验。还是一样。黑兹。这让我疯了。一次只有 1 个工作【参考方案2】:

好吧,我终于在“@manprit Singh Sahota”的帮助下成功了

我从 web.config 中删除了所有访问策略。 还有WebApiConfig下面的行

EnableCorsAttribute cors = new EnableCorsAttribute("*", "*", "*");
        config.EnableCors(cors);

我只将此行添加到Startup.Auth.cs

 public void ConfigureAuth(IAppBuilder app)
    
        app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);//working line

【讨论】:

以上是关于webapi 2.0 跨域行为的主要内容,如果未能解决你的问题,请参考以下文章

跨域调用webapi web端跨域调用webapi

跨域调用WebApi

WebApi跨域问题

mvc webapi跨域帖子[重复]

WebAPI跨域设置

跨域学习笔记1--跨域调用webapi