Android Native App与WebView交互技巧_html/css_WEB-ITnose
这次项目中有一个主页面完全是H5的页面,要求H5调用Native,js交互传值,看起来貌似很简单,网上教程一大堆,但是在实际开发过程中还是遇到很多问题,在这里记录一下。
- 首先,设置user agent,使前端可区分请求来自APP ,这里我设置的是"android_app/1.0.0",名称加版本号,具体设置什么大家可随意。
WebSettings settings = webView.getSettings();String ua = settings.getUserAgentString();settings.setUserAgentString(ua + "; android_app/1.0.0");
2.H5页面的登录,因为我们的应用不需要登录也能浏览,H5的页面有些也是不需要登陆的,所以点击H5页面需要登录的地方,要跳转到Native的页面登录,登录成功刷新H5页面,设置cookie,使WebView页面保持登录状态,具体代码如下:注:WebSettings的一些设置一定要放到设置cookie前面执行。设置cookie要注意作用域的问题,以及setCookie的时候最好分步设置,大家可以看下面的代码,我setCookie()了四次,不要把所有字符串拼接起来再一次setCookie,一次setCookie可能只会设置成功第一个分号前的cookie值。
public void synCookies(Context context, String host, String cookies) { try { CookieSyncManager.createInstance(context); CookieManager cookieManager = CookieManager.getInstance(); // 5.0以上版本的webview做了较大的改动,如:同步cookie的操作已经可以自动同步、但前提是我们必须开启第三方cookie的支持。 // cookieManager.setAcceptThirdPartyCookies(webView, true);//5.0以下的手机崩溃 cookieManager.setAcceptCookie(true); cookieManager.removeSessionCookie();//移除 cookieManager.removeAllCookie(); //base64加密// String base64Cookies = Base64Utils.encodeStr(getCookies()); //根据RFC822规定,BASE64Encoder编码每76个字符,还需要加上一个回车换行。 //使用 commons-codec-1.10.jar 不会换行而且效率更高 //这里我使用的是sun.misc.BASE64Decoder.jar,每76个字符会换行,所以下面去掉换行,为什么不用上面的呢,使用commons-codec-1.10.jar,Android Studio编译提示方法重复,没找到解决办法。// base64Cookies = base64Cookies.replace("\n", "");// Log.i("base64Cookies:", base64Cookies); Calendar calendar = Calendar.getInstance(); calendar.add(Calendar.DAY_OF_MONTH, 7); String expiresTime = calendar.getTime().toGMTString(); Log.i("expiresTime =", expiresTime); //分开设置,不然只会设置第一个分号之前的cookie// cookieManager.setCookie(host, "Token=" + base64Cookies); //不加密 cookieManager.setCookie(host, "Token=" + cookies); //注意host的值,类似于这个网址:http://www.jianshu.com/writer#/notebooks/2498434/notes/4304102/preview,host可以取:www.jianshu.com或者.jianshu.com,注意作用域,不要把整个url都放上了。 cookieManager.setCookie(host, "Domain=" + host); cookieManager.setCookie(host, "Path=/"); // Expires变量是一个只写变量,它确定了Cookie有效终止日期。该属性值DATE必须以特定的格式来书写: // 星期几,DD-MM-YY HH:MM:SS GMT,GMT表示这是格林尼治时间。反之,不以这样的格式来书写,系统将无法识别。 // 该变量可省,如果缺省时,则Cookie的属性值不会保存在用户的硬盘中,而仅仅保存在内存当中,Cookie文件将随着浏览器的关闭而自动消失。 cookieManager.setCookie(host, "Expires=" + expiresTime); CookieSyncManager.getInstance().sync(); String newCookie = cookieManager.getCookie(host); if (newCookie != null) { Log.i("getCookie:", newCookie); } } catch (Exception e) { Log.e("failedCookie=%s", e.toString()); } }
3.自定义scheme、js交互传值、调用js方法及document对象
例如:登录scheme为 goto://just/loginref=http://www.baidu.com&callback=loginWeb webView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { //1.登录scheme url = goto://just/login?callback=loginWeb if (url.startsWith("goto://just/login")) { //登录,跳转到native得LoginActivity //成功后在onActivityResult()方法中执行js的回调方法loginWeb传toekn值给H5 return true; //2.跳转新activity scheme url = goto://just/newweb?ref=http://www.baidu.com } else if (url.startsWith("goto://just/newweb")) { //页面加载不在本页webview加载,而是新打开此MainActivity(标准模式,为了循环复用) String ref = "http://www.baidu.com"; Intent intent = new Intent(MainActivity.this, MainActivity.class); intent.putExtra("webUrl", ref); startActivity(intent); return true; } return super.shouldOverrideUrlLoading(view, url); } @Override public void onReceivedError(WebView view, WebResourceRequest request, WebResourceError error) { super.onReceivedError(view, request, error); //页面错误 llError.setVisibility(View.VISIBLE); } public void onPageFinished(WebView view, String url) { Log.d("WebView", "onPageFinished "); //获取整个页面的Html view.loadUrl("javascript:window.weixinObj.getHtml('<head>'+" + "document.getElementsByTagName('html')[0].innerHTML+'</head>');"); //通过document.title 获取页面的title view.loadUrl("javascript:window.weixinObj.getTitle(document.title)"); //此方法也可以通过document.title 获取标题,但是需要Api19才能使用// view.evaluateJavascript("document.title", new ValueCallback<String>() {// @Override// public void onReceiveValue(String title) {//// }// }); super.onPageFinished(view, url); } }); @Override protected void onActivityResult(int requestCode, int resultCode, Intent data) { super.onActivityResult(requestCode, resultCode, data); //登录页返回后执行 String callback = "loginWeb"; synCookies(this, host, cookies); webView.loadUrl("javascript:" + callback + "('" + cookies + "')"); webView.reload(); } private class InterfaceObject { @JavascriptInterface public void getHtml(String html) { //获取html的内容 } @JavascriptInterface public void getTitle(String title) { //获取标题 } }
4.以上是我在项目中使用到的一些交互,经过测试是可用的,其实上面写的这些网上有很多,但是比较分散,我就自己总结了一下,例子无法运行的(没有调试,可能有些逻辑错误),因为没有网页测试,如果使用本地html的也不好模拟网络上环境,所以只写了一些逻辑,需要大家自行写h5测试。
资源:Example下载

Outils d'IA chauds

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool
Images de déshabillage gratuites

Clothoff.io
Dissolvant de vêtements AI

AI Hentai Generator
Générez AI Hentai gratuitement.

Article chaud

Outils chauds

Bloc-notes++7.3.1
Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

L'article traite du HTML & lt; Progress & GT; élément, son but, son style et ses différences par rapport au & lt; mètre & gt; élément. L'objectif principal est de l'utiliser & lt; Progress & gt; pour l'achèvement des tâches et & lt; mètre & gt; pour stati

L'article traite du HTML & lt; Datalist & GT; élément, qui améliore les formulaires en fournissant des suggestions de saisie semi-automatique, en améliorant l'expérience utilisateur et en réduisant les erreurs. COMMANDE COMPRES: 159

L'article examine les meilleures pratiques pour assurer la compatibilité des navigateurs de HTML5, en se concentrant sur la détection des fonctionnalités, l'amélioration progressive et les méthodes de test.

L'article traite du HTML & lt; mètre & gt; élément, utilisé pour afficher des valeurs scalaires ou fractionnaires dans une plage, et ses applications courantes dans le développement Web. Il différencie & lt; mètre & gt; De & lt; Progress & gt; et ex

Cet article explique le html5 & lt; time & gt; élément de représentation sémantique de date / heure. Il souligne l'importance de l'attribut DateTime pour la lisibilité à la machine (format ISO 8601) à côté du texte lisible par l'homme, stimulant AccessIbilit

L'article discute de l'utilisation des attributs de validation de formulaire HTML5 comme les limites requises, motifs, min, max et longueurs pour valider la saisie de l'utilisateur directement dans le navigateur.

L'article traite de la balise Meta de la fenêtre, essentielle pour la conception Web réactive sur les appareils mobiles. Il explique comment une utilisation appropriée garantit une mise à l'échelle optimale du contenu et une interaction utilisateur, tandis que la mauvaise utilisation peut entraîner des problèmes de conception et d'accessibilité.

L'article traite du & lt; iframe & gt; L'objectif de Tag dans l'intégration du contenu externe dans les pages Web, ses utilisations courantes, ses risques de sécurité et ses alternatives telles que les balises d'objet et les API.
