Javascript获取json
所以我尝试将Flask服务器连接到前端CreateReact应用程序。现在我只想验证我是否可以在两者之间发送json。下面是每个错误的代码,并对错误进行了更多的描述 创建应用程序获取Javascript获取json,javascript,python,json,flask,create-react-app,Javascript,Python,Json,Flask,Create React App,所以我尝试将Flask服务器连接到前端CreateReact应用程序。现在我只想验证我是否可以在两者之间发送json。下面是每个错误的代码,并对错误进行了更多的描述 创建应用程序获取 import React, { Component } from 'react'; import './App.css'; export default class App extends Component { constructor() { super() this.state = {
import React, { Component } from 'react';
import './App.css';
export default class App extends Component {
constructor() {
super()
this.state = {
pyResp: []
}
}
fetchHelloWorld() {
console.log("fetching python localhost");
fetch('http://localhost:5000/', {
method: 'GET',
mode:'no-cors',
dataType: 'json'
})
.then(r => r.json())
.then(r => {
console.log(r)
this.setState({
pyResp: r
})
})
.catch(err => console.log(err))
}
render() {
return (
<div className="App">
<h1>Blockchain Voter</h1>
<p>
{this.state.pyResp}
</p>
<button onClick={() => this.fetchHelloWorld()}>Python</button>
</div>
);
}
}
我得到这个错误(在chrome控制台中)——
输入意外结束(…)
我可以在Chrome的Networks选项卡中看到json,它似乎在解析时出错了
无法确定这是一个flask语法错误(即未正确发送)、javascript解析错误(即我犯了一些我看不到的简单错误)还是一个我不理解的create react应用程序错误。您的flask应用程序中很可能没有启用CORS。CORS代表跨源资源共享,它允许python Web应用程序说“好的,我们与他人共享”或“浏览器”之类的话。无论如何,解决方案应该是这样的 在终端/bash
$pip安装-U flask cors
在你的应用程序中
from flask import *
from json import *
from flask_cors import CORS, cross_origin
app = Flask(__name__)
CORS(app)
@app.route('/')
def hello_world():
jsonResp = {'jack': 4098, 'sape': 4139}
print(jsonify(jsonResp))
return jsonify(jsonResp)
if __name__ == '__main__':
app.run(debug=True)
你从哪里得到这个错误?@AlexHall这个错误在chrome控制台中。太棒了,这很有效。我还没有深入研究cors,但你的解释有助于开始理解!请选择最佳答案,并让我知道您是否需要其他帮助
from flask import *
from json import *
from flask_cors import CORS, cross_origin
app = Flask(__name__)
CORS(app)
@app.route('/')
def hello_world():
jsonResp = {'jack': 4098, 'sape': 4139}
print(jsonify(jsonResp))
return jsonify(jsonResp)
if __name__ == '__main__':
app.run(debug=True)