Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/python/328.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript获取json_Javascript_Python_Json_Flask_Create React App - Fatal编程技术网

Javascript获取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 = {

所以我尝试将Flask服务器连接到前端CreateReact应用程序。现在我只想验证我是否可以在两者之间发送json。下面是每个错误的代码,并对错误进行了更多的描述

创建应用程序获取

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)