刘勇虎的官方网站

项目中用到微应用，在微应用中引入了 nginx，但是 nginx 配置中，存在多个无效的跨域配置，导致浏览器报错，无法访问微应用。

NGINX 是一个高性能的开源 Web 服务器和反向代理服务器。它具有轻量级、高并发处理能力和低内存消耗的特点，被广泛应用于互联网领域。

‘Access-Control-Allow-Origin’是一个 HTTP 响应头部字段，用于指定允许访问资源的域。当浏览器发起跨域请求时，服务器可以通过设置该头部字段来控制是否允许跨域访问。

在 NGINX 中，可以通过配置文件来设置’Access-Control-Allow-Origin’头部字段的值。如果需要允许多个域名访问资源，可以在配置文件中使用逗号分隔多个域名。

以下是一个示例配置文件的片段，展示了如何设置’Access-Control-Allow-Origin’头部包含多个值：

location / {
    if ($http_origin ~* (https?://(www\.)?(domain1\.com|domain2\.com))) {
        add_header 'Access-Control-Allow-Origin' "$http_origin";
    }
}

代码解释：

这段代码用于处理HTTP请求中的CORS（Cross-Origin Resource Sharing，跨源资源共享）策略。它定义了当请求的Origin头符合特定条件时，如何响应这些请求。让我们逐行解析这段代码：

1. location / { - 这一行指定了该配置块应用于所有以根路径 / 开始的请求。

2. if ($http_origin ~* (https?://(www\.)?(domain1\.com|domain2\.com))) { - 这是一个条件语句，用于检查请求头中的Origin字段是否匹配指定的模式。这里的模式使用正则表达式来匹配两个域名：domain1.com 和 domain2.com，并且它们可以有或没有www.前缀，同时支持http和https协议。~*表示这是一个不区分大小写的正则表达式匹配。

3. add_header 'Access-Control-Allow-Origin' "$http_origin"; - 如果上一步的条件成立，即请求的Origin头匹配了上述的正则表达式，那么Nginx会在响应头中添加一个Access-Control-Allow-Origin字段，并将其值设置为请求中的Origin值。这样做是为了告诉浏览器，这个响应可以被指定来源的页面安全地访问，从而实现跨域资源共享。

4. } - 结束if条件块。

通过这种方式，Nginx服务器能够根据请求的来源动态地设置CORS头，允许从特定的域名发起跨域请求。这对于需要从不同域名加载资源的Web应用来说非常有用，同时也提供了一定程度的安全性，因为只有预先配置好的域名才能成功发起跨域请求。