跨域问题求助

开发调优
1 
已拦截跨源请求：同源策略禁止读取位于
 https://one.liuweiqing.top/v1/chat/completions 的远程资源。
（原因：CORS 头 'Access-Control-Allow-Origin' 不匹配 '*, *'）。

已拦截跨源请求：同源策略禁止读取位于 https://one.liuweiqing.top/v1/chat/completions 
的远程资源。（原因：CORS 请求未能成功）。状态码：(null)。

我nginx是这么配置的：

        server {
                listen 443 ssl;
                server_name one.liuweiqing.top;
                ssl_certificate /etc/cert/fullchain.pem; #证书位置
                ssl_certificate_key /etc/cert/key.pem; #私钥位置

                ssl_session_timeout 1d;
                ssl_session_cache shared:MozSSL:10m;
                ssl_session_tickets off;
                ssl_protocols TLSv1.2 TLSv1.3;
                ssl_prefer_server_ciphers off;

                location / {
                        proxy_pass http://localhost:3000;
                        proxy_http_version 1.1;
                        proxy_set_header Host $host:$server_port;
                        proxy_set_header X-Real-IP $remote_addr;
                        proxy_set_header Upgrade $http_upgrade;
                        proxy_set_header Connection "upgrade";

                        # 允许跨域的设置
                        add_header 'Access-Control-Allow-Origin' '*' always;
                        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
                        add_header 'Access-Control-Allow-Headers' 'X-Requested-With,Content-Type,X-Token-Auth,Authorization' always;
                }
        }
124 Likes
2

image

3

跨域的头我个人觉得最好是在应用里实现。应该是OPTIONS 头，并且带有Origin头才去响应头+204状态码。当然最好是用现成的库

1 Like
4

咱建议 允许跨域的头放外面
还是不行 就允许特定域名

1 Like
5

然后别忘重启nginx
nginx -s reload

1 Like
6

我懂了，修改如下，这个网站是oneapi，我没法修改应用，所以还是修改nginx

         location / {
                        proxy_pass http://localhost:3000;
                        proxy_http_version 1.1;
                        proxy_set_header Host $host:$server_port;
                        proxy_set_header X-Real-IP $remote_addr;
                        proxy_set_header Upgrade $http_upgrade;
                        proxy_set_header Connection "upgrade";

                        # 预检请求
                        if ($request_method = 'OPTIONS') {
                                add_header 'Access-Control-Allow-Origin' "$http_origin";
                                add_header 'Access-Control-Allow-Credentials' 'true';
                                add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
                                add_header 'Access-Control-Allow-Headers' '*'; # 允许所有头
                                return 204;
                        }

                }
53 Likes
7

好的，完成了

8

那个可以去提交代码混个贡献了

2 Likes
9

上面的配置解决了oneapi的问题，但是没有解决这个网站的问题，继续求助
已拦截跨源请求：同源策略禁止读取位于 liuweiqing.top 的远程资源。（原因：CORS 头缺少 ‘Access-Control-Allow-Origin’）。状态码：200。

Error: TypeError: NetworkError when attempting to fetch resource.
代码:

        server {
                listen 443 ssl;
                server_name plus.liuweiqing.top;
                ssl_certificate /etc/cert/fullchain.pem; #证书位置
                ssl_certificate_key /etc/cert/key.pem; #私钥位置

                ssl_session_timeout 1d;
                ssl_session_cache shared:MozSSL:10m;
                ssl_session_tickets off;
                ssl_protocols TLSv1.2 TLSv1.3;
                ssl_prefer_server_ciphers off;

                location / {
                        proxy_pass http://localhost:8100;
                        proxy_http_version 1.1;
                        proxy_set_header Host $host:$server_port;
                        proxy_set_header X-Real-IP $remote_addr;
                        proxy_set_header Upgrade $http_upgrade;
                        proxy_set_header Connection "upgrade";

                        # 预检请求
                        if ($request_method = 'OPTIONS') {
                                add_header 'Access-Control-Allow-Origin' "$http_origin";
                                add_header 'Access-Control-Allow-Credentials' 'true';
                                add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE';
                                add_header 'Access-Control-Allow-Headers' 'Origin, X-Requested-With, Content-Type, Accept, Authorization'; # 显式列出允许的头
                                return 204;
                        }
                }
        }
50 Likes
10 
        server {
                listen 443 ssl;
                server_name plus.liuweiqing.top;
                ssl_certificate /etc/cert/fullchain.pem; #证书位置
                ssl_certificate_key /etc/cert/key.pem; #私钥位置

                ssl_session_timeout 1d;
                ssl_session_cache shared:MozSSL:10m;
                ssl_session_tickets off;
                ssl_protocols TLSv1.2 TLSv1.3;
                ssl_prefer_server_ciphers off;
                # 添加CORS头部
                add_header 'Access-Control-Allow-Origin' "$http_origin" always;
                add_header 'Access-Control-Allow-Credentials' 'true' always;
                add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, PUT, DELETE' always;
                add_header 'Access-Control-Allow-Headers' 'Origin, X-Requested-With, Content-Type, Accept, Authorization' always;


                location / {
                        proxy_pass http://localhost:8100;
                        proxy_http_version 1.1;
                        proxy_set_header Host $host:$server_port;
                        proxy_set_header X-Real-IP $remote_addr;
                        proxy_set_header Upgrade $http_upgrade;
                        proxy_set_header Connection "upgrade";
                        # 预检请求的特殊处理可以保留
                        if ($request_method = 'OPTIONS') {
                                return 204;
                        }
                }

改好了,
这个比较通用它既避免了原始程序在没有处理跨域问题时返回401未授权问题，又添加了对所有响应添加跨域请求的功能

5 Likes
11

From #develop:qa to 开发调优

1 Like