我们已经在Azure上部署了API，并尝试在用angular 5编写的Web应用程序中使用该API。但是，当我们尝试使用该API时，出现以下错误。
** chrome **混合含量：“https：//somedevapp.azurewebsites.net/#/managessomething”处的页面已通过HTTPS加载，但请求了不安全的XMLHttpRequest终结点“http://admindevapp.azurewebsites.net/api/data/getdata”。此请求已被阻止。必须通过HTTPS提供内容。
Firefox阻止加载混合活动内容
该问题是否与CORS相关？如何解决该问题？
在这方面的任何帮助都表示感谢！
6条答案
按热度按时间tvmytwxo1#
如果您的Web应用如您所示托管在HTTP上，那么它使用的所有外部资源（CDN、脚本、CSS文件、API调用）也应该使用SSL并通过HTTP进行保护。想想看，如果您的应用反过来向API发出不安全的请求，这将使您的应用失去安全的目的。
因此，您可以：
1.按照Chrome的建议，更改API调用以使用HTTP（推荐）
1.使用HTTP而不是HTTP
1.将以下
meta标记添加到HTML中的<head>元素：<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />有关此问题的更多信息，请访问：https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/upgrade-insecure-requests。
xiozqbni2#
使用这个----在你的头部添加我将尝试这个与我的天气应用程序&现在它的工作很好
ttvkxqim3#
仅在页眉部分添加此内容。
rmbxnbpk4#
仅当资源API支持HTTPS请求时才可以使用此选项。
示例：如果“ip-api. COM”不支持HTTPS请求，则“wwwhttp://ip-api.com/json“和“https://ip-api.com/json“将不会返回相同的响应。
zlhcx6iw5#
下面的 meta标记有助于防止Chrome对HTTP请求的抱怨。我正在处理一个类项目（一个天气应用程序），通过HTTP调用API，在HTTP调用中添加一个S并没有帮助。因为这是一个项目，所以没有什么大问题。上面由@Medhi Ibrahim分享的元标记可以做到这一点。
icomxhvb6#
我试图删除索引上的"元解决方案"。并删除了environment.prod.ts上的"s
When i sign in " http://app.finoview.com" the api Nestjs works.
But when i try to log in "https://finoview.com", angular works, but the api nestjs doesnt work.
以下是图像：