基于最近考虑着手iOS 安卓 双平台的开发，整理了一下现存的一些跨平台开发思路。

为了让自己更直观的感受不同跨平台思路的差异，我简单的做了几个图示。

套壳模式

微信公众号H5(相当于) , jQuery Mobile ?

套壳模式是开发APP可以说是最简单快捷的（对于web开发者来说），基本上只要有一个正常能用的手机端可以UI适应的web就可以通过套一个壳完成APP开发。 套壳的问题主要有2个

1. 体验不好，完全通过套壳的webapp 从性能以及UI交互上来说都会比原生app差，通过对js、css的优化，可以解决一部分，比如说click事件在手机端应当用tap事件(封装tap事件)，另一部分解决不了，比如说iOS端的侧滑返回或侧滑删除功能，这个体验如果要靠js来实现，效果当然是可以写出来的，但是流畅度、细节表现大大不如原生，而且会花费比较多的时间，而且没有什么这一块比较好的库可以用。
2. 没有原生功能支持,在微信公众号h5中，还可以通过微信的JSAPI调用部分微信提供的功能，譬如说存储图片。但是套壳在app里的时候，就完全没有办法支持了。

Web 框架模式

Dcloud H5 plus (SDK)

除了Dcloud h5 目前没有发现明确的web框架模式，这里的web框架模式主要是指以web形式开发，通过特定的SDK或者插件api访问app原生功能，不需要使用该框架特定的打包流程，支持以sdk嵌入等方式构建app的。

Web框架模式相对来说简单，快速。不用深入学习原生的内容即可快速使用原生平台的能力，通过插件的扩展也能提高一定程度上的体验效果。

- 阅读剩余部分 -

Android WebView不能加载ajax?加载ajax无效？

!苹果或高版本的安卓webview可能会有跨域被拦截的问题，需要在服务端允许跨域。 另外高版本的webview注意使用HTTPS协议的请求,普通http将会被拦截 php示例代码:

header('content-type:application:json;charset=utf8');
header('Access-Control-Allow-Origin:*'); // 被允许的访问来源
header('Access-Control-Allow-Methods:POST');
header('Access-Control-Allow-Headers:x-requested-with,content-type');

1、WebView的支持js是否打开； webSettings.setJavaScriptEnabled(true);

2、webView拓展的api是否打开： webSettings.setDomStorageEnabled(true);

- 阅读剩余部分 -

安卓webview在某些版本使用location.href时会闪退。 主要问题是

通过window.location.href来重定向的，安卓不会正确触发shouldOverrideUrlLoading。

这个时候需要重写shouldOverrideUrlLoading

webView.setWebViewClient( new WebViewClient(){
 @Override
  public boolean shouldOverrideUrlLoading( WebView view, String url ){
   if(url!=""){
    view.loadUrl(url);
   }
   return true;
  }
});

最近在调试一个通过webview打开本地html的页面。 出现了: 404 Not Found The resource could not be found

用到了chrome的inspect调试，虽然在chrome://inspect 中可以看到设备，但是点击inspect却始终显示的是空白或者404。 这个时候无论我是否开启VPN，或者在webview中写入各种设置均不起作用。 一度怀疑是手机的webview框架有问题，甚至想过替换webview的方案。 但是手机同时安装的chrome浏览器，qq浏览器都可以正常调试，这是我对比了一下chrome浏览器和webview的核心版本 其中 chrome : 71.0 WebView: 51.0

在开启vpn后chrome浏览器的页面已经可以正常调试了，但是回到webview调试依然白屏。 这时我推测是两个浏览器内核之间已经不能进行有效的对接、或者谷歌服务器中没有对应的版本文件来下载，导致调试器界面无法显示。 随后我大胆的在网上下载 chrome 51.0版本，卸载了本机76.0版本进行安装。

使用51.0版本的chrome进行webview调试，成功！

- 阅读剩余部分 -