'JSON Parse错误无法识别的令牌'<' '来自React-Native的组件的POST请求的错误

时间:2018-04-14 13:41:12

标签: javascript node.js reactjs react-native

import React from 'react';
import {StyleSheet, Text, View, TextInput, KeyboardAvoidingView, Keyboard, TouchableOpacity, AsyncStorage} from 'react-native';
import {StackNavigator} from 'react-navigation';
export default class Broadcast extends React.Component {
    constructor(props){
        super(props);
        this.state ={
            username: ''
        }
    }
    componentDidMount(){
        this._loadInitialState().done();
    }
    _loadInitialState=async()=>{
        var user= await AsyncStorage.getItem('user');
        console.log(user+'*********************')
        if(user!==null){
            this.setState({
                username:user
            });
        }
    }
    render() {
        this.broadcastList();
    return ( 
        <KeyboardAvoidingView behavior='padding' style={styles.wrapper}>
            <View style={styles.container}>
                <Text style={styles.header}>Broadcast Page</Text>
            </View>
        </KeyboardAvoidingView>
    );
  }
  broadcastList=()=>{
      console.log(this.state.username);
        fetch(`http://192.168.137.1:3000/getBroadcastList?id=${this.state.username}`,{
            method:'POST',
            headers:{
                'Accept':'application/json',
                'Content-Type':'application/json',
            },
            body: JSON.stringify({
            })
        }) //backend IP :')
        .then((response)=> response.json())
        .then((res)=>{
            if(res.success===true){
                AsyncStorage.setItem('changeInBroadcastList',false);
                AsyncStorage.setItem('broadcastList',res.broadcastList);

            }
            else{
                AsyncStorage.setItem('loginSuccess',false);
                alert(res.message);
            }
        })
        .done();
    }
}
const styles=StyleSheet.create({
    wrapper:{
        flex:1
    },
    container:{
        flex:1,
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#fff0f0',
        paddingLeft: 40,
        paddingRight: 40
    },
    header:{
        fontSize: 24,
        marginBottom:60,
        color:'#000000',
        fontWeight: 'bold',
    },
    textInput:{
        alignSelf: 'stretch',
        padding:16,
        marginBottom:20,
        backgroundColor:'#fff',
    },
    btn:{
        alignSelf: 'stretch',
        backgroundColor:'#f0f0ff',
        padding:20,
        alignItems: 'center',
    }
})

请原谅我的英语不好。我是Javascript的新手,我会尽力解释我的错误。上面的代码包含我的“广播”屏幕。我通过获取AsyncStorage中存储的值username来设置'user'的状态。

this.state.username this.broadcastList();中成功存储值render()之后JSON Parse error: Unrecognized token '<' tryCallOne Z:\saic\crossplatform\brodSaic\node_modules\promise\setimmediate\core.js:37:14 <unknown> Z:\saic\crossplatform\brodSaic\node_modules\promise\setimmediate\core.js:123:25 <unknown> Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\Core\Timers\JSTimers.js:297:23 _callTimer Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\Core\Timers\JSTimers.js:154:6 _callImmediatesPass Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\Core\Timers\JSTimers.js:202:17 callImmediates Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\Core\Timers\JSTimers.js:466:11 __callImmediates Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:329:4 <unknown> Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:147:6 __guardSafe Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:316:6 flushedQueue Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:146:17 invokeCallbackAndReturnFlushedQueue Z:\saic\crossplatform\brodSaic\node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:142:11 ,然后向服务器发出POST请求。

我的Node.js服务器像魅力一样运行,并成功将JSON返回给Postman的输出控制台。

This picture Depicts the successfully running Server code

但是当我尝试访问我的Broad Cast屏幕时,会出现此箭头。

requests.Session.get

请纠正我在问题中的基本错误,并帮助我解决此问题。我会非常感激。

0 个答案:

没有答案