分类 安卓 下的文章

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

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

跨平台开发图示1

跨平台开发图示2

套壳模式

微信公众号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调试,成功!

- 阅读剩余部分 -