Question

的演示创建了一个网站

我已经完成了所有工作，但是，出于某种原因，当对我的api发出OPTION请求时，POST或GET以外的请求会被阻止。

我对以下请求收到以下错误：

http://localhost:26264/api/photo/facebook_reactions-02.png

XMLHttpRequest cannot load http://localhost:26264/api/photo/facebook_reactions-02.png. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:32150' is therefore not allowed access. The response had HTTP status code 404

执行以下代码时收到上述错误：

'remove': { method: 'DELETE', url: serviceBase + 'api/photo/:fileName', params: { name: '@fileName' } }

localhost是正确的。如果我发帖子包含我可以通过的数据。例如。当我想通过POST更新用户数据时。

演示应用程序还包含一个拦截器authInterceptorService.js，以便我的请求在发送之前得到处理。

var _request = function (config) {

    config.headers = config.headers || {};

    var authData = localStorageService.get('authorizationData');
    if (authData) {
        config.headers['Content-Type'] = 'application/x-www-form-urlencoded';
        config.headers.Authorization = 'Bearer ' + authData.token;
    }

    return config;

但是当我查看请求时：

OPTIONS /api/photo/facebook_reactions-02.png HTTP/1.1
Host: localhost:26264
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: DELETE
Origin: http://localhost:32150
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36
Access-Control-Request-Headers: accept, authorization
Accept: */*
Referer: http://localhost:32150/
Accept-Encoding: gzip, deflate, sdch
Accept-Language: nl,en-US;q=0.8,en;q=0.6,fr;q=0.4

我没有单独看到内容类型，也没有看到Access-Control-Request-Headers的一部分。奇怪的是，在回复中我看到以下内容：

Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS, TOKEN

所以我认为我的要求得以通过。但是，它没有......

为了完整起见我的StartUp.cs：

[assembly: OwinStartup(typeof(AngularJSAuthentication.API.Startup))]

[...]

    public void Configuration(IAppBuilder app)
    {
        HttpConfiguration config = new HttpConfiguration();

        ConfigureOAuth(app);

        WebApiConfig.Register(config);
        app.UseCors(Microsoft.Owin.Cors.CorsOptions.AllowAll);
        app.UseWebApi(config);
        Database.SetInitializer(new MigrateDatabaseToLatestVersion<AuthContext, Migrations.Configuration>());

    }

    public void ConfigureOAuth(IAppBuilder app)
    {
        //use a cookie to temporarily store information about a user logging in with a third party login provider
        app.UseExternalSignInCookie(Microsoft.AspNet.Identity.DefaultAuthenticationTypes.ExternalCookie);
        OAuthBearerOptions = new OAuthBearerAuthenticationOptions();

        OAuthAuthorizationServerOptions OAuthServerOptions = new OAuthAuthorizationServerOptions() {

            AllowInsecureHttp = true,
            TokenEndpointPath = new PathString("/token"),
            AccessTokenExpireTimeSpan = TimeSpan.FromMinutes(30),
            Provider = new SimpleAuthorizationServerProvider(),
            RefreshTokenProvider = new SimpleRefreshTokenProvider()
        };

        // Token Generation
        app.UseOAuthAuthorizationServer(OAuthServerOptions);
        app.UseOAuthBearerAuthentication(OAuthBearerOptions);
    }

web.config：

  <system.webServer>
    <modules runAllManagedModulesForAllRequests="true" />
    <handlers>
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <remove name="OPTIONSVerbHandler" />
      <remove name="TRACEVerbHandler" />
      <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
      <add name="UrlRoutingModule-4.0" path="*." verb="*" type="System.Web.Routing.UrlRoutingModule" preCondition="" />
    </handlers>
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS, TOKEN" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>

我忽略了允许DELETE（以及PUT）请求通过？

Answer 1

找到问题！

当尝试使用以扩展名结尾的字符串（例如图像）执行OPTIONS / DELETE请求时，如下面的请求：

http://localhost:26264/api/photo/facebook_reactions-02.png

不允许这样做，因为它无法将其映射到

的web api控制器方法

    [HttpDelete]
    [Route("{fileName}")]
    public async Task<IHttpActionResult> Delete(string fileName)

我认为这是因为逻辑认为我想要一张图片。

为了绕过这个，我把点改成了破折号，在我的代码中做了一个像这样的替换：

        var lastDashPosition = fileName.LastIndexOf('-');

        var fileNameSegment = fileName.Substring(0, lastDashPosition);
        var extensionSegment = fileName.Substring(lastDashPosition+1);

        fileName = string.Format("{0}.{1}", fileNameSegment, extensionSegment);

按照上面的说法我按照惯例处理文件：

        if (!photoManager.FileExists(fileName))
        {
            return NotFound();
        }

        var result = await photoManager.Delete(fileName);

        if (result.Successful)
        {
            return Ok(
                new {
                        message = result.Message
                    }
                );
        }
        else
        {
            return BadRequest(result.Message);
        }

上面的工作就像一个魅力，因为你需要被授权执行删除，这是我想要删除的图像我可以安全地假设字符串的最后一道菜是我必须用点替换的破折号。 / p>

对于带有angularjs的跨域请求，不允许使用CORS进行DELETE请求

1 个答案: