5
respostas

Navigator Dando Conflito com SQLITE

Boa tarde, meu login e senha esta dentro do sqlite que foi instalado no meu projeto. e estou usando esse código para ver se a senha e login são corretos.

var SQLite = require('react-native-sqlite-storage')
var db = SQLite.openDatabase({name: 'test1.db', createFromLocation: '~cestabasica.db'}, this.openCB, this.errorCB)

export default class Form extends Component <{}> {

  constructor(props) {
    super(props)

    this.state = {

      username:'',
      password:''
      }
     };

      errorCB(err){
      ToastAndroid.show("SQL Error: " + err, ToastAndroid.SHORT);
      }

      sucessCB(){
        ToastAndroid.show("SQL execute fine", ToastAndroid.SHORT);
      }

      openCB(){
        console.log("Open database");
      }

    onPressButtonLogin=() => {  
      db.transaction((tx) => {
        var sql = 'SELECT * FROM user WHERE username=\'' + this.state.username + '\'';
        tx.executeSql (sql, [], (tx, results) => { 
          var len = results.rows.length;
          if(len == 0 )
            ToastAndroid.show ('Usuario Incorreto', ToastAndroid.SHORT);
              else {
              var row = results.rows.item(0);
          if (this.state.password == row.password) 
            ToastAndroid.show('Tudo Ok', ToastAndroid.SHORT);

              else ToastAndroid.show ('Senha Incorreta', ToastAndroid.SHORT);
              }
     });
  });



}



  render() {
    return (

    <View style={style.container}>
        <TextInput style={style.inputBox}  
          underlineColorAndroid = 'rgba(0,0,0,0)'
          onChangeText={username => this.setState ({username})}
          placeholder= "Login" 
          placeholderTextColor = "#ffffff"
          onSubmitEditing={()=> this.refs.txtPassword.focus()}/>

        <TextInput style={style.inputBox}  
          underlineColorAndroid = 'rgba(0,0,0,0)'  
          onChangeText={password => this.setState ({password})}
          placeholder= "Senha"
          secureTextEntry={true}
          placeholderTextColor = "#ffffff"
          ref= {"txtPassword"}/>

          <TouchableOpacity style={style.button} onPress = {this.onPressButtonLogin} > 
            <Text style={style.buttontext}> Entrar </Text>            
          </TouchableOpacity>
        </View>

        )
}
}

E assim importei o form para o login só que vou fazer a instalação do navigator para fazer navegação screen o sqlite para de funcionar, me ajudem por favor.

Quando dou React-native run-android da 9 erros e fala que é no SQLITE

5 respostas

:app:prepareAppleReactNativeSqliteStorageUnspecifiedLibrary FAILED

FAILURE: Build failed with an exception.

  • What went wrong: Execution failed for task ':app:prepareAppleReactNativeSqliteStorageUnspecifiedLibrary'.

    Could not expand ZIP 'C:\Users\lcwln\apple\node_modules\react-native-sqlite-storage\src\android\build\outputs\aar\react-native-sqlite-storage-release.aar'.

  • Try: Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.

BUILD FAILED

Total time: 36.85 secs Could not install the app on the device, read the error above for details. Make sure you have an Android emulator running or a device connected and have set up your Android development environment: https://facebook.github.io/react-native/docs/getting-started.html

ISSO FOI DEPOIS DE INSTALAR O yarn add react-native-navigation@latest

Fala Matheus, tudo bem ?

Vi e respondi uma outra dúvida sua a respeito. Mas segue aqui também.

O problema ao fazer o build da app já traz como primeira suspeita justamente o problema de conflito entre o código das libs, lembre-se que para linkar a lib de navegação é preciso adicionar a referencia do projeto android do react native navigator como dependencia ao projeto base. Dê uma olhada na documentação que ela apresenta o que é necessário => https://wix.github.io/react-native-navigation/#/installation-android

Outra questão que é interessante comentar é que não é uma boa prática manter os dados de acesso no dispositivo local. Em geral nas aplicações para autenticação temos um backend preparado para receber uma requisição com os dados de acesso e ele faz toda a verificação acesso a dados de cadastro etc. Ao autenticar, em geral, o backend te devolve a representação da autenticação do usuário (algo como nome de usuário, um token de acesso que pode ter validade etc), protegendo assim dados sensíveis como uma senha. Você poderia pegar essa informação devolvida e usar AsyncStorage da api natural do react native para salvar, não sendo necessário assim o uso de uma lib como a sqlite react native.

Percebi que para efetuar a autenticação você tenta usar o sqlite efetuando uma query pra buscar os dados do usuário e verificar. Nesse ponto é importante comentar que seu código pode sofrer com SQL Injection, pesquise sobre ela e dê uma olhada nisso.

Enfim, espero ter ajudado no pensamento. Abraço!

Oi boa tarde, eu olhei a documentação depois que eu mandei essa pergunta , e o necessário era só instalar o npm install --save react-navigation e assim não corrompia nada e não precisaria alterar e nem adicionar nada também como no vídeo, foi bem pratico e conseguir navegar entre as telas.

Eu estou seguindo essa carreira com React-Native e estou gostando demais até peguei um projeto de uma empresa para fazer, vocês poderiam postar mais aulas , por exemplo como importar variável tambem como fazer contato com uma api e retornar informação da api dando insert no sqlite é muito bom tambem, obrigado tenha uma boa tarde

Uma pergunta para usar essa api que você disse com itoken precisa de internet certo?? é que o aplicativo que estou fazendo vai ser usado Offline para consultar dados de clientes, unica vez que usara internet é quando ligar o wi-fi ele ira mandar uma requisição web service que depois disso dará um insert no sqlite de dados que não estão dentro do banco sqlite e assim por diante sempre que tiver dados novos no banco do servidor e o celular ligar o wifi ou internet móvel atualizara apenas.

Fala Matheus,

Então, não é bom manter dados sensíveis localmente. Ainda acho que o ideal é vc, nessas poucas vezes que o app se comunica com a web, (se necessário) mandar os dados do form de login e realizar a autenticação externa, recebendo apenas um token que representa a autenticação do usuário (fazemos isso na parte 2 do curso de React Native da Alura). Uma vez recebido esse token você pode armazená-lo no dispositivo. Os armazenados dados são persistentes (pode fechar o app, desligar, abrir de novo e vão estar lá), então a única forma de remover o dado de autenticação (token, por exemplo) do dispositivo é gerenciando os apps pelo SO e eliminando os dados manualmente ou desinstalando o app.

De novo, atente-se para a forma como está escrevendo as queries, com base nas concatenações é possível a partir de um formulário o usuário injetar sql na sua query programada. O problema de SQL Injection => https://pt.wikipedia.org/wiki/Inje%C3%A7%C3%A3o_de_SQL

Sobre a primeira resposta temos dois cursos de React Native na plataforma, e algumas das coisas citadas por você são objeto de estudo (consumo de dados de apis por exemplo). Alguns estão fora de escopo como o uso do SQLite e não são abordados.

Tenha cuidado pois a lib de navegação que você está utilizando (React Navigation) é diferente da usada no curso (React Native Navigation), por isso a instalação foi diferente. São dois projetos diferentes desenvolvidos e com APIs diferentes umas das outras. A lib de navegação usada no curso é recomendação de uso do próprio React Native nos casos onde se busca um comportamento mais próximo dos nativos, conforme é possível ver aqui => https://facebook.github.io/react-native/docs/navigation.html