Попытка сделать HTTP-запрос Axios с React Native to Flask backend - PullRequest
0 голосов
/ 19 сентября 2019

Я пытаюсь сделать HTTP-запрос через Axios изнутри реагировать нативно на мою конечную точку входа в бэкэнд-флеш-приложение, однако когда я запускаю Expo, введите имя пользователя и нажмите «Вход», мой онлайн-статус все еще остается «Не в сети».Может ли кто-нибудь помочь мне с этим?

Вот мой код фляги:

from flask import Flask, request, abort, jsonify

app = Flask(__name__)

users = []

@app.route("/login", methods=["POST"])
def login():
username = request.json.get('username', None)
if username is None or username in users:
    abort(401)
else:
    users.append(username)
    return jsonify({
    'status': 'OK',
    'message': 'Successfully Logged in'
    })


if __name__ == '__main__':
    app.run(debug=True, host='0.0.0.0')
#app.run(debug=True)
#app.run(debug=True, host='http://127.0.0.1:5000') 
#app.run(debug=True, host='http://146.203.130.213:5000')

Вот мой реактивный код:

import React from 'react';
import { StyleSheet, Text, View, TextInput, Button, FlatList } from 
'react-native';
import axios from 'axios';

const serverUrl = '{my IP address}:5000';
//const serverUrl = 'http://127.0.0.1:5000';
const http = axios.create({
baseURL: serverUrl,
}); 

export default class App extends React.Component {
constructor(props) {
 super(props);
  this.state = {
   input: '',
   messages: [],
  };
}

onLogin() {
 const { isLoggedIn, username } = this.state;
  if (!isLoggedIn) {
   http.post('/login', {username})
    .then(() => this.setState({isLoggedIn: true}))
    .catch((err) => console.log(err))
  }  
 }

render() {
 const { messages, isLoggedIn } = this.state;
  return (
  <View style={styles.container}>
   <View>
   <Text>Login</Text>
   <TextInput
   onChangeText={(val) => this.setState({username: val})}
   />
  <Button title='Login' onPress={() => this.onLogin()} />
  <Text> Online Status: {isLoggedIn ? 'Online' : 'OffLine'}</Text>
 </View>
</View>
);
}
}

const styles = StyleSheet.create({
  container: {
  flex: 1,
  backgroundColor: '#fff',
  alignItems: 'center',
  justifyContent: 'center',
  },
});

Любая помощь будеточень ценится.

...