React-native: iOS: NetInfo.isConnected retorna sempre falso

Também posso reproduzir isso com RN 0.29.0. Eu estava executando o 0.26.2 anteriormente e funcionou bem com ele. Vou tentar compilar a partir do código-fonte e depurar.

+1

Já relatei o mesmo problema antes: https://github.com/facebook/react-native/issues/8469

Uma solução rápida é adicionar um manipulador de eventos NetInfo.isConnected.addEventListener('change', Function.prototype)

+1 e mesmo problema com NetInfo.fetch (). Done () - sempre retorna unknown

Eu resolvi assim:

componentDidMount() {
  const dispatchConnected = isConnected => this.props.dispatch(setIsConnected(isConnected));

  NetInfo.isConnected.fetch().then().done(() => {
    NetInfo.isConnected.addEventListener('change', dispatchConnected);
  });
}

+1

encontramos esse bug em 0.29.2 ..

encontramos esse bug em 0,28

0.30.0 ainda não funciona

O código relevante não mudou, então faz sentido que ainda não esteja funcionando.

Observe que já relatei o bug aqui: https://github.com/facebook/react-native/issues/8469 onde detalha a causa e tem um código de amostra anexado. Por isso, acho que faz sentido deixá-lo fechado.

O número de edições abertas do RN cresce diariamente, por isso é importante fazer a nossa parte e consolidar onde for possível.

Observei o mesmo problema hoje

Estou usando a versão 0.30.0, e também encontrei este erro.

o mesmo problema para mim, estou usando [email protected] e a busca sempre retorna desconhecido.

Mas podemos usar addEventListener em vez disso.

NetInfo.addEventListener('change',
    (networkType)=> {
        this.setState({networkType})
    }
)

ao invés de:

NetInfo.fetch().done(
    (networkType)=> {
        this.setState({networkType})
    }
)

@ facebook-github-bot bug

Estou tendo esse problema em 0.31. Isso será corrigido?

mesmo para 0,32

@knowbody Como seu snippet funciona? Eu preciso definir um método setIsConnected na minha classe ou como uma função global ou qualquer outra coisa? Porque, na verdade, eu tenho um erro que disse Can't find variable: setIsConnected

@florentsorel então em meu projeto eu uso redux para gerenciamento de estado e setIsConnected é meu criador de ação, que se parece com algo como:

actions/network.js

export const setIsConnected = (isConnected) => ({
  type: 'SET_IS_CONNECTED',
  isConnected
});

e então eu tenho um redutor network :

reducers/network.js

const initialState = {
  isConnected: true
};

const network = (state = initialState, action) => {
  switch (action.type) {
    case 'SET_IS_CONNECTED':
      return {
        isConnected: action.isConnected
      };

    default:
      return state;
  }
}

export default network;

+1

Estou tendo esse problema na v0.34.1

Editar: Atualizado para v0.35.0 e mesmo problema.

mesmo na v0.35.0

Estou tendo o mesmo problema na v0.36.0

O snippet

@Dnld : @Ehesp diz que funciona no v.036, você e mais 5 não? Isso não é resolvido eventualmente? Também costumava ter problemas com o 0,33 e gostaria de fazer um upgrade. Obrigado.

O código subjacente não mudou realmente, então eu ficaria surpreso se isso fosse "consertado".

Eu coloquei correção entre aspas porque parece que a motivação para essa mudança é apenas configurar a máquina nativa que observa o status da rede se o código do aplicativo estiver interessado em observá-lo.

Os aplicativos registram interesse adicionando um ouvinte de eventos que começa a verificar a acessibilidade .

Neste ponto, parece que esse é o comportamento desejado, então talvez seja necessária uma alteração na documentação. NetInfo.isConnected retorna um booleano, portanto, não expressa que o estado é desconhecido e que isso não mudará até que você adicione um ouvinte de evento. Alternativamente, a função pode ser alterada para retornar null ou um booleano.

Meus aplicativos têm um código muito semelhante ao que @knowbody postou. Eu não chamo NetInfo.isConnected.fetch() alguma, pois é inútil na inicialização.

Presumo que haja conectividade, adicione o ouvinte e, em seguida, o estado será atualizado quando o estado de conectividade não for mais desconhecido.

0.34.1 ainda não funciona

Mesmo problema com RN 0.37.0

@ xing-zheng por algum motivo sua solução só retorna 'MOBILE', mesmo quando desligo o wifi do meu computador, o que deve refletir no meu emulador. Alguma ideia do porquê?

componentDidMount() { NetInfo.addEventListener('change', (networkType)=> { this.setState({connected: networkType}) } ) }

Mesmo problema com RN 0.38.0

mesmo em 0,39 também

