首页 > 解决方案 > Uncaught (in promise) SyntaxError: Unexpected end of JSON input Promise.then (async) - React

问题描述

我正在尝试使用 fetch 将我的 get 请求中的值显示到客户端。但是,我收到此语法错误:

Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0

我知道问题是由于它没有返回 JSON 对象,但是我创建了一个 JSON 对象,以便从我的烧瓶路由接收它。所以我不太确定是什么导致了这个错误。

应用程序.py

from flask import Flask, request, jsonify
from flask_cors import CORS, cross_origin


app = Flask(__name__)
CORS(app)


@app.route('/api', methods=['GET','POST'])
def api():
    if request.method == 'POST':
        username = request.form['username']
        email = request.form['email']
        occupation = request.form['occupation']
        print('Username: ' + username + ' Email: ' + email + ' occupation: ' + occupation) 
        print('Json ', (jsonify(username)))
        return {"username" : username} 
    else:
        return {"username" : username}

应用程序.js

import React, {useState, useEffect} from 'react';
import Form from './components/Form'
import './App.css';


function App() {
  const [initialData, setInitialData] = useState ([{}])

  useEffect(()=> {

    fetch('/api').then(
      response => response.json()
    ).then(data => console.log(data))
  });





  return (
    <div className="App">
      <Form/>
    </div>
  );
}

export default App;

标签: pythonreactjsflask

解决方案


将 Content-Type 和 Accept 标头添加到您的 fetch 中,示例如下。

fetch('/api', {
      headers : { 
        'Content-Type': 'application/json',
        'Accept': 'application/json'
       }).then(
      response => response.json()
    ).then(data => console.log(data))

推荐阅读