跨域配置-Chorme坑

Nginx进行跨域配置

1、找到对应的网站添加跨域配置，然后重启Nginx

server { listen 8880; server_name localhost; #charset koi8-r; #access_log logs/host.access.log main; location / { #跨域配置-开始 add_header Access-Control-Allow-Origin '*'; add_header Access-Control-Allow-Credentials true; add_header Access-Control-Allow-Methods '*'; add_header Access-Control-Allow-Headers '*'; add_header Access-Control-Expose-Headers 'Content-Length,Content-Range'; if ($request_method = 'OPTIONS') { add_header 'Access-Control-Max-Age' 1728000; add_header 'Content-Type' 'text/plain; charset=utf-8'; add_header 'Content-Length' 0; return 204; } #跨域配置-结束

Spring boot 跨域配置

1、在网关配置文件中添加如下配置

spring: application: name: @artifactId@ cloud: gateway: # default-filters: # - DedupeResponseHeader=Access-Control-Allow-Origin globalcors: corsConfigurations: '[/**]': allowedOriginPatterns: "*" #注意这个设置只对 spring boot 2.4+ 有效，低版本 使用 allowedOrigins: "*" 属性 allowed-methods: "*" allowed-headers: "*" allow-credentials: true exposedHeaders: "Content-Length,Content-Range"

注意：添加如上配置后，应该前端就可以进行跨域访问了，但是“chrome更新到94之后，会自动阻止发送不安全的内网请求”，当跨域有访问本地请求的时候会还是会报跨域错误 如:

net::ERR_FAILED（截图如下）

解决办法，就是关闭这个新特性，不要让它禁用

1、地址栏输入：chrome://flags/#block-insecure-private-network-requests

 

2、找到 Block insecure private network requests. 并且禁用

 

参考：如何解决Chrome禁止发送不安全的内网网络请求(ERR_FAILED)(How to fix Chrome block your insecure private network requests)_Aqvdrt的博客-CSDN博客