我目前正在尝试在我的一个 native react 应用程序中实现网络服务调用并使用 react-native-web-service-handler调用 Get 和 Post Web API。

请看下面我的函数。

getRandomUserList() {    
  WebServiceHandler.get(APIConstants.baseURL, null, null)
      .then((val)=>{
          console.log('callapi: ' + JSON.stringify(val))
          this.setState({data:val})
      })
      .catch((error) => console.log('callapi:'+ JSON.stringify(error)));
}

APIConstants 如下所示，

const APIConstants = {
    baseURL:"https://randomuser.me/api/?results=50"
}

我是这样调用这个函数的，

componentDidMount() {
  this.getRandomUserList();
}

请找到WebServiceHandler.get函数如下，

static get(url: String, headerParam: Object, parameter: Object){
  console.log('WebServiceHandler:Initiating GET request');

  return new Promise(function(success, failed){
    NetInfo.isConnected.fetch().done((isConnected) => {
          console.log('WebServiceHandler: Network Connectivity status: ' + isConnected);
          if (!isConnected) {
            failed({name:'503',message:"No Internet connection"});
          }else {
            let URL = url + WebServiceHandler.parameter(parameter);
            console.log('URL:-' + URL);
            fetch(URL,{
              method: 'get',
              'headers': WebServiceHandler.header(headerParam)
            })
            .then(function(response) {
              console.log(response.status);
                if (!response.ok) {
                  throw {name:response.status,message:"http request failed", value:response.json()};
                }
                return response.json();

            })
            .then(function(jsonResponse) {
              console.log('************************ HTTP GET Succes ************************ ');
              success(jsonResponse);
            })
            .catch(function(err) {
                console.log('************************ HTTP GET Failed **************************');
                  failed(err)
            });
          }
        });
  });
}

它总是返回以下输出，

WebServiceHandler: Network Connectivity status: false
App.js:50 callapi:{"name":"503","message":"No Internet connection"}

我尝试了很多 Wi-Fi 和宽带连接，但都没有成功。

经过一番研究，我找到了this article on Github并实现了这个功能。

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

但它仍然给我同样的错误信息。能帮我解决这个问题吗？

仅供引用。你可以找到相同的 question在这里没有答案。

谢谢。

最佳答案

终于找到答案了，解决方法是这样的，

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

我们应该实现 getConnectionInfo()，因为 fetch() 是不推荐使用的方法。

或者

使用 NetInfo.getConnectionInfo() 更新 NetInfo.isConnected.fetch()。这也可以。

谢谢。

关于ios - React-Native NetInfo 始终返回无互联网连接，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49572815/