Quando tento a solução addEventListener, o NetInfo detecta apenas uma ou duas alterações de conexão. Por exemplo, se eu começar com uma conexão e depois descartá-la, o Netinfo detectará isso, mas se eu reconectar, ele não detectará que agora estou conectado. O NetInfo está produzindo muitos falsos positivos em meu aplicativo, mesmo com a solução alternativa. Alguém mais está experimentando o mesmo?

Tive que construir uma solução alternativa estranha para resolver isso. Por algum motivo, um método funciona no Android e o outro no iOS. Uma solução para isso seria ótimo.

function handleFirstConnectivityChange(isConnected) {
    if (!sConnected) {
     // do action
    } 
    NetInfo.isConnected.removeEventListener('change', handleFirstConnectivityChange);
}

if (Platform.OS === 'ios') {
    NetInfo.isConnected.addEventListener('change', handleFirstConnectivityChange); 
} else {
    NetInfo.isConnected.fetch().then(isConnected => {
    if (!sConnected) {
        // do action
    } 
}

@ robertodias180 não está funcionando.

RN- 0,39+

function handleFirstConnectivityChange (isConnected) {
if (! sConnected) {
// fazer ação
}
NetInfo.isConnected.removeEventListener ('alterar', handleFirstConnectivityChange);
}

if (Platform.OS === 'ios') {
NetInfo.isConnected.addEventListener ('alterar', handleFirstConnectivityChange);
} outro {
NetInfo.isConnected.fetch (). Then (isConnected => {
if (! sConnected) {
// fazer ação
}
}

Você pode me ajudar?

@imbudhiraja funciona em alguma das plataformas?

Não, não estava funcionando em nenhuma plataforma

obrigado
Manish Budhiraja

Em 3 de janeiro de 2017, 20:12, "Roberto Dias" [email protected] escreveu:

@imbudhiraja https://github.com/imbudhiraja funciona em qualquer um dos
plataformas?

-
Você está recebendo isso porque foi mencionado.
Responda a este e-mail diretamente, visualize-o no GitHub
https://github.com/facebook/react-native/issues/8615#issuecomment-270128504 ,
ou silenciar o tópico
https://github.com/notifications/unsubscribe-auth/AVTjXHSe8OcVq8fQ5XVk8hh9XXHfHFVZks5rOl5ggaJpZM4JGaBc
.

Parece que podem haver dois problemas:

1. isConnected.fetch parece estar quebrado no iOS - a correção deve ser direta. A solução alternativa postada por @ robertodias180 faz sentido porque consulta o código nativo com outro método.
2. A fragilidade do NetInfo descrita por @Aristekrat . Isso é mais preocupante - alguém pode ajudar a fornecer uma maneira detalhada de reproduzir este problema? Então, devo ser capaz de ajudar a consertá-lo.

RN 0.38.1 e anteriores, simulador iOS.

componentDidMount() {
    NetInfo.isConnected.fetch().then(this._handleConnectionInfoChange);
    NetInfo.isConnected.addEventListener(
        'change',
        this._handleConnectionInfoChange
    );
 }

 componentWillUnmount(){
     NetInfo.isConnected.removeEventListener(
        'change',
        this._handleConnectionInfoChange
    );
 }

_handleConnectionInfoChange(isConnected){
    this.props.connectActions.netInfo(isConnected);

    dbg('connected', isConnected);

};

O NetInfo.isConnected.fetch().then(this._handleConnectionInfoChange); recupera corretamente o status da conexão atual. No entanto, as alterações subsequentes no status da conexão não são capturadas pelo eventListener.

Eu tenho tido esse problema para muitas versões RN agora.

@imbudhiraja acabei mudando o código para algo "mais limpo". Tenho um utilitário que mostra o estado atual da conexão de rede. Isso está funcionando em ambas as plataformas. I initializeConnection quando o aplicativo é aberto e isConnected quando eu preciso. Observe que pode demorar um pouco até que NetInfo obtenha o status de conexão quando o aplicativo for aberto (especialmente no Android). Acabei de atrasar até hasConnection !== null . Espero que ajude

const hasConnection = null;

export const initializeConnection = () => {

  const dispatchConnected = isConnected => { hasConnection = isConnected; };

  NetInfo.isConnected.fetch().then().done(() => {
    NetInfo.isConnected.addEventListener('change', dispatchConnected);
  });

}

export const isConnected = () => {
  NetInfo.fetch().done((reach) => {
    console.log('Initial: ' + reach);
  });
  return hasConnection;
}

Tentei algo semelhante, continuo correndo para a situação de que o eventListener não detecta quando a conexão retorna (no simulador).

Recarregar aplicativo sem conexão com a Internet => Detectado
Ligar a Internet novamente => NÃO detectado

Recarregue o aplicativo com conexão à Internet => Detectado
Desligue a Internet => Detectado
Ligar a Internet novamente => NÃO detectado

<strong i="11">@autobind</strong>
export default class ConnectionToast extends React.Component {

    constructor(props){
        super(props);
    }

    componentDidMount() {
        NetInfo.isConnected.fetch()
            .then(this._handleConnectionInfoChange)
            .done(this._addListener);
     }

     componentWillUnmount(){
         this._removeListener();
     }

     _addListener(){
         NetInfo.isConnected.addEventListener(
             'change',
             this._handleConnectionInfoChange
         );
     }

     _removeListener(){
         NetInfo.isConnected.removeEventListener(
            'change',
            this._handleConnectionInfoChange
        );
     }

    _handleConnectionInfoChange(isConnected){
        this.props.connectActions.netInfo(isConnected);

        dbg('connected', isConnected);

        // this._removeListener();
        // this._addListener();

    }

[...]

Tentei remover e readicionar o ouvinte a cada mudança, mas sem alegria.

@mschipperheyn Estou enfrentando exatamente o mesmo problema usando a abordagem que @knowbody postou anteriormente.

Os documentos também indicam que ele trataria apenas a primeira alteração por meio de handleFirstConnectivityChange . Isso está correto ou deve detectar todas as alterações subsequentes?

Assegure-se de ter

definido em seu arquivo de manifesto do Android. Este me fez tropeçar.

Mesmo problema com RN 0.41.0

no iOS, não adicione ouvinte e não registre SCNetworkReachabilitySetCallback. certamente não está funcionando. qual é o propósito do design?

mesmo para 0.41.2

@djohnkirby Seu comentário está faltando o XML que eu acho que você pretendia postar - você pode

A linha a ser adicionada a você AndroidManifest.xml é:

 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

0.39.2: Mesmo problema. Não apenas NetInfo fetch result é sempre false , mas também detecta uma mudança de status de conexão rapidamente após o aplicativo iniciar

0.42.0: mesmo problema. Também descrevi meu problema aqui: https://stackoverflow.com/questions/42642034/check-for-internet-connection-returns-wrong-results
Estou testando no iOS e macOS Sierra.

ATUALIZAÇÃO : Meu problema foi por causa dos testes no simulador, em um aparelho real tudo está funcionando. Respondido no link acima.

Eu tenho o mesmo problema :(

NetInfo.isConnected.fetch().then((isConnected) => { console.log(isConnected); });
// always return false

Caso alguém queira saber se o aplicativo está rodando no simulador ou não: http://stackoverflow.com/a/34732015/552669

Não é um bug. O módulo nativo RCTNetInfo é uma subclasse de RCTEventEmitter , então devemos adicionar um observador para acionar o método startObserving .
No processo de inicialização do seu aplicativo, adicione um observador arbitrário ao NetInfo, então você pode chamar a função fetch . (NetInfo.isConnected realmente chama a função fetch)

De acordo com as sugestões de
Parece funcionar, mas me pergunto se funcionará em todos os casos

export function isNetworkConnected() {
  if (Platform.OS === 'ios') {
    return new Promise(resolve => {
      const handleFirstConnectivityChangeIOS = isConnected => {
        NetInfo.isConnected.removeEventListener('change', handleFirstConnectivityChangeIOS);
        resolve(isConnected);
      };
      NetInfo.isConnected.addEventListener('change', handleFirstConnectivityChangeIOS);
    });
  }

  return NetInfo.isConnected.fetch();
}

O mesmo problema. 0,40

Eu estou experimentando o mesmo problema

0.42.3 - Tive o mesmo problema ao executar o iOS no simulador e em um dispositivo real. Usar a solução de @ Knight704 mitigou o problema.

O mesmo em 0.42.3

mesmo em 0.43.1

Vendo isso em 0,40

tendo esse problema também. Consegui fazê-lo funcionar aleatoriamente e, em seguida, ele parou de funcionar.

A solução de @ Knight704 funcionou a princípio para mim, mas por algum motivo, uma vez que a chamo de dentro da segunda camada de um navegador em um modal, a função para de funcionar (handleFirstConnectivityChangeIOS nunca é chamado), mesmo depois de fechar o modal. Comportamento muito estranho, nenhuma ideia do porque isso não está funcionando ou se é outra coisa na minha base de código que não está funcionando bem com o NetInfo.

o que estou perdendo?

    this.state = {
            isConnected: null,
     }
    componentDidMount() {
        console.log('first one ', this.state.isConnected)
        NetInfo.isConnected.addEventListener(
            'change',
            this._handleConnectivityChange
        );
        console.log('second ', this.state.isConnected)
        NetInfo.isConnected.fetch().done(
            (isConnected) => {this.setState({isConnected});}
        );
        console.log('third ', this.state.isConnected)
    }
    componentWillUnmount(){
        console.log('did it unmount ', this.state.isConnected)
        NetInfo.isConnected.removeEventListener(
            'change',
            this._handleConnectionInfoChange
        );
        console.log('it did unmount ', this.state.isConnected)
    }
    _handleConnectivityChange = (isConnected) => {
        this.setState({
            isConnected,
        });
    };
   render() {
      console.log('fourth ', this.state.isConnected)
        if(this.state.isConnected === false){
            const connectAlert = (Alert.alert(
                'ERROR',
                'No connection bro!',
                [
                    {text: 'OK'},
                ]
            ))
        }
        return ()
}

então quando eu o executo, ele me alerta às vezes, nem sempre ....

estes são os registros do console que retornam quando me dá um alerta, mesmo quando há conexão:

'fourth ', null
'first one ', null
'second ', null
'third ', null
'fourth ', false
'fourth ', true

Enfrentando o mesmo problema que @SteffeyDev quando uso a correção de @ Knight704 em https://github.com/facebook/react-native/issues/8615#issuecomment -287977178 Na maioria dos casos, isso funciona bem, no entanto, quando tenho modais push ou popped o mesmo código nunca resolverá, pois estou assumindo que o evento change já foi emitido.

Percebi que, nessas condições, NetInfo.fetch() retornaria um estado unknown (isso acionaria um false sob NetInfo.isConnected.fetch() e, portanto, fui capaz de contornar isso com a seguinte modificação na solução alternativa original:

export function isNetworkConnected() {
  return NetInfo.fetch().then(reachability => {
    if (reachability === 'unknown') {
      return new Promise(resolve => {
        const handleFirstConnectivityChangeIOS = isConnected => {
          NetInfo.isConnected.removeEventListener('change', handleFirstConnectivityChangeIOS);
          resolve(isConnected);
        };
        NetInfo.isConnected.addEventListener('change', handleFirstConnectivityChangeIOS);
      });
    }
    reachability = reachability.toLowerCase();
    return (reachability !== 'none' && reachability !== 'unknown');
  });
}

A condição unknown só é acionada no iOS, pois o Android retorna UNKNOWN . Este também é o motivo para minúsculas antes de retornar o status, pois isso deve reter mais ou menos o comportamento existente de NetInfo.isConnected.fetch .

mesmo em 0,44

A princípio observei que o NetInfo só deseja retornar a mudança de status da rede após um ciclo (ligado -> desligado). Acontece que só tem esse problema no simulador. Em um dispositivo real, ele dispara o retorno de chamada corretamente, mesmo para vários ciclos de conexão / desconexão.

Código de amostra

  NetInfo.addEventListener( 'change', this._onConnectivityChange );

  _onConnectivityChange(connType) {
    // Do something with connType...
  }

Esse problema me incomodou por um tempo e indiretamente acabei criando uma pequena biblioteca de utilitários focada em detecção RN offline / online, englobando padrões React típicos e uma boa integração com redux.

Funciona corretamente em dispositivos reais, Android e iOS. No entanto, também posso corroborar que às vezes o listener não é acionado no simulador iOS e o estado de conectividade fica inconsistente. Ainda não tentei as soluções propostas por @ knight704 e @Ignigena ( aqui e aqui respectivamente), mas provavelmente irei testá-las em breve, quando tiver algum tempo.

Um PR também é muito bem-vindo no caso de mais pessoas confirmarem que essas soluções funcionam perfeitamente!

Por favor conserte.

Se é improvável que isso seja corrigido em breve, podemos pelo menos atualizar os documentos para indicar que isso não funciona no iOS?

@ jpb12 talvez valha a pena fazer o PR e ver se eles o mesclam. Pode realmente tornar isso mais visível, pois parece ter sido esquecido.

Estou enfrentando esse problema na versão do Android. Parece estar relacionado com ir para o fundo e voltar para o primeiro plano. Infelizmente, não consigo reproduzir esse problema de maneira confiável, mas ele definitivamente acontece após várias transições de fundo / primeiro plano. Especialmente se o status da conexão foi alterado naquele momento

Quando isso acontece
NetInfo.isConnected.fetch().then(isConnected => {...}) sempre retorna false
NetInfo.fetch().then((reach) => {...}) sempre retorna NONE
adicionar / remover ouvintes não ajuda

Eu ficaria muito grato por qualquer maneira confiável de detectar o status real da conexão

Estou enfrentando um comportamento estranho porque isConnected retorna verdadeiro ao conectar ao wi-fi (até agora está ok), mas se o modem não alcançar a internet, isConnected ainda é verdadeiro. Não tenho certeza de como verificar com eficácia a conexão com a Internet, não apenas a conexão com a rede. Alguma ideia? obrigado

@kodatech Este módulo deve ajudá-lo a resolver esse problema. Eu o usei recentemente em um projeto e o recomendo altamente https://github.com/rauliyohmc/react-native-offline

Muito obrigado @craigcoles

@ Knight704 obrigado mano.

@craigcoles Você tem algum código funcional que eu possa seguir?

@nmfzone Não tenho nada para mostrar a vocês, mas há muitos exemplos de código no Leiame 😃

Estou usando os eventos de ouvinte Netinfo da seguinte maneira, ele funciona muito bem em ambas as plataformas.
"reagir nativo": "0,43,4",

componentDidMount(){
        NetInfo.isConnected.addEventListener('change', this._handleConnectivityChange);

    }

    componentWillUnmount(){
        NetInfo.isConnected.removeEventListener('change', this._handleConnectivityChange);
    }

    _handleConnectivityChange = (isConnected) => {
         console.warn(isConnected);
    }

@ sumesh1993 Pela minha experiência, se o aplicativo Android foi minimizado (em segundo plano), ele não reage ao evento 'change' . Testado em meu Galaxy Note 5, Android 7.0

O módulo https://github.com/rauliyohmc/react-native-offline que foi recomendado acima apenas pingando https://google.com . Funciona, mas eu prefiro consertar esse bug

Isso faz sentido, pois os aplicativos Android são suspensos enquanto estão em segundo plano. Para receber eventos, você precisa criar um serviço que continuará a funcionar mesmo enquanto o aplicativo estiver suspenso.

Como alternativa, você pode adicionar um manipulador onResume ao aplicativo e consultar o status offline. Isso deve ser mais simples do que criar e gerenciar um serviço.

@ alsh76 para mim está funcionando quando o aplicativo está em segundo plano, não funciona quando o aplicativo é encerrado no menu multitarefa.
Resolvi isso chamando a função a seguir sempre que minha tela inicial era iniciada.
if(Platform.OS === 'android'){ NetInfo.isConnected.fetch().then(isConnected => { if(!isConnected) return; //Do something }); }

Encontrou o mesmo problema com o dispositivo virtual Android. Mas a questão é que estava tudo bem há alguns dias e ainda está no dispositivo iOS e emulador. Alguém encontrou uma maneira estável e correta de obter o status da conexão de rede?

Obrigado @ sumesh1993 que funcionou para mim no iOS!
@igorarkhipenko você tentou a sugestão dele?

Olá, você adicionou permissão, por exemplo, o Android precisa adicionar
AndroidManifest.xml
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

apenas uma pequena atualização nas soluções por @ Knight704 e @Ignigena, pois NetInfo.fetch está obsoleto agora. Isso funcionou para mim:
`` `
const isNetworkConnected = () => {
retornar NetInfo.getConnectionInfo (). then (acessibilidade => {
if (reachability.type === 'desconhecido') {
retornar nova promessa (resolver => {
const handleFirstConnectivityChangeIOS = isConnected => {
NetInfo.isConnected.removeEventListener ('connectionChange', handleFirstConnectivityChangeIOS);
resolver (isConnected);
};
NetInfo.isConnected.addEventListener ('connectionChange', handleFirstConnectivityChangeIOS);
});
}
return (reachability.type! == 'none' && reachability.type! == 'unknown')
});
}

Imho NetInfo.isConnected.fetch() é um recurso importante e deve ser corrigido o mais rápido possível!

@javache @sahrens @davidaurelio @janicduplessis @hramos @shergin @rigdern existe algum cronograma para isso?

THX!

@pensierinmusica Este é um projeto conduzido pela comunidade, então eu adoraria conseguir boas relações públicas.

@shergin Achei que o React Native foi criado, mantido e usado internamente pelo Facebook, e lançado sob uma licença BSD de 3 cláusulas por este motivo. Portanto, presumi que a equipe do Facebook consertaria bugs, especialmente os importantes. De qualquer forma, é bom saber que os PRs são bem-vindos!

cc @rigdern

Muito do código principal do RN é escrito e mantido pela comunidade.

E há muitos recursos e funcionalidades não usados ​​pelo Facebook, então é difícil para nós priorizá-los e preferir PRs da comunidade, onde o autor pode verificar a correção para seu bug / caso de uso.

Também estou tendo problemas em react 0.47.0 com ios.

@pensierinmusica, este problema deve ser definitivamente priorizado. O quão difícil pode ser ter um retorno booleano de .isConnected ()?

Tudo bem, aqui está uma solução alternativa pronta para o uso que deve funcionar (bem, para mim funciona). Eu envio uma solicitação de http para um site que sei que estará ativo e avalio a resposta.

Inicializei um repo que deve funcionar imediatamente. https://github.com/JamesDorrian/NetInfoCheckConnection/tree/master

Observação: certifique-se de alterar a variável httpAddress de https://www.galwaydaily.com para outra (talvez google.com), pois não posso garantir que estará sempre ativo. Espero que isso ajude alguém frustrado com a NetInfo!

@pensierinmusica @anujsinghwd

@JamesDorrian obrigado, acabei fazendo algo semelhante, executando o ping em "google.com".

Aqui está o snippet:

// /utilities/connectivity.js

import { Alert } from 'react-native';

export function warning () {
  Alert.alert(
    'No connection',
    'Mmm... you seem to be offline'
  );
};

export async function checkAsync () {
  try {
    const res = await fetch('https://google.com');
    if (res.status === 200) return true;
  } catch (e) {
    warning();
  }
  return false;
};

Ainda assim, esta é apenas uma solução temporária e acho que NetInfo.isConnected deve ser corrigido o mais rápido possível!

let isConnected = false;

Platform.OS === "ios" 
  ? (isConnected = await fetch("https://www.google.com"))
  : (isConnected = await NetInfo.isConnected.fetch());

Platform.OS === "ios" && (isConnected.status = 200)
  ? (isConnected = true)
  : (isConnected = false);

console.log(isConnected); //Result

Podemos parar com os +1 comentários sobre este assunto, é para isso que as reações são usadas.

ios:
primeiro pedido. se o servidor falhar, o telefone tem wi-fi.
NetInfo.isConnected.fetch (). Then ((isConnected) => {sempre falso}
0.49.3.

@kddc sua solução parece funcionar bem no desenvolvimento 👍

Basta adicionar a Biblioteca de Reachability em seu projeto XCode da Apple que serviu aqui , é a solução.

@fuatsengul Eu adicionei o projeto Reachability como uma biblioteca em meu projeto Xcode, mas o problema ainda não foi resolvido, você poderia me informar o que mais precisa ser feito para resolver o problema? Obrigado.

O problema parece ser apenas com a api fetch .. no entanto, adicionar listener de evento está funcionando em iOS .. No entanto, addEventListener não funciona no Android, então você precisa usar a API fetch :)

Aqui está meu snippet para fazê-lo funcionar nos dois mundos:

function handleFirstConnectivityChange(isConnected) {
  console.log('Then, is ' + (isConnected ? 'online' : 'offline'))
  NetInfo.isConnected.removeEventListener(
    'connectionChange',
    handleFirstConnectivityChange,
  )
}

if (Platform.OS === 'android') {
    NetInfo.isConnected.fetch().then(isConnected => {
      console.log('First, is ' + (isConnected ? 'online' : 'offline'))
    })
  } else {
    NetInfo.isConnected.addEventListener(
      'connectionChange',
      handleFirstConnectivityChange,
    )
  }

Está sendo exibido offline no IOS, embora esteja conectado
RN - 0,50

NetInfo.isConnected.fetch().then(isConnected => { console.log('First, is ' + (isConnected ? 'online' : 'offline')); });

@kddc obrigado pela solução alternativa.
Estou encontrando um problema com ele em meu dispositivo iOS e o cenário é o seguinte:

1. ios -> modo avião está ativado
2. realizar busca -> obtendo 'erro de rede', isConnected é falso e reachability.type é nenhum
3. ios -> modo avião está desligado
4. realizar busca -> obtendo 'erro de rede', isConnected é falso e reachability.type é nenhum

O tempo todo o aplicativo está em execução, em segundo plano ao alterar o modo avião.
Apenas reiniciar o aplicativo "captura" a nova conexão de rede.

+1

+1

Obrigado pela correção @ alburdette619
Então, isso foi corrigido e estará disponível na versão 0.54?

@ assafb81 Não tenho certeza, aparentemente eles estão

Quando sua solicitação pull é mesclada, o Facebook primeiro a incorpora em seu repositório interno React Native e executa testes adicionais entre outras coisas. Quando isso é bem-sucedido, a mudança é exportada de volta para o repositório GitHub.

Olhando para a atividade de sua solicitação pull, você pode ver que seu commit agora está mesclado no GitHub . Olhando as informações do commit, você pode ver em quais branches ele está incluído. Atualmente, está apenas no branch "master":

Para comparação, se você olhar para um commit mais antigo, você pode ver que ele aparece em vários ramos:

No início de cada mês, um novo branch candidato a lançamento é criado com base no "master". Portanto, sua mudança provavelmente será no próximo release candidate no início de março. Você pode ler mais sobre a programação de lançamento do React Native nesta postagem do blog .

Adam Comella
Microsoft Corp.

Alguém verificou esse problema com o RN 54 mais recente? Para mim, está sempre voltando 'verdadeiro' agora no iOS e no Android funciona perfeitamente bem. Alguém mais está vendo esse problema?

0,53 sempre falso .. @deepaksasken .. parece que preciso desabilitar o código apenas para android .. Não posso usar 0,54 para muitos bugs.

@ alien3d Você quer dizer desabilitá-lo para iOS e mantê-lo apenas para Android? Funciona no Android?

@afilp eu apenas sigo o exemplo acima para ios

    if (Platform.OS === "ios") {
            isConnected = await fetch("https://www.google.com");
            if (isConnected) { }
  } else { 
    NetInfo.isConnected.fetch().done(
                (isConnected) => {
                    if (isConnected) { }
} 

Ainda preciso de muitos testes antes de considerá-la estável. agora usando de volta 0,530

@ assafb81 Você encontrou uma solução para o problema com o modo avião? Estou usando sua solução em 0,53.

@aflip Quando os dados estão habilitados, mas ainda não há pacote, ele retorna isConnected true. Você já tentou resolver isso?

Por que existe um removeEventListener. O aplicativo não deveria estar ouvindo as mudanças na rede o tempo todo. Qualquer um?

Também tendo o mesmo problema dos usuários acima. Os ouvintes de eventos NetInfo parecem não ser confiáveis. Eu tentei muitas das soluções alternativas acima sem resultados estáveis. Por enquanto, irei buscar https://google.com ou um endpoint de integridade em meus próprios servidores para garantir que meus usuários tenham uma conexão com a Internet.

@MichaelPintos Funciona para mim, obrigado.

RN 0.54.2
SO: iOS
mesmo problema, sempre desconhecido

Quando eu atualizo RN para 0.55.3

Estou usando este código, primeiro retorna desconhecido, e então funciona

    NetInfo.getConnectionInfo()
        .then()
        .done(() => {
                switch (connectionInfo.type) {
                    case 'none':
                        Alert.alert('aa', 'none');
                        break;
                    case 'wifi':
                        Alert.alert('aa', 'wifi');
                        break;
                    case 'cellular':
                        if (connectionInfo.effectiveType !== 'unknown') {
                            Alert.alert('aa', `cellular ${connectionInfo.effectiveType}`);
                        } else {
                            Alert.alert('aa', 'cellular unknown');
                        }
                        break;
                    case 'unknown':
                        Alert.alert('aa', 'unknown');
                        break;
                    default:
                        Alert.alert('aa', 'default');
                        break;
                }
            });
        });

Ok, então vamos fazer um pequeno truque.

    NetInfo.getConnectionInfo()
        .then()
        .done(() => {
            NetInfo.getConnectionInfo().then(connectionInfo => {
                switch (connectionInfo.type) {
                    case 'none':
                        Alert.alert('aa', 'none');
                        break;
                    case 'wifi':
                        Alert.alert('aa', 'wifi');
                        break;
                    case 'cellular':
                        if (connectionInfo.effectiveType !== 'unknown') {
                            Alert.alert('aa', `cellular ${connectionInfo.effectiveType}`);
                        } else {
                            Alert.alert('aa', 'cellular unknown');
                        }
                        break;
                    case 'unknown':
                        Alert.alert('aa', 'unknown');
                        break;
                    default:
                        Alert.alert('aa', 'default');
                        break;
                }
            });
        });

Esta é a minha solução. Espere uma solução oficial.

Atualizado para 55 especificamente porque o changelog disse que deveria consertar isso - ainda está quebrado (0.55.3).

Consigo fazê-lo funcionar usando uma solução semelhante a @ yuyao110120 :

NetInfo.isConnected.fetch().then(() => {
  NetInfo.isConnected.fetch().then(isConnected =>
    // isConnected is now the correct value
  });
});

Eu não confio mais em NetInfo (react-native 0.53.3)
Isso é o que eu faço para garantir que haja internet:

async function handleConnectivityChange(status) {
  const { type } = status;
  let probablyHasInternet;
  try {
    const googleCall = await fetch(
        'https://google.com', {
        headers: {
          'Cache-Control': 'no-cache, no-store, must-revalidate',
          Pragma: 'no-cache',
          Expires: 0,
        },
      });
    probablyHasInternet = googleCall.status === 200;
  } catch (e) {
    probablyHasInternet = false;
  }

  console.log(`@@ isConnected: ${probablyHasInternet}`);

}

  NetInfo.getConnectionInfo().then(handleConnectivityChange);
  NetInfo.addEventListener('connectionChange', handleConnectivityChange);

@SudoPlz Eu praticamente fiz a mesma coisa em meus aplicativos, funciona muito bem. Mas a API NetInfo deve ser definitivamente corrigida haha!

@SudoPlz Percebi que fetch armazena em cache a solicitação no Android. Você teria que fornecer alguns cabeçalhos para evitar isso.

      const googleRequest = await fetch('https://www.google.com', {
        headers: {
          'Cache-Control': 'no-cache, no-store, must-revalidate',
          'Pragma': 'no-cache',
          'Expires': 0
        }
      });

Ok, obrigado por me informar @AbdallaMohamed. Eu atualizei o comentário.

o mesmo que @kylevdr , funcionou de forma confiável, mas adicionar um pequeno tempo limite antes da 2ª chamada parece ajudar com a oscilação, onde será desconectado por uma segunda divisão logo após desbloquear

Editar: fwiw funciona em 55.3, mas não em 55.4

Adicionar um ouvinte de evento de conexão inicial fará com que NetInfo.getConnectionInfo() e NetInfo.isConnected.fetch() funcionem corretamente na primeira chamada.

const onInitialNetConnection = isConnected => {
    console.log(`Is initially connected: ${isConnected}`);

    NetInfo.isConnected.removeEventListener(
        onInitialNetConnection
    );
};

NetInfo.isConnected.addEventListener(
    'connectionChange',
    onInitialNetConnection
);

// both now work on the first call.
await NetInfo.getConnectionInfo();
await NetInfo.isConnected.fetch();

Obrigado # 8469

Certifique-se de importar este arquivo ou ele não será executado.

PS Se você estiver usando fetch , use method: 'HEAD' para reduzir a quantidade de dados transmitidos.

Nenhuma das soluções acima funcionou ao executar o aplicativo no modo de depuração em um iPhone 8 (React Native 0.55.3, iOS 11.3.1) no seguinte cenário: Feche o aplicativo e inicie-o com dados móveis e wi-fi desligados.

Quaisquer eventos subsequentes são perdidos com todas as soluções mencionadas acima (exceto para a resposta de @SudoPlz ). Apenas executar o aplicativo no modo de liberação no dispositivo ou no modo de depuração em um simulador acionou quaisquer eventos NetInfo .

@nlindroos então você realmente confirma que NetInfo funciona bem em dispositivos que executam a versão de lançamento?

No caso específico de _iniciar_ o aplicativo no modo offline em um dispositivo iOS físico, a execução no modo de lançamento foi a única solução de trabalho para fazer com que quaisquer eventos NetInfo fossem acionados. Não testei todos os cenários relacionados o suficiente para garantir isso como uma solução genérica para todos os NetInfo problemas.

Posso dizer que a combinação das soluções que @woodpav e @AbdallaMohamed funcionaram para mim
Estou usando RN versão 0.55.4

Devo fazer ping no servidor do Google com frequência para verificar a conexão com a Internet 😕

Estou usando o simulador iPhone 8-11.3 e no RN versão 0.55.4 NetInfo.isConnected.fetch (). Then (isConnected => console.log ('isConnected', isConnected))
Sempre retorna falso. Este é um problema de produção no telefone também. Tentei variações de dados móveis e wi-fi.

Ao voltar para a versão RN 0.55.3, parece estar funcionando novamente.

@octopitus , @martinentelect
este é o meu código, estou usando o react versão nativa 0.55.4, e é uma solução sensata e funcional até que NetInfo seja corrigido.
No meu arquivo api.js, tenho este código

import { NetInfo } from 'react-native';
import { url } from '[AppName]/src/config';

export const onInitialNetConnection = () => {
    NetInfo.isConnected.removeEventListener(onInitialNetConnection);
};

const getDataById = async (dataId) => {
    // both now work on the first call.
    await NetInfo.getConnectionInfo();
    const isConnected = await NetInfo.isConnected.fetch();
    if (!isConnected) {
        throw new Error('networkError');
    }
    const response = await fetch(`${url}${dataId}`, {
        headers: {
            'Cache-Control': 'no-cache, no-store, must-revalidate',
            Pragma: 'no-cache',
            Expires: 0,
        },
    });
    if (response.ok) {
        return response.json();
    }
    throw new Error('invalidCode');
};

export default getDataById;

Em meu arquivo App.js (meu ponto de entrada para o aplicativo), adiciono o ouvinte de evento:

NetInfo.isConnected.addEventListener(
            'connectionChange',
            onInitialNetConnection,
        );

@ assafb81 Obrigado! Isso ajudou meu caso de uso.

No meu caso, o listener de eventos funciona perfeitamente no iOS, mas não funciona de forma alguma no Android (pelo menos no emulador).
Há alguma solução alternativa para ouvintes no Android enquanto ainda usam o NetInfo?

    NetInfo.isConnected.addEventListener(
      "connectionChange",
      this.handleConnectionChange
    ); 

Usar

this.count = 0
handleConnectivityChange(isConnected) {
   //for iOS
    this.count++
  console.log(isConnected + "isConnected")
  if(this.count > 1){
    console.log(isConnected + "this is the right value")
  }

@tannera ,
verifique no dispositivo Android real e não no emulador

Em 0.55.4 isso ainda é um bug e acabei de entrar em produção 😢

Ainda não está fixado em 0,56

@SudoPlz Eu escondi seu comentário no tópico de discussão 0.57 como fora do tópico. Como você sabe, há centenas de questões abertas no repo, mas esse tópico se concentra em lançar uma versão 0,57.

Este tópico em um fechado é praticamente invisível para os mantenedores, e estou surpreso que seis meses após uma possível correção ser realizada, ninguém abriu um novo problema. Se isso é algo que você gostaria de ver corrigido no master, abra uma nova edição com detalhes e, de preferência, envie um PR.

Aqui está um exemplo reproduzível mínimo (testado no dispositivo iOS), com algum código de @woodpav compartilhado acima para contornar o problema comentado no topo: https://snack.expo.io/@notbrent/netinfo -repro.