AWS усилить запоминать вошедшего в систему пользователя в приложении React Native - PullRequest
Новая
       6

AWS усилить запоминать вошедшего в систему пользователя в приложении React Native

0 голосов
/ 25 сентября 2018

Я только начал изучать AWS ample как бэкэнд для моего собственного приложения реакции.Будучи истинным новичком в использовании сервиса, я хочу, чтобы мое приложение запоминало вошедшего в систему пользователя каждый раз, когда я обновляю эмулятор.

Я знаю из расширенной документации AWS, что для этой цели могу использовать функцию Auth currentAuthenticatedUser , но я не знаю, как реализовать код для этой цели.

Мое приложение выглядит так:

App.js 

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import AuthTabs from './components/AuthTabs';
import NavigationTab from './components/NavigationTab';

import Amplify, { Auth } from 'aws-amplify';
import AWSConfig from './aws-exports';

Amplify.configure(AWSConfig);

export default class App extends React.Component {
   state = {
   isAuthenticated: false
}

authenticate(isAuthenticated) {
   this.setState({ isAuthenticated })
}

render() {
  if (this.state.isAuthenticated) {
    console.log('Hello', Auth.user.username)
    return(
      <View style={styles.container}>
        <Text style={styles.textStyle}>
          Hello {Auth.user.username}!
        </Text>
        <NavigationTab
          screenProps={
            {authenticate: this.authenticate.bind(this)}
          }
        />
      </View>
    )
  }
  return (
    <View style={styles.container}>
    <AuthTabs
      screenProps={
        {authenticate: this.authenticate.bind(this)}
      }
    />
    </View>
  )
  }
}

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

Ответы [ 2 ]

0 голосов
/ 02 января 2019

Я тоже придумал подобное решение.Но вместо конструктора я использую метод жизненного цикла componentDidMount () для вызова метода, который я назвал loadApp () .

import React from 'react'
import {
  StyleSheet,
  View,
  ActivityIndicator,
} from 'react-native'

import Auth from '@aws-amplify/auth'

export default class AuthLoadingScreen extends React.Component {
  state = {
    userToken: null
  }
  async componentDidMount () {
    await this.loadApp()
  }
  // Get the logged in users and remember them
  loadApp = async () => {
    await Auth.currentAuthenticatedUser()
    .then(user => {
      this.setState({userToken: user.signInUserSession.accessToken.jwtToken})
    })
    .catch(err => console.log(err))
    this.props.navigation.navigate(this.state.userToken ? 'App' : 'Auth')
  }
  render() {
    return (
      <View style={styles.container}>
        <ActivityIndicator size="large" color="#fff" />
      </View>     
    )
  }
}
const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#aa73b7',
    alignItems: 'center',
    justifyContent: 'center',
  },
})

loadApp () попытается получить токен JWT пользователя, вызвав AWS Amplify currentAuthenticatedUser () метод.Полученный токен затем сохраняется в компоненте состояние .

Я использовал Реагирует с версией навигации 2 , чтобы перейти к экрану приложения или к экрану стека аутентификации в зависимости от ее статуса: вошел в систему или не вошел в систему.

0 голосов
/ 29 декабря 2018

Я использовал это так: 

currentUser = () => {
    Auth.currentAuthenticatedUser()
      .then(user => {
        console.log("USER", user);
        this.props.navigation.navigate("App");
      })
      .catch(err => {
        console.log("ERROR", err);
      });
  };

так что можно вызвать его в конструкторе при обновлении приложения, и если пользователь аутентифицирован, перейти на главный экран, но если это не так, остатьсяна экране входа в систему.Приветствия.

...