javascript - React: Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
问题描述
我正在学习教程,但我被困在这部分。多次根据源代码检查我的代码,并用谷歌搜索了这个错误。有很多结果,但我似乎无法将解决方案应用到我的项目中。
我正在使用反应、表达、redis。这是负责 json 数据的文件
根目录 > 反应目录 > src > App.js
import React from 'react'
import './App.css'
import Jobs from './Jobs'
const JOB_API_URL = 'http://localhost:3000/'
async function fetchJobs(updateCb) {
const res = await fetch(JOB_API_URL)
const json = await res.json()
updateCb(json)
}
function App() {
const [ jobList, updateJobs ] = React.useState([])
React.useEffect(() => {
fetchJobs(updateJobs)
}, [])
return (
<div className="App">
<Jobs jobs={ jobList } />
</div>
);
}
export default App
根目录 > 工作目录 > 任务目录 > fetch-github.js
const fetch = require('node-fetch')
const redis = require('redis')
const client = redis.createClient()
const { promisify } = require("util");
const setAsync = promisify(client.set).bind(client);
const baseURL = 'https://jobs.github.com/positions.json'
async function fetchGithub() {
let resultCount = 1
let onPage = 0
let allJobs = []
// fetch all pages
while( resultCount > 0 ) {
const res = await fetch(`${baseURL}?page=${onPage}`)
const jobs = await res.json()
allJobs.push(...jobs)
resultCount = jobs.length
console.log('got', jobs.length, 'jobs')
onPage++
}
console.log('got ' + allJobs.length + ' jobs total' )
// filter algorithm
const jrJobs = allJobs.filter(job => {
const jobTitle = job.title.toLowerCase()
let isJunior = true
// logic
if (jobTitle.includes('senior') || jobTitle.includes('manager') ||
jobTitle.includes('sr.') || jobTitle.includes('architect')) {
return false
}
return true
})
console.log('filtered down to ' + jrJobs.length)
// set in redis
const success = await setAsync('github', JSON.stringify(jrJobs))
console.log({success})
}
module.exports = fetchGithub
根目录 > api 目录 > index.js
const express = require('express')
const app = express()
const port = 3001
const redis = require('redis')
const client = redis.createClient()
const { promisify } = require("util");
const getAsync = promisify(client.get).bind(client);
app.get('/jobs', async (req, res) => {
const jobs = await getAsync('github')
res.header('Access-Control-Allow-Origin', 'http://localhost:3000')
return res.send(jobs)
})
app.listen(port, () => {
console.log(`Example app listening at http://localhost:${port}`)
})
解决方案
推荐阅读
- python - 我无法使用 Pil(python) 保存为 tga 格式
- regex - Notepad++ 正则表达式 - 如何找到一个字符串并将其移动到行尾?
- c++ - 原子清除无符号整数的最低非零位
- tensorflow - Tensorflow 中哪个函数类似于 Pytorch 中的 expand_as
- java - 无法将对象从控制器传递到spring mvc中的查看页面
- css - css旋转不暂停
- git - 如何将特定更改从本地仓库推送到远程仓库 [GITHUB]?
- python - 如何指定决策树的 graphviz 表示的 figsize?
- javascript - 如何使VuetifyJS中数据表的扩展槽中的内容可搜索?
- java - Spring Boot 内容协商配置