node.js - Isu mengenai konfigurasi silang domain CORS dalam nginx

Question

Saya baru-baru ini mengusahakan projek vue dan ingin meletakkannya pada pelayan awan saya sendiri Sistem pelayan ialah centos 7. Node dan nginx telah dipasang Walau bagaimanapun, selepas menghantar projek yang dibungkus melalui proksi nginx, saya mendapati bahawa silang-. permintaan domain tidak boleh dibuat, jadi Pelbagai Google dan Baidu cara mengkonfigurasi kors silang domain dalam nginx, saya mencuba banyak kod, tetapi tidak berjaya, saya harap seseorang boleh membantu saya melihat.

nginx.conf dikonfigurasikan seperti berikut:

server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  maxutian.cn www.maxutian.cn;
        root         /root/hexo/public;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;

        location / {
    }

        error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }

    server {
        listen       80;
        server_name  music.maxutian.cn;
        root         /root/dist;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
    
    
        location / {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS';
    }
        error_page 404 /404.html;
            location = /40x.html {
        }

        error_page 500 502 503 504 /50x.html;
            location = /50x.html {
        }
    }

Memandangkan terdapat lebih daripada satu projek vue dalam pelayan, nama domain peringkat kedua disediakan dan dua pelayan ditulis. Pelayan pertama ialah blog saya, dan pelayan kedua ialah projek vue. Adakah terdapat sebarang masalah dengan konfigurasi saya?

Answer 1

Poster perlu memahami dahulu apa itu CORS Disarankan membaca artikel berikut dahulu

Kawalan Akses HTTP (CORS)

Answer 2

Rujuk ruangan Zhihu yang saya tulis:

https://zhuanlan.zhihu.com/p/...

Penekanan - add_header hendaklah sentiasa ditambah:

add_header Access-Control-Allow-Origin * always;

Answer 3

Anda boleh menggunakan pemajuan proksi nginx untuk mencapai merentas domain

server {
    listen  80;
    server_name 127.0.0.1;

    location ~ /api/ {
        proxy_pass  http://127.0.0.1:8081;
        proxy_set_header Host $host:80;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

Majukan http://127.0.0.1/api/ minta ke http://127.0.0.1:8081