Web API 错误 - 此请求已被阻止；内容必须通过 HTTPS 提供
Web API Error - This request has been blocked; the content must be served over HTTPS
我们已经在 azure 上部署了 api 并尝试在我们用 angular 5 编写的网络应用程序中使用。但是，当我们尝试使用 api 时，出现以下错误.
Chrome Mixed Content: The page at 'https://somedevapp.azurewebsites.net/#/managesomething' was loaded
over HTTPS, but requested an insecure XMLHttpRequest endpoint
'http://admindevapp.azurewebsites.net/api/data/getdata'. This request
has been blocked; the content must be served over HTTPS.
Firefox Blocked loading mixed active content
此问题与 CORS 相关吗？如何解决这个问题？
感谢任何帮助！
如果您的网络应用如您所指出的那样通过 HTTPS 托管，那么它使用的所有外部资源（CDN、脚本、CSS 文件、API 调用）也应该使用 SSL并通过 HTTPs 进行保护。想想看。如果您的应用程序反过来向 API.
发出不安全的请求，这将破坏您的应用程序的安全目的。
您可以因此：
- 按照 Chrome 的建议，更改您的 API 调用以使用 HTTP（推荐）
- 使用 HTTP 而不是 HTTPs
将以下 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。
下面的元标记有助于防止 Chrome 抱怨发出的 HTTP 请求。我正在开发一个 class 项目（一个天气应用程序）并且 API 通过 HTTP 调用并向 HTTP 调用添加 S 没有帮助。由于这是一个项目，因此没有重大问题。上面由@Medhi Ibrahim 分享的元标记可以解决问题。
<meta> http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
使用这个 ---- 添加到你的 head 部分
我会用我的天气应用程序试试这个，现在它工作正常
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
仅将此添加到 header 部分。
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
只有当您的资源 API 支持 HTTPS 请求时才可以使用它。
示例：“http://ip-api.com/json”和“https://ip-api.com/json”都不会 return 如果“ip-api.com”不支持 HTTPS 请求，则相同的响应。
我试图删除索引上的“元解决方案”。
并删除 environment.prod.ts
上的“s”
当我登录“http://app.finoview.com”时，api Nestjs 工作。
但是当我尝试登录“https://finoview.com”时，angular 有效，但 api nestjs 不起作用。
图片如下：
我们已经在 azure 上部署了 api 并尝试在我们用 angular 5 编写的网络应用程序中使用。但是，当我们尝试使用 api 时，出现以下错误.
Chrome Mixed Content: The page at 'https://somedevapp.azurewebsites.net/#/managesomething' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://admindevapp.azurewebsites.net/api/data/getdata'. This request has been blocked; the content must be served over HTTPS.
Firefox Blocked loading mixed active content
此问题与 CORS 相关吗？如何解决这个问题？
感谢任何帮助！
如果您的网络应用如您所指出的那样通过 HTTPS 托管，那么它使用的所有外部资源（CDN、脚本、CSS 文件、API 调用）也应该使用 SSL并通过 HTTPs 进行保护。想想看。如果您的应用程序反过来向 API.
发出不安全的请求，这将破坏您的应用程序的安全目的。您可以因此：
- 按照 Chrome 的建议，更改您的 API 调用以使用 HTTP（推荐）
- 使用 HTTP 而不是 HTTPs
将以下
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。
下面的元标记有助于防止 Chrome 抱怨发出的 HTTP 请求。我正在开发一个 class 项目（一个天气应用程序）并且 API 通过 HTTP 调用并向 HTTP 调用添加 S 没有帮助。由于这是一个项目，因此没有重大问题。上面由@Medhi Ibrahim 分享的元标记可以解决问题。
<meta> http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
使用这个 ---- 添加到你的 head 部分 我会用我的天气应用程序试试这个，现在它工作正常
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
仅将此添加到 header 部分。
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
只有当您的资源 API 支持 HTTPS 请求时才可以使用它。
示例：“http://ip-api.com/json”和“https://ip-api.com/json”都不会 return 如果“ip-api.com”不支持 HTTPS 请求，则相同的响应。
我试图删除索引上的“元解决方案”。 并删除 environment.prod.ts
上的“s”当我登录“http://app.finoview.com”时，api Nestjs 工作。
但是当我尝试登录“https://finoview.com”时，angular 有效，但 api nestjs 不起作用。
图片如下：