在 Azure Web 应用程序中为 Web API 启用 CORS

Posted 2023-03-03

【中文标题】在 Azure Web 应用程序中为 Web API 启用 CORS

【英文标题】：Enabling CORS for Web API in Azure Web Apps

【发布时间】：2015-09-24 21:59:12

【问题描述】：

我已将一个 Web API 项目部署到 Azure Web 应用。我正在尝试从 angularjs 应用程序向 API 发出 $http.get 请求。但它给出了一个 CORS（跨域）异常，尽管我在我的 Web API 启动配置中启用了它

 app.UseCors(CorsOptions.AllowAll);

我想为 Azure Web 应用启用 CORS，我相信这会解决问题

编辑 http://nearestbuyweb.azurewebsites.net/ 这是 Web 应用程序的 URL。它试图访问发生异常的http://nearestbuyapi.azurewebsites.net/api/MenuBar。

我认为 Azure Web App 不可能。 MSDN Question

请帮忙！

【问题讨论】：

澄清一下，当您的站点尝试对第二个站点进行 API 调用时，您会收到 CORS 异常，还是在第二个站点尝试对您的站点进行 API 调用时收到 CORS 异常?在您的站点上启用 CORS 只会启用第一种情况。

当我从我的 Web 项目访问 Web api 时出现错误。我想基本上为 Azure Web 应用启用 CORS

【参考方案1】：

<system.webServer>
    <httpProtocol>
        <customHeaders>
            <clear />
            <add name="Access-Control-Allow-Origin" value="*" />
            <add name="Access-Control-Allow-Headers" value="Content-Type" />
            <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
        </customHeaders>
    </httpProtocol>
</system.webServer>

【讨论】：

例如使用 fiddler 或 postman 尝试请求，并检查它是否有效。我正在使用这些配置并且工作正常。

当我在没有来源的情况下访问它时，即在 chrome 中输入 URL 以及 fiddler 它可以工作。

【参考方案2】：

您需要使用 web.config 删除 IIS 中的选项处理程序。 http://eugeneagafonov.com/post/38312919044/iis-options-cors-aspnet-webapi-en

【讨论】：

我正在使用 Azure Web App，我们无法修改 IIS

您正在编辑 web.config 而不是直接修改 IIS。你点击链接了吗？顺便说一句，这就是我在 Azure（网络应用程序）中的工作方式。

【参考方案3】：

我在 Azure 中使用了 CORS：

WebApiConfig.cs：

public static class WebApiConfig

    public static void Register(HttpConfiguration config)
    
        // Web API configuration and services
        config.EnableCors();

        // Web API routes
        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "PublicApi",
            routeTemplate: "api/v1/controller/id",
            defaults: new  id = RouteParameter.Optional 
        );

    

Web.config：

  <system.webServer>
  <handlers>
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <remove name="OPTIONSVerbHandler" />
      <remove name="TRACEVerbHandler" />
      <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
    </handlers></system.webServer>

【讨论】：

感谢@buKaneer，即使我正在做相同的配置。它在我的本地机器上运行良好（API 和 Web 托管在 IIS 中作为单独的应用程序），但是当我发布到 azure 时它不起作用。

您是否将 WebApi 部署到 Azure Web 应用或移动服务或云服务？

它是一个托管在 Azure 上的网站，这里是链接 get-json.azurewebsites.net CORS 调用是从这里进行的 codepen.io/collection/XzVOeX

所以 get-json.azurewebsites.net 托管在 Azure 上，但是对不在 Azure 中的 codepen 进行 CORS 调用？对我来说，需要对部署到 azure 的 Web Api 进行 CORS 调用

您可以从任何网站进行 CORS 调用以获取 JSON（托管在 azure 上）。

【参考方案4】：

注意：您使用 CORS 设置让其他网站访问您网站的 API。不访问其他站点的 API。

根据您的 cmets，当您尝试从您的站点发出外部请求时，您似乎遇到了 CORS 错误。这正是 CORS 应该阻止的行为。

要让错误消失，您必须在您尝试访问的 API 的站点上应用 CORS 配置设置。

在您的情况下，您希望确保在 http://nearestbuyapi.azurewebsites.net 站点上应用配置更改。不在http://nearestbuyweb.azurewebsites.net/

【讨论】：

这就是我正在做的@Zain

“这正是 CORS 应该阻止的行为。” - 阻止浏览器查看响应的不是 CORS，而是同源策略 (SOP)。 CORS 基本上只是一堆可以用来放松 SOP 的标头。

【参考方案5】：

对不起各位，

此问题仅发生在我的公司网络中。谷歌搜索后，我发现公司网络可以禁用 CORS 请求。在这里找到这个link