IIS 上 Angular 应用程序的 CORS 问题：POST 请求失败

Question

我正在开发一个 Angular 应用程序，在向我的服务器发出 POST 请求时遇到 CORS 问题，但仅在将其部署到 IIS 上之后才遇到。该应用程序在本地主机上完美运行。详情如下：

环境：

• 前端：Angular
• 后端：Node.js、.NET、
• 服务器 URL (IIS)：

  http://wapl8.ad.uclp:9091

• Angular 应用程序 URL (IIS)：

  http://skw.uat.ad.uclp

• 本地主机适用于所有请求

问题： 当我尝试从 Angular 应用程序（部署在 IIS 上）向服务器发送 POST 请求时，遇到以下 CORS 错误：

Access to XMLHttpRequest at 'http://wapl8.ad.uclp:9091/api/YPTApi/Save' from origin 'http://skw.uat.ad.uclp' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我尝试过的：

• GET 请求工作正常。
• 在我的本地开发环境 (localhost) 上，GET 和 POST 请求都可以正常工作，没有任何 CORS 问题。
• 我检查了Angular的CORS文档并尝试了各种解决方案，但在IIS上部署后问题仍然存在。

任何人都可以帮助我了解如何配置我的环境以允许 POST 请求而不违反 CORS 规则吗？这是后端服务器配置的问题吗？或者我可以在 Angular 方面做些什么来解决这个问题？

代码：

 public static void Configure(IServiceCollection services)
 {
     const string myAllowSpecificOrigins = "AllowSpecificOrigins";

     services.AddCors(options =>
     {
         options.AddPolicy(name: myAllowSpecificOrigins,
          // builder =>
         //  {


               builder =>
               {


                   builder
                       .WithOrigins(
                       "https://localhost:44498", 
                       "http://localhost:1285", 
                       "https://localhost:44337",
                       "http://localhost:44337",
                       "http://skw.uat.ad.uclp",
                       "http://skw.ad.uclp"
                       ) 
                       .AllowAnyHeader()
                       //.AllowAnyMethod()
                       .WithMethods("GET", "POST", "DELETE", "PUT", "OPTIONS")
                       .AllowCredentials();

Answer 1

不知道你是否配置过，.NET需要设置一个配置来管理CORS。 在您的 StartupConfigureServices 方法中添加以下内容：

  services.AddCors(options =>
  {
      options.AddPolicy(name: "general",
          builder =>
          {
              builder.AllowAnyOrigin()
              .AllowAnyMethod().
              AllowAnyHeader();
          });
      options.AddPolicy(name: "restrictive",
          builder =>
          {
              builder.WithOrigins("http://Your frontEnd URL").
              WithMethods("GET", "POST", "PUT", "DELETE")
              .AllowAnyHeader();
          });
  });

现在在启动中，在配置方法中添加：

    app.UseCors("[general/restritive];  // or whatever name you use...

在此示例中，“常规”CORS 配置允许来自任何主机的任何来源，而“限制性”仅允许来自您设置的主机的请求