Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error loading page Domain: WebKitErrorDomain Error Code: 101 The URL can't be shown #48

Open
wuyunqiang opened this issue Mar 26, 2018 · 0 comments

Comments

@wuyunqiang
Copy link
Owner

wuyunqiang commented Mar 26, 2018

webviewerror.png

fix:

<WebView
              style={{backgroundColor:'blue',flex:1}}
              nativeConfig={//关键部分:这个修改错误
                  {
                      props: {
                          backgroundColor: '#ffffff',
                          flex: 1,
                      }
                  }
              }
              ref = {(webview)=>{this.web = webview}}
              style={{width:'100%',height:'100%',marginTop:this.isIphoneX()?40:Platform.OS==='ios'?20:0}}
              source={{uri: this.state.url}}
              domStorageEnabled={true}
              mixedContentMode={'always'}//指定混合内容模式。即WebView是否应该允许安全链接(https)页面中加载非安全链接(http)的内容,never,always,compatibility
              onLoadEnd = {this.LoadEnd}//加载成功或者失败都会回调
              onError = {this.isConnNet}
              javaScriptEnabled = {true}//指定WebView中是否启用JavaScript
              scalesPageToFit={true}
              onNavigationStateChange={(e) => {
                  console.log("onNavigationStateChange",e)
                  this.onNavigationStateChange(e)
              }}
              startInLoadingState={true} //强制WebView在第一次加载时先显示loading视图
              bounces={true}//指定滑动到边缘后是否有回弹效果。
              scrollEnabled={true}//是否启用滚动
              renderLoading={this.renderLoad}//返回一个加载指示器
              renderError={ (e) => {//关键部分:这个出错渲染页面
                  return null;
              }}
          />

原因分析:
https://www.jianshu.com/p/1e15a43d036f
如果webview的地址不可访问时,iOS会白屏而且双击还会缩小
如图:
iosweb.gif
fix:

     renderError={(e) => {//这里判断如果加载报错 返回一个视图
                  if(e=="NSURLErrorDomain"){
                      console.log("e NSURLErrorDomain",e);
                      return <View style={{width:"100%",height:"100%",justifyContent:'center',alignItems:"center"}}>
                          <TouchableOpacity activeOpacity={0.8} onPress={this.refresh}>
                          <Text style={{fontSize:16,color:"#333333",}}>无法连接</Text>
                          </TouchableOpacity>
                      </View>
                  }else if(e=="WebKitErrorDomain"){
                      console.log("e WebKitErrorDomain",e);
                      return null;
                  }
                  console.log("e",e);
                  return <View/>;
              }}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant