Node.js React Native |未处理承诺JSON解析错误
我尝试使用react native和nodejs中编写的一些api创建一个简单的登录/注册系统。对于身份验证系统,我使用jwt 这是我的登录API的代码:Node.js React Native |未处理承诺JSON解析错误,node.js,api,react-native,authentication,Node.js,Api,React Native,Authentication,我尝试使用react native和nodejs中编写的一些api创建一个简单的登录/注册系统。对于身份验证系统,我使用jwt 这是我的登录API的代码: router.post('/login', async (req, res) => { const { error } = loginValidation(req.body); if ( error ) return res.status(400).send(error.details[0].message); //Che
router.post('/login', async (req, res) => {
const { error } = loginValidation(req.body);
if ( error ) return res.status(400).send(error.details[0].message);
//Checking if the mail exists
const user = await User.findOne({email: req.body.email});
if ( !user ) return res.status(400).send('Email not found');
//Password is correct
const validPassword = await bcrypt.compare(req.body.password, user.password);
if ( !validPassword ) return res.status(400).send('Invalid password');
//Create and assign the JWT
const token = jwt.sign({_id: user._id}, process.env.TOKEN_SECRET);
res.header('auth-token', token).send(token);
});
这是用react native编写的登录表单的代码:
<View style={{flex: 4, justifyContent: 'center', width: '100%'}}>
<View style={{height: '70%', width: '100%'}}>
<Text style={styles.question}>
ACCEDI
</Text>
<View style={{width: '100%', paddingTop: '5%', paddingHorizontal: '10%'}}>
<Form
ref='form'
options={options}
type={User}
value={this.state.value}
onChange={this._onChange}
/>
</View>
<View style={{width: '100%', flexDirection:'row', alignItems: 'center'}}>
<View style={{width: '10%'}}></View>
<View style={{width: '70%'}}>
<TouchableOpacity style={styles.buttonpassword} onPress={ () => this.props.navigation.navigate('pippo') }>
<Text style={styles.signup}>
Hai dimenticato la password?
</Text>
</TouchableOpacity>
</View>
</View>
<View style={{alignItems: 'center'}}>
<View style={{height: 50, width: 150, alignItems: 'center', paddingTop: '2%'}}>
<TouchableOpacity style={styles.button} onPress={this._handleAdd}>
<Text style={styles.buttonText}>Login</Text>
</TouchableOpacity>
</View>
</View>
</View>
</View>
问题是在单击按钮时出现的。我有一个错误:
[未处理的承诺拒绝:语法错误:JSON解析错误:意外标识符eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9]
tryCallOne中的node_modules/promise/setimmediate/core.js:37:14
node_modules/promise/setimmediate/core.js:123:25 in
。。。框架内部的8个堆叠框架
编辑
console.logresponse返回以下内容:
Response {
"_bodyBlob": Blob {
"_data": Object {
"blobId": "1311DDB1-F839-403E-9FEF-E7D3072F9AA1",
"name": "login.html",
"offset": 0,
"size": 149,
"type": "text/html",
},
},
"_bodyInit": Blob {
"_data": Object {
"blobId": "1311DDB1-F839-403E-9FEF-E7D3072F9AA1",
"name": "login.html",
"offset": 0,
"size": 149,
"type": "text/html",
},
},
"headers": Headers {
"map": Object {
"auth-token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1ZDhmN2UyNjdlZTIwNTI5ZDI1YjUzM2IiLCJpYXQiOjE1Njk2OTAxOTV9.K_sCEXG2obYE2y-wbX02Tqq_yG8rsOCZKr1YyZlurMQ",
"connection": "keep-alive",
"content-length": "149",
"content-type": "text/html; charset=utf-8",
"date": "Sat, 28 Sep 2019 17:03:15 GMT",
"etag": "W/\"95-Gmy4omr48TDbf5eqm/r1yJHUQRg\"",
"x-powered-by": "Express",
},
},
"ok": true,
"status": 200,
"statusText": undefined,
"type": "default",
"url": "http://localhost:3000/api/user/login",
}
我认为问题在于: res.header'auth-token',token.sendtoken 您基本上是按原样发送令牌,而不是按json发送。 但在前端代码中,您需要json 尝试这样做:
res.header('auth-token', token).send({token: token});
在后端,使用而不是res.send:它将强制负载为JSON.stringify,并相应地指定内容类型。或者手动jsonify令牌:res.sendJSON.stringifytoken
因为您的问题是前端需要JSON,但您的服务器发送的是普通数据:您的令牌(应用了JSON.stringify)将封装在双引号中,使其在另一端可读为JSON。将return response.JSON更改为response并删除console.log。将代码编辑为
.then((response) => response.text())
.then((res) => {console.log("res is",res);}
响应是什么样子的?@DaveNewton我不明白你的意思不,问题是Persistry对你发送回来的所有数据都做了同样的处理:例如:res.status400.send{message:'Email not found'}你收到的消息意味着API的响应不是有效的json。在返回响应之前,请尝试放置一个console.logresponse。jsonI只需使用console.logresponse的结果编辑我的问题。您能提供一段代码作为示例吗?
.then((response) => response.text())
.then((res) => {console.log("res is",res);}