React-native: iOS：NetInfo.isConnected始终返回false

我也可以使用RN 0.29.0复制它。 我之前在0.26.2上运行，并且运行良好。 尝试从源代码构建和调试。

+1

我之前曾报告过相同的问题： https :

快速的解决方法是添加事件处理程序NetInfo.isConnected.addEventListener('change', Function.prototype)

+1以及NetInfo.fetch（）。done（）的相同问题-始终返回unknown

我这样解决了：

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

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

+1

我们在0.29.2中发现了这个错误。

我们在0.28中发现了这个错误

0.30.0仍然无法正常工作

相关代码未更改，因此仍然无法正常工作是有道理的。

请注意，我之前在这里报告了该错误： https :

RN的未解决问题每天都在增加，因此尽我们所能并在可能的情况下进行整合非常重要。

我今天注意到了同样的问题

我正在使用0.30.0版本，并且我也发现了此错误。

对我来说，同样的问题，我使用的是[email protected] ，提取始终返回未知。

但是我们可以改用addEventListener。

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

代替：

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

@ facebook-github-bot错误

我在0.31上遇到此问题，这个问题可以解决吗？

等于0.32

@knowbody您的代码段如何工作？ 我需要在类中定义setIsConnected方法，还是将其定义为全局函数或其他？ 因为，实际上我有一个错误，谁说Can't find variable: setIsConnected

@florentsorel，因此在我的项目中，我使用redux进行状态管理，而setIsConnected是我的动作创建者，看起来像：

actions/network.js

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

然后我有一个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

我在v0.34.1上遇到此问题

编辑：更新到v0.35.0和相同的问题。

在v0.35.0上相同

我在v0.36.0上遇到了同样的问题

@knowbody代码段在0.36中为我工作

@Dnld ： @Ehesp说它可以在v.036上运行，您和其他5个不是吗？ 最终不解决吗？ 我曾经也遇到过0.33的问题，我想升级。 谢谢。

底层代码并没有真正改变，因此如果“修复”，我会感到惊讶。

我在引号中加上了修正，因为看来此更改的动机是仅在应用程序代码感兴趣的情况下，设置监视网络状态的本机。

应用程序通过添加事件侦听器来注册兴趣，然后开始检查可达性。

此时，这似乎是所需的行为，因此可能需要更改文档。 NetInfo.isConnected返回一个布尔值，因此它不表示状态是未知的，并且在添加事件侦听器之前不会改变。 或者，可以将函数更改为返回null或布尔值。

我的应用程序具有与@knowbody发布的代码非常相似的代码。 但是我根本不叫NetInfo.isConnected.fetch() ，因为它在启动时没有用。

我假设存在连接，添加侦听器，然后当连接状态不再未知时，将更新状态。

0.34.1仍然无法正常工作

RN 0.37.0同样的问题

由于某种原因@ xing-zheng，即使我关闭了计算机上的wifi，您的解决方案也只会返回“ MOBILE”，这应该反映在模拟器中。 知道为什么吗？

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

RN 0.38.0同样的问题

在0.39中也一样

当我尝试addEventListener解决方案时，NetInfo仅检测到一两个连接更改。 例如，如果我从连接开始，然后将其断开，Netinfo将检测到该连接，但是如果我重新连接，它将无法检测到我现在已连接。 NetInfo在我的应用程序中产生了很多误报，即使有解决方法。 还有其他人也遇到同样的情况吗？

为了解决这个问题，我不得不建立一个怪异的解决方法。 由于某种原因，一种方法适用于android，另一种方法适用于iOS。 解决该问题的方法将非常有用。

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它不起作用。

RN- 0.39+

函数handleFirstConnectivityChange（isConnected）{
如果（！sConnected）{
//做动作
}
NetInfo.isConnected.removeEventListener（'change'，handleFirstConnectivityChange）;
}

如果（Platform.OS ==='ios'）{
NetInfo.isConnected.addEventListener（'change'，handleFirstConnectivityChange）;
}其他{
NetInfo.isConnected.fetch（）。then（isConnected => {
如果（！sConnected）{
//做动作
}
}

你能帮我吗？

@imbudhiraja在任何平台上都可以使用吗？

不，它不适用于任何平台

谢谢
曼尼斯（Manish Budhiraja）

在2017年1月3日晚上8:12，“ Roberto Dias” [email protected]写道：

@imbudhiraja https://github.com/imbudhiraja可以在任何
平台？

-
您收到此邮件是因为有人提到您。
直接回复此电子邮件，在GitHub上查看
https://github.com/facebook/react-native/issues/8615#issuecomment-270128504 ，
或使线程静音
https://github.com/notifications/unsubscribe-auth/AVTjXHSe8OcVq8fQ5XVk8hh9XXHfHFVZks5rOl5ggaJpZM4JGaBc
。

看起来这可能是两个问题：

1. isConnected.fetch在iOS上似乎已损坏-修复应该很简单。 @ robertodias180发布的解决方法很有意义，因为它使用另一种方法查询了本机代码。
2. @Aristekrat描述的NetInfo异常。 这更令人担忧-有人可以提供详细的方法来重现此问题吗？ 然后，我应该能够帮助修复它。

RN 0.38.1及更低版本，iOS Simulator。

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);

};

