reactjs - 未处理的拒绝 -SyntaxError - JSON 输入的意外结束
问题描述
从 myjson.com 访问时,我的 JSX 文件返回 API 数据;但是当我尝试从为 API提供的 URL访问数据时,我收到“未处理的拒绝 -SyntaxError- JSON 输入的意外结束”错误。 提供的URL 在放入 Postman 时,会在提供承载令牌时通过 GET 返回数据。
我的问题:是否必须在我的 JSX 文件中实现相同的令牌才能访问 API 的数据?如果是这样,它是如何在代码中实现的?
这是我的代码(修改):
import React, { Component } from 'react';
import {render} from "react-dom";
import Navbar from '../components/Navbar.jsx';
import Footer from '../components/Footer.jsx';
import './MemberInfo.css';
class MemberInfo extends Component {
state = { data: [] }
componentWillMount(){
fetch('http://myjson.com/api/e312j/', {
method: 'GET',
headers: {
'Accept': 'application/json',
'Content-type': 'application/json',
'Authorization': 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1lIjoiR3JlZyIsInVuaXF1ZV9uYW1lIjoiZ2dyYWZmIiwibmJmIjoxNTI0ODM5Nzc1LCJleHAiOjE1MjQ5MjYxNzV9.xhvdfaWkLVZ_HLwYQuPet_2vlxNF7AoYgX-XRufiOj0'
},
}
) /*end fetch */
.then(results => results.json())
.then(data => this.setState({ data: data }))
}
render() {
console.log(this.state.data);
return (
<div>
<Navbar />
<div className="container">
<div className="clientContainer">
{
this.state.data.map( item =>(
<div>
{item.clientName}
</div>
))
}
</div>
</div>
<Footer />
</div>
);
}
}
export default MemberInfo;
在使用 ReactJS 获取 API 数据方面,我还是个新手;请问我能得到一些帮助吗?
解决方案
推荐阅读
- python-3.x - 如何在 mdiArea(PyQt5) 中正确创建/显示和关闭/隐藏子窗口
- python - 根据 pandas DataFrame 中的组索引使用切片选择组
- x86 - “[V+ECX*2-2]”在内存中到底指的是什么?
- junit - 模拟 io vertx 异步处理程序
- reactjs - React-Dropzone 如何将每个文件转换为 base64
- r - 从字符串中删除相邻的重复项
- javascript - Javascript Web 动画 API 或 CSS 动画关键帧?
- vba - 为什么我的 vba 代码返回占位符文本
- prestashop - PrestaShop 价格四舍五入税排除问题
- reactjs - 我在每次输入更改时都发送请求以按关键字搜索,但响应顺序不正确..我该如何解决这个问题?