无法调用API的Deezer与反应,爱可信(Failed call to Deezer API wi

2019-11-05 06:47发布

我想连接到的Deezer API和读取数据, 该API可以在这里找到 ,如果你把第一个环节 ,他们有没有和开放在新标签,你会看到在JSON数据,但爱可信不能返回它

import React from "react";
import ReactDOM from "react-dom";

import axios from "axios";

import "./styles.css";

class App extends React.Component {

  componentDidMount() {
    axios.get("https://api.deezer.com/album/302127")
    .then(response => {
      console.log(response);
    })
    .catch(err => {
      console.log(err);
    });
  }

  render() {
    return (
      <div className="App">
        <h2>Deezer</h2>
      </div>
    );
  }
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Answer 1:

的Deezer API不允许跨域请求。 因此,从浏览器的API调用是不可能的。

但是你可以用一种变通方法,并使用https://cors-anywhere.herokuapp.com

您需要更改像下面的代码:

axios.get("https://cors-anywhere.herokuapp.com/https://api.deezer.com/album/302127")
  .then(response => {
    this.setState({ response })
  })
  .catch(err => {
    console.log('error', err);
  });

这是一个工作示例: https://stackblitz.com/edit/react-v6bufu

不过,我会建议编写自己的后端,你会叫的Deezer的API。 你会不会有越来越跨域错误。



文章来源: Failed call to Deezer API with React and axios
标签: reactjs axios