初始NetInfo.isConnected.fetch().then(this._handleConnectionInfoChange);正确检索当前的连接状态。 但是，eventListener不会捕获对连接状态的后续更改。

我现在在许多RN版本中都遇到了这个问题。

@imbudhiraja我最终将代码更改为“ cleaner”。 我有一个具有网络连接当前状态的工具。 这在两个平台上均有效。 当应用程序打开时，我initializeConnection ，然后在我需要时isConnected 。 请不要在应用程序打开时（尤其是在android上），直到NetInfo获得连接状态为止可能要花一些时间。 我只是延迟了一下，直到hasConnection !== null 。 希望能帮助到你

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;
}

尝试过类似的操作，我一直遇到这样的情况，即在连接返回时（在模拟器上）eventListener无法检测到它。

在没有互联网连接的情况下重新加载应用=>检测到
重新打开互联网=>未检测到

通过互联网连接重新加载应用=>检测到
关闭互联网=>检测到
重新打开互联网=>未检测到

<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();

    }

[...]

尝试每次更改都删除并重新添加侦听器，但没有任何乐趣。

@mschipperheyn我使用@knowbody先前发布的方法遇到了完全相同的问题。

该文档还暗示它将仅通过handleFirstConnectivityChange处理第一次更改。 这是正确的，还是应该检测所有后续更改？

确保你有

在您的android清单文件中设置。 这使我绊倒了。

RN 0.41.0同样的问题

在iOS中，不要添加侦听器，也不要注册SCNetworkReachabilitySetCallback。 肯定不能正常工作。 设计目的是什么？

与0.41.2相同

@djohnkirby您的评论缺少我想发布的XML-您可以编辑吗？

向您添加AndroidManifest.xml的行是：

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

0.39.2：相同的问题。 NetInfo fetch结果不仅总是false ，而且在应用启动后还可以快速检测到连接状态变化

0.42.0：相同的问题。 我还在这里描述了我的问题： https :
我正在iOS和macOS Sierra上进行测试。

更新：我的问题是由于在模拟器上进行测试，在真实设备上一切正常。 在以上链接中回答。

我有同样的问题 ：（

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

如果有人想知道应用程序是否在模拟器上运行，请访问： http :

这不是错误。 本地模块RCTNetInfo是RCTEventEmitter的子类，因此我们必须添加观察者以触发startObserving方法。
在应用启动过程中，向NetInfo添加任意观察者，然后可以调用fetch函数。（NetInfo.isConnected确实调用了fetch函数）

根据@ robertodias180的建议，我来到isConnected的包装器，
它似乎可行，但我想知道它是否在所有情况下都可行

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();
}

同样的问题。 0.40

我遇到同样的问题

0.42.3-我在模拟器和实际设备上运行iOS时遇到了相同的问题。 使用@ Knight704提供的解决方案可以缓解此问题。

相同于0.42.3

相同于0.43.1

在0.40上看到此

也有这个问题。 能够使其随机工作，然后停止工作。

@ Knight704的解决方案最初对我有效，但是由于某种原因，一旦我从模态的导航器第二层内部调用一次，该函数将停止工作（从不调用handleFirstConnectivityChangeIOS），即使我关闭模态也是如此。 行为很奇怪，不知道为什么它不起作用，或者是我的代码库中的其他东西与NetInfo不能很好地配合。

我想念什么？

    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 ()
}

因此，当我运行它时，有时会（有时不总是）使我警惕。

这些是控制台日志返回的信息，即使有连接，它也会给我警报：

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

当我在https://github.com/facebook/react-native/issues/8615#issuecomment -287977178使用@ Knight704中的@SteffeyDev相同的问题推送或弹出模式，相同的代码将永远无法解析，因为我假设已经发出了change事件。

我注意到在这种情况下， NetInfo.fetch()将返回unknown状态（这将在false下触发NetInfo.isConnected.fetch() ，因此我能够解决该问题对原始解决方法进行了以下修改：

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');
  });
}

