API 请求被阻止，内容必须通过 HTTPS 提供答案

【问题标题】：API request blocked and the content must be served over HTTPSAPI 请求被阻止，内容必须通过 HTTPS 提供
【发布时间】：2018-05-06 00:10:05
【问题描述】：

我使用 api 调用创建了一个 Angular 应用程序。我已经将它部署在 github 页面中。然后，当每次 api 调用时，我都会收到此错误消息。

getList(input) {

  const url = '/api.themoviedb.org/3/search/movie/?api_key=b6dba21fefcead3510c8ddf58eb57d43&query=' + input;
  return this.httpClient.get<RootResult>(url);
}

我在开发工具控制台出现此错误：

Mixed Content: The page at 'https://githamza.github.io/ngxs-app-example/home' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.themoviedb.org/3/search/movie?api_key=b6dba21fefcead3510c8ddf58eb57d43&query=l'. This request has been blocked; the content must be served over HTTPS.

我在我的 api 中使用了相对路径，但它总是添加 http 而不是 https

这是我的 github 页面示例：https://githamza.github.io/ngxs-app-example

【问题讨论】：

将https://api.themoviedb.org/3/search/movie/粘贴到浏览器地址栏中，注意会发生什么：它重定向到相应的非https URL
有什么解决办法吗？或者是 API 乱七八糟

标签： javascript angular api typescript https

【解决方案1】：

使用 https！

const url = 'https://api.themoviedb.org/3/search/movie/?api_key=b6dba21fefcead3510c8ddf58eb57d43&query=' + input;

【讨论】：

已使用，将其转换为“http”请求

【解决方案2】：

您的 API 在 http 之后，因此您不能从您的 https（客户端）应用程序调用 http api，这违反了 https 安全策略.. 应用程序和 api 应该在同一协议中

更新：将网址更改为喜欢以下内容

const url = 'https://api.themoviedb.org/3/search/movie/?api_key=b6dba21fefcead3510c8ddf58eb57d43&query=' + input;

【讨论】：

我只使用 angular ，没有 java 后端。我认为这篇文章没有帮助