Angular 我如何通过HTTPS提供内容

我创建了一个应用程序，并将其部署在DigitalOcean上，我有一个SSL证书。有两个独立的服务器，一个用于angular，它有一个用于https重定向的平衡器加载程序，另一个用于后端，但当我打开网站时，我在控制台中看到了这个

Mixed Content: The page at 'https://www.mirrorate.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://165.22.187.137/api/posts?pagesize=2&page=1'. This request has been blocked; the content must be served over HTTPS.

---

有人能给我解释一下吗？或者我如何解决这个问题，谢谢

出于安全考虑，您不能通过http进行https调用

要解决您的问题，您可以设置nginx通过https代理您的http后端url。 使用nginx服务器，您需要像调用api一样调用api，nginx将代理您的请求到api主机，您将在配置中设置该主机

示例配置。PS-不要忘记更改您的证书文件路径：

# if you have sockets
upstream socket {
    ip_hash;
    server host:port fail_timeout=0;
}

server { 
    listen [::]:443 ssl ipv6only=on;
    listen 443 ssl default_server;
    root /usr/share/nginx/html;
    index  index.html index.htm;
    include /etc/nginx/mime.types;
    client_max_body_size 50M;

    # server_name YOUR_SERVER_NAME
    ssl_certificate /fullchain.pem;
    ssl_certificate_key /privkey.pem;

    include /options-ssl-nginx.conf;
    ssl_dhparam /ssl-dhparams.pem;

    location /ws/ {
        proxy_pass http://socket;
        proxy_http_version 1.1;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host $http_host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }

    location /api {
            proxy_pass http://host:port/api;
    }

    location / {
        try_files $uri $uri/ /index.html;
    }
}

---

如果您的angular应用程序通过HTTP，则无法向HTTP服务器发出请求，因为断开了HTTPS协议，浏览器不允许这样做。您需要一个HTTP（S）后端或HTTP前端。

可以在不使用https的情况下设置后端。我们可以使用nginxno代理来自域服务器的请求。https上的浏览器从不触发对http api的XMLHttpRequest。您需要再次阅读我的评论。我并没有说浏览器可以通过https调用http api。我只想说，如果我们使用nginx将http api调用代理到https，api可能不使用http进行设置。这意味着api调用将通过https进行，但将通过代理服务器进行，而不是通过后端进行，在那里您可以获得fullchain.pem和privkey.pem？如果是自签名证书，浏览器将阻止该请求。您需要在浏览器中手动启用证书，然后浏览器将发出请求。但如果重新启动代理，则需要在浏览器中再次启用。