unknown条件仅在iOS上触发，因为Android返回UNKNOWN 。 这也是在返回状态之前改小写的原因，因为这应该或多或少保留NetInfo.isConnected.fetch的现有行为。

同样在0.44

最初，我观察到NetInfo只希望在一个周期（打开->关闭）后返回网络状态更改。 事实证明，它仅在模拟器中存在该问题。 在真实设备上，即使在多个连接/断开循环中，它也会正确触发回调。

样例代码

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

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

这个问题困扰了我一段时间，最终我间接创建了一个小型实用程序库，专注于RN离线/在线检测，其中包含典型的React模式以及与Redux的良好集成。

它可以在Android和iOS的真实设备上正常运行。 但是，我也可以证实有时iOS模拟器中未触发侦听器，并且连接状态不一致。 我还没有尝试过@ knight704和@Ignigena （分别在这里和这里）提出的解决方案，但是可能会在有空的时候很快对其进行测试。

如果有更多的人确认这些解决方案像魅力一样，也非常欢迎PR！

请解决。

如果这不太可能很快得到解决，我们是否至少可以更新文档以表明这在iOS中不起作用？

@ jpb12也许值得进行公关并查看他们是否将其合并。 可能实际上使它变得更明显，因为它似乎被遗忘了。

我在Android版本中遇到此问题。 这似乎与转到后台并返回到前台有关。 不幸的是，我无法可靠地重现此问题，但肯定会在几次背景/前景转换之后发生。 尤其是那段时间如果连接状态已更改

何时发生
NetInfo.isConnected.fetch().then(isConnected => {...})始终返回false
NetInfo.fetch().then((reach) => {...})始终返回NONE
添加/删除侦听器无济于事

我非常感谢任何可靠的方法来检测实际的连接状态

我面临一个奇怪的问题，因为当连接到wifi时isConnected返回true（到目前为止还可以），但是如果调制解调器无法连接到Internet，则isConnected仍然为true。 我不太确定如何有效检查互联网连接，而不仅仅是网络连接。 有任何想法吗？ 谢谢

@kodatech此模块应帮助您解决该问题。 我最近在一个项目上使用了它，并强烈推荐它https://github.com/rauliyohmc/react-native-offline

非常感谢@craigcoles

@ Knight704谢谢兄弟

@craigcoles您有我可以遵循的任何有效代码吗？

@nmfzone我没有什么可以告诉您的，但是自述文件中有很多代码示例

我正在按以下方式使用Netinfo侦听器事件，它在两个平台上均能很好地工作。
“ react-native”：“ 0.43.4”，

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

    }

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

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

@ sumesh1993根据我的经验，如果最小化了Android应用程序（在后台），则它不会对'change'事件做出反应。 在我的Galaxy Note 5和Android 7.0上进行了测试

在上面推荐的模块https://github.com/rauliyohmc/react-native-offline只是连续ping https://google.com 。 它可以工作，但我更希望修复此错误

这是有道理的，因为Android应用程序在后台挂起。 要接收事件，您需要创建一个服务，即使该应用已暂停，该服务也将继续运行。

或者，您可以向应用程序添加

