X5、WebViewJavascriptBridge、百度地图网页版 整合注意事项

简介: 一 什么是webViewjavascripBridge?           WebViewJavascriptBridge是移动UIView和Html交互通信的桥梁,用作者的话来说就是实现java(ios为oc)和js的互相调用的桥梁。



一 什么是webViewjavascripBridge?

          WebViewJavascriptBridge是移动UIView和Html交互通信的桥梁,用作者的话来说就是实现java(ios为oc)和js的互相调用的桥梁。替代了WebView的自带的JavascriptInterface的接口,使得我们的开发更加灵活和安全。


         WebViewJavascriptBridge for Android

         https://github.com/jesse01/WebViewJavascriptBridge


         WebViewJavascriptBridge for iOS/OSX

         https://github.com/marcuswestin/WebViewJavascriptBridge

             注意:使用4.1.5版才能跟安卓的保持一致:

         pod 'WebViewJavascriptBridge','4.1.5'



二 什么是X5

       

  •         TBS2.1基于Android 5.0 WebView Blink内核(M37版本)适配定制优化,适配Android全部主流平台,可以支持移动应用App在所有Android手机上使用Blink的技术能力。TBS2.1支持Service Worker,可以帮助Web应用后台运行,提供离线访问等原生App应用体验。此外,TBS2.1在H5/CSS3支持,安全,可靠,性能方面有进一步提升。TBS2.1已经发布,将逐步在各客户端中静默升级,用户终端无需更新微信、手机QQ、QQ空间即可使用最新的TBS2.1Blink内核。
           x5接入文档

三  接入注意事项

        1、X5与WebViewJavascriptBridge

      
    private class MyWebChromeClient extends WebChromeClient {
        @Override
        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
            return super.onJsAlert(view, url, message, result);
        }

        @Override
        public boolean onJsConfirm(WebView view, String url, String message, JsResult result) {
            return super.onJsConfirm(view, url, message, result);
        }

        @Override
        public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
            return super.onJsPrompt(view, url, message, defaultValue, result);
        }

        @Override
        public void onGeolocationPermissionsShowPrompt(String origin, GeolocationPermissions.Callback callback) {
            callback.invoke(origin, true, false);
            super.onGeolocationPermissionsShowPrompt(origin, callback);
        }

        public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType) {
            if (mUploadMessage != null) return;
            Log.e("openFileChooser", "openFileChooser");
            mUploadMessage = uploadMsg;
            selectImage();
//               Intent i = new Intent(Intent.ACTION_GET_CONTENT);
//               i.addCategory(Intent.CATEGORY_OPENABLE);
//               i.setType("*/*");
//                   startActivityForResult( Intent.createChooser( i, "File Chooser" ), FILECHOOSER_RESULTCODE );
        }

        // For Android < 3.0
        public void openFileChooser(ValueCallback<Uri> uploadMsg) {
            openFileChooser(uploadMsg, "");
        }

        // For Android  > 4.1.1
        public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) {
            openFileChooser(uploadMsg, acceptType);
        }

    }

GeolocationPermissions.Callback 替换为 GeolocationPermissionsCallback

     修改为:

            
    private class MyWebChromeClient extends WebChromeClient {
        @Override
        public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
            return super.onJsAlert(view, url, message, result);
        }

        @Override
        public boolean onJsConfirm(WebView view, String url, String message, JsResult result) {
            return super.onJsConfirm(view, url, message, result);
        }

        @Override
        public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result) {
            return super.onJsPrompt(view, url, message, defaultValue, result);
        }

        @Override
        public void onGeolocationPermissionsShowPrompt(String origin, GeolocationPermissionsCallback callback) {
            callback.invoke(origin, true, false);
            super.onGeolocationPermissionsShowPrompt(origin, callback);
        }

        public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType) {
            if (mUploadMessage != null) return;
            Log.e("openFileChooser", "openFileChooser");
            mUploadMessage = uploadMsg;
            selectImage();
//               Intent i = new Intent(Intent.ACTION_GET_CONTENT);
//               i.addCategory(Intent.CATEGORY_OPENABLE);
//               i.setType("*/*");
//                   startActivityForResult( Intent.createChooser( i, "File Chooser" ), FILECHOOSER_RESULTCODE );
        }

        // For Android < 3.0
        public void openFileChooser(ValueCallback<Uri> uploadMsg) {
            openFileChooser(uploadMsg, "");
        }

        // For Android  > 4.1.1
        public void openFileChooser(ValueCallback<Uri> uploadMsg, String acceptType, String capture) {
            openFileChooser(uploadMsg, acceptType);
        }

    }

         2,X5与百度地图网页版

            地图加载慢或者加载不出来的情况 ,发现是因为
            1、x5没能打开GPS定位权限,建议提示将GPS、WiFi、4G网络定位都打开。
            2、第一次加载百度地图去下载的网页元素太大











相关文章
|
JavaScript API 定位技术
【百度地图API】发布静态图API啦!只需一个网址,即可展示定制百度地图!
原文:【百度地图API】发布静态图API啦!只需一个网址,即可展示定制百度地图! 摘要: 百度地图静态图API!您无须执行任何“特殊”操作便可在网页上显示此图片。 不需要 JavaScript。我们只需创建一个网址,并将其放入 标记中。
2342 0
|
JSON JavaScript 定位技术
在网页中插入百度地图(实例)
步骤 1 2 3   如何在网页中插入百度地图呢? 2.切换城市,搜索需标注位置。(如下图 方法/步骤 1.进入:http://api.map.baidu.com/lbsapi/creatmap/(创建地图-百度地图API所见即所得工具,百度官方地址,大家放心使用) 切换城市,搜索需标注位置。
1305 0
|
索引
微信端网页中图片的展示方式
一、微信端网页中图片的展示方式   微信端网页中图片有两种展示方式:平铺与图集。平铺的时候文档内的所有图片全部展开,点击图片则放大。图集的时候只展示一张图片,点击图片的时候以翻页的方式展示一组图片。实现原理对于如下一个图片标签,data-gid用于存放组标识,同一组的data-gid相同。
855 0
|
API 定位技术
小程序中使用百度地图
介绍小程序中调用百度地图常用的三个方法。(使用前记得先要去百度官网注册需要使用的ak账号) 1.地址解析,方法分为两部,先通过微信获取到用户的坐标,再将坐标传入百度地图api中进行地址解析。
1922 0
|
小程序 开发者
微信小程序设置预览页面的三种方式
微信小程序设置预览页面的三种方式
微信小程序设置预览页面的三种方式
|
8月前
|
小程序 JavaScript
微信小程序:页面有内容却不显示原因
微信小程序:页面有内容却不显示原因
398 0
|
9月前
|
移动开发 JavaScript 前端开发
数据可视化大屏百度地图手机端标注开发实战案例解析(jsAPI接口、标注分类图片、文本标签、分类筛选、自适应高度信息弹窗、PHP后端API)
数据可视化大屏百度地图手机端标注开发实战案例解析(jsAPI接口、标注分类图片、文本标签、分类筛选、自适应高度信息弹窗、PHP后端API)
147 0
|
Web App开发 移动开发 API
关于 HTML5 调用用户的 照相机、相册 初步整理
一、UC 浏览器方案 我能找到的是 UC 插件平台(http://plus.uc.cn/document/plugin/doc1.html),当前只支持调用照相机,尚不支持调用相册。如文档截图(http://plus.uc.cn/document/plugin/doc11.html): 优点:UC浏览器比较流行缺点:局限性仍较大,仍然需要安装插件。
1230 0