从http源获取数据到https上

Question

所以我已经向Heroku部署了一个项目（Used framework is ReactJS），给定的URL使用HTTPS协议。我遇到的问题是获取数据的来源使用HTTP协议，因此会返回此错误...

  

这里是负责获取数据的代码

import axios from 'axios';

const api = axios.create({
    baseURL: 'http://api.decoprim.md/v1/items?key=3VG8BizGax',
  });

export function getProducts() {
    return api.get().then(response => response.data.data);
}

Answer 1

Cross-Origin Resource Sharing (CORS)阻止了您的请求，如果页面是通过https加载的，您应该使用https来获取所有资源，但是如果您无法更改，则可以使用第三方服务绕过它：

1. CORS Anywhere：https://cors-anywhere.herokuapp.com/
2. 所有起源：http://allorigins.me/
3. 任何来源：http://anyorigin.com/

基本网址示例：

https://allorigins.me/get?url=http%3A//api.decoprim.md/v1/items%3Fkey%3D3VG8BizGax&method=raw

Answer 2

我假设您正尝试从本地主机连接到https服务器。

您可以按照此tutorial

为您的localhost设置ssl

或者您可以保持简单并使用ngrok

按照说明在您的操作系统上安装ngrok。

如果您使用的是mac（假设您安装了brew）

brew install ngrok

ngrok http 3000 // port number your react app is running on.

您将获得可用于浏览应用的https地址