@ alsh76对我来说，当应用程序在后台运行时，它可以正常工作；当从多任务菜单中杀死该应用程序时，它不起作用。
我通过在启动主屏幕时调用以下函数来解决此问题。
if(Platform.OS === 'android'){ NetInfo.isConnected.fetch().then(isConnected => { if(!isConnected) return; //Do something }); }

遇到了与Android虚拟设备相同的问题。 但问题是几天前还可以，但仍在iOS设备和模拟器上进行。 是否有人找到稳定且正确的方法来获取网络连接状态？

感谢@ sumesh1993 ，它为我在iOS中
@igorarkhipenko您尝试了他的建议吗？

嗨，您是否添加了权限，例如android需要添加
AndroidManifest.xml
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

由于不推荐使用NetInfo.fetch ，因此@ Knight704和@Ignigena的解决方案仅作了小幅更新。 这帮了我大忙：
```
const isNetworkConnected =（）=> {
返回NetInfo.getConnectionInfo（）。then（可达性=> {
如果（reachability.type ==='未知'）{
返回新的Promise（resolve => {
const handleFirstConnectivityChangeIOS = isConnected => {
NetInfo.isConnected.removeEventListener（'connectionChange'，handleFirstConnectivityChangeIOS）;
resolve（isConnected）;
};
NetInfo.isConnected.addEventListener（'connectionChange'，handleFirstConnectivityChangeIOS）;
}）;
}
返回（reachability.type！=='none'&& reachability.type！=='未知'）
}）;
}

Imho NetInfo.isConnected.fetch()是一项重要功能，应尽快修复！

@javache @sahrens @davidaurelio @janicduplessis @hramos @shergin @rigdern是否有此时间表？

谢谢！

@pensierinmusica这是社区推动的项目，所以我很想获得良好的PR。

@shergin我以为React Native是由Facebook内部创建，维护和使用的，并出于BSD 3条款许可而发布。 因此，我认为Facebook员工会修复错误，尤其是重要的错误。 无论如何，很高兴知道我们欢迎PR！

抄送@rigdern

RN核心代码很多由社区编写和维护。

而且，Facebook还没有使用许多特性，因此我们很难确定它们的优先级，而倾向于社区PR，作者可以在其中验证其错误/用例的修复程序。

我在与iOS反应0.47.0中也遇到问题。

@pensierinmusica这个问题绝对应该被优先考虑。 从.isConnected（）返回布尔值有多困难？

好了，这是一个即用的解决方法，应该可以解决问题（对我来说很好）。 我向一个我知道将处于活动状态的站点发送了一个http请求，并评估了响应。

我已经初始化了一个可以直接使用的仓库。 https://github.com/JamesDorrian/NetInfoCheckConnection/tree/master

注意：请确保将httpAddress变量从https://www.galwaydaily.com更改为其他名称（可能是google.com），因为我不能保证它会一直存在。 我希望这可以帮助任何对NetInfo感到沮丧的人！

@pensierinmusica @anujsinghwd

@JamesDorrian谢谢，我最终做了类似的事情，对“ google.com”进行了ping操作。

这是代码段：

// /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;
};

不过，这只是暂时的解决方法，我认为NetInfo.isConnected应该尽快修复！

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

我们可以在这个问题上用+1评论停止吗，这就是反应的目的。

ios：
第一个请求。 如果服务器崩溃，则电话具有wifi。
NetInfo.isConnected.fetch（）。then（（isConnected）=> {总是false}
0.49.3。

@kddc您的解决方案似乎在开发中可以正常使用👍

只需添加可达图书馆到从苹果公司的XCode项目其中担任这里，它的解决方案。

@fuatsengul我已在我的Xcode项目

该问题似乎仅与fetch api有关。.但是，添加事件侦听器在iOS 。.但是，addEventListener在android上不起作用，因此您需要使用fetch api :)

这是我的代码片段，使其在两种环境下均可使用：

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,
    )
  }

即使已连接，它仍在IOS中离线显示
RN-0.50

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

@kddc感谢您的解决方法。
我在iOS设备中遇到问题，情况如下：

1. iOS->飞行模式开启
2. 执行获取->获取“网络错误”，isConnected为false ，reachability.type为none
3. iOS->飞行模式关闭
4. 执行获取->获取“网络错误”，isConnected为false ，reachability.type为none

更改飞行器模式时，应用程序始终在后台运行。
仅重新启动应用程序才能“捕获”新的网络连接。

+1

+1

感谢您的修复@ alburdette619
因此，此问题已修复，将在0.54版中提供？

@ assafb81我不确定，显然他们正在内部着陆，我不确定这样做的过程是吗？

当您的拉取请求被合并时，Facebook首先将其合并到其内部React Native存储库中，并对它进行其他测试。 成功后，更改将导出回GitHub存储库。

通过查看拉取请求的活动，您可以看到您的提交现在已在GitHub上合并。 通过查看提交信息，您可以看到其包含在哪些分支中。当前，它仅在“ master”分支中：

为了进行比较，如果查看较旧的提交，则可以看到它出现在许多分支中：

每个月初，都会基于“ master”创建一个新的发行候选分支。 因此，您的更改很可能会在3月初的下一个候选版本中进行。 您可以在此博客文章中了解有关React Native的发布时间表的更多

亚当·科梅拉（Adam Comella）
微软公司

有人使用最新的RN 54验证了此问题吗？ 对我来说，它现在在iOS和Android上始终返回“ true”，效果很好。 还有其他人看到此问题吗？

0.53始终为false .. @deepaksasken ..似乎我只需要为android禁用代码。不能对许多错误使用0.54。

@ alien3d您的意思是在iOS上禁用它，仅在Android上保留它？ 在Android中有效吗？

@ afilp我只是按照上面的示例为ios

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

在考虑稳定之前，我仍然需要进行大量测试。 现在回用0.530

@ assafb81您是否找到飞机模式问题的解决方案？ 我在0.53中使用您的解决方案。

@aflip启用数据但没有包时，它返回isConnected true。 你有尝试解决吗？

为什么会有removeEventListener。 该应用程序不应该一直在监听网络变化。 任何人？

也有与上述用户相同的问题。 NetInfo事​​件侦听器似乎非常不可靠。 我尝试了许多上述解决方法，但结果没有稳定。 现在，我将依靠在自己的服务器上获取https://google.com或运行状况端点来确保我的用户可以连接互联网。

@MichaelPintos对我

RN 0.54.2
操作系统：iOS
同一问题，始终未知

当我将RN升级到0.55.3时

我正在使用此代码，首先返回未知，然后工作

    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;
                }
            });
        });

好的，让我们做一些技巧。

    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;
                }
            });
        });

这是我的解决方案。 期待正式的解决方案。

升级到55的原因特别是因为变更日志说它应该解决此问题-仍然损坏（0.55.3）。

我可以使用与@ yuyao110120类似的解决方案来

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

我不再信任NetInfo （本机0.53.3）
我这样做是为了确保有互联网：

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我在我的应用程序上做了同样的事情，效果很好。 但是NetInfo API应该是固定的哈哈！

@SudoPlz我注意到fetch在Android上缓存了请求。 您必须给它一些标头以防止这种情况。

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

好的，谢谢你让我知道@AbdallaMohamed，我更新了评论。

与@kylevdr一样，工作可靠，但是在第二次调用之前添加一个小的超时似乎有助于闪烁，在解锁后它将立即断开以进行第二次拆分

编辑：一此在55.3，但不是55.4中工作

添加初始连接事件侦听器将导致NetInfo.getConnectionInfo()和NetInfo.isConnected.fetch()在第一次调用时正常工作。

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();

谢谢＃8469

确保导入该文件，否则将无法执行。

PS：如果您使用的是fetch ，请使用method: 'HEAD'减少传输的数据量。

在以下情况下，在iPhone 8（React Native 0.55.3，iOS 11.3.1）上以调试模式运行该应用程序时，以上解决方案均无效：关闭该应用程序，并关闭移动数据和wifi启动。

上述所有解决方案都将丢失所有后续事件（ @SudoPlz的答案除外）。 仅在设备上的发布模式下或在模拟器上的调试模式下运行该应用程序会触发任何NetInfo事件。

@nlindroos，所以您实际上确认NetInfo在运行发行版的设备上可以正常工作吗？

在特定的情况下，在物理iOS设备上以离线模式启动应用程序时，以发布模式运行是触发任何NetInfo事件触发的唯一可行解决方案。 我尚未对所有相关场景进行充分的测试，以证明它是所有NetInfo问题的通用解决方案。

我可以说@woodpav和@AbdallaMohamed为我工作的解决方案的组合
我正在使用RN版本0.55.4

我必须经常ping Google服务器以检查互联网连接😕

我正在使用iPhone 8-11.3模拟器以及RN版本0.55.4 NetInfo.isConnected.fetch（）。then（isConnected => console.log（'isConnected'，isConnected））
始终返回false。 这也是电话生产中的问题。 我尝试了移动数据和wifi的变体。

切换回RN 0.55.3版时，它似乎又能正常工作了。

@octopitus ，@martinentelect
这是我的代码，我使用的是React Native版本0.55.4，这是一个明智而可行的解决方法，直到NetInfo被修复。
在我的api.js文件中，我有以下代码

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;

在我的App.js文件（应用程序的入口）中，添加事件侦听器：

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

@ assafb81谢谢！ 这帮助了我的用例。

就我而言，事件侦听器在iOS上可以完美运行，但在Android上（至少在仿真器上）根本无法运行。
在仍然使用NetInfo的同时，Android上的侦听器是否有任何变通办法？

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

采用

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 ，
检查真实的android设备而不是模拟器

在0.55.4这仍然是一个错误，而我刚在生产中受到了hit

仍未固定在0.56

@SudoPlz我已将您对0.57讨论主题的评论隐藏为话题。 如您所知，回购中有数百个未解决的问题，但是该线程着重于发布0.57版本。

维护者几乎看不见该线程，而令我惊讶的是，潜在修复程序登陆六个月后，没有人提出新的问题。 如果您希望在母版中解决此问题，请打开一本详细说明的新书，最好发送PR。

这是一个最小的可重现示例（在iOS设备上测试），上面共享了@woodpav的一些代码来解决在顶部注释的问题： https: //snack.expo.io/@notbrent/netinfo -repro。