Vue JS和Laravel在同一服务器上但端口不同（SSL问题）

Question

我在生产服务器上安装SSL时遇到问题。我在端口80上运行Laravel，在端口8080上运行vue js。我已经安装了SSL证书。

但是现在当我试图发送任何请求到8000a时有一个错误：

XHR.js:178混合内容：“HTTPS://www.example.com/login”页面是通过HTTPS加载的，但请求的XMLHttpRequestendpoint“http://www.example.com:8000/api/auth/login”不安全。此请求已被阻止；内容必须通过HTTPS提供。

这是我的NGINX设置：

server {
        listen 8000 default_server;
        listen [::]:8000 default_server ipv6only=on;

        root /var/www/laravel/public;

        index index.php index.html index.htm index.nginx-debian.html;

        server_name example.com www.example.com;

        location / {
                try_files $uri $uri/ /index.php?$query_string;
        }

        location ~ \.php$ {
                include snippets/fastcgi-php.conf;

                fastcgi_pass unix:/run/php/php7.2-fpm.sock;
        }


        location ~ /\.ht {
                deny all;
        }
}

server {
        listen 80;
        listen [::]:80;

        server_name example.com www.example.com;
        error_page 404 /index.html;
        root /var/www/client/dist;
        index index.html;

        location / {
                try_files $uri $uri/ =404;
        }

        listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}

Answer 1

我通过将API移动到子域并在其上添加一个SSL证书来解决这个问题。应用程序现在运行良好。