WebView杂谈
来源:互联网 发布:淘宝卖鲜花 编辑:程序博客网 时间:2024/06/05 11:14
本文主要讲解有关在WebVeiw中加载一段js代码片段到WebView中,这一段js代码是以字符串的格式出现,我们要做的就是将这一段字符串格式的js代码嵌入到页面中,并能正常显示。
那么问题来了:
1.如何实现将字符串嵌入到html页面?
2.这有什么卵用?
额,好吧,先来第一个问题:
在js中我们可以用js的方法innerHTML来实现在js中想html页面中插入想要的内容,这里我们只不过是在Java中插入内容到html页面中而已。WebView是可以通过loadUrl()方法来加载js代码的,所以我们可以通过加载js代码来向html页面中插入内容。
好,下面上砖头:
public class LoadServerPageUtil { /** * 加载js代码片段到页面 * @param webView * @param script js代码片段 */ public static void injectScriptFile (WebView webView, String script) { String encoded = Base64.encodeBase64String(script.getBytes()); Log.e("encoded", encoded); webView.loadUrl("javascript:(function() {" + "var parent = document.getElementsByTagName('head').item(0);" + "var script = document.createElement('script');" + "script.type = 'text/javascript';" + "script.charset = 'utf-8';" + // Tell the browser to BASE64-decode the string into your script !!! "script.innerHTML = decodeURIComponent(escape(window.atob('" + encoded + "')));" + "parent.appendChild(script)" + "})()"); }}
上面显示的代码的作用就是将字符串格式的js代码作为html页面引用的js文件插入到html页面中,效果类似于:
<script type="text/javascript" charset="utf-8" src="**.js"/>
接下来我们就可以随意调用那一段js代码中的方法了。
调用这个工具类的时机要把握好。先来看看WebView的两个辅助类WebViewClient和WebChromeClient:
1.WebChromeClient主要辅助WebView处理Javascript的对话框、网站图标、网站title、加载进度2.WebViewClient主要帮助WebView处理各种通知、请求事件的
这里要用的是WebViewClient辅助类。
/** * Created by harry on 15/8/18. * * 用于加载js代码段 */public class MyWebViewClient extends WebViewClient { private WebView webView; private String script; public MyWebViewClient(WebView webView, String script) { this.webView = webView; this.script = script; } /** * 在webview中点击超链接时,是调用系统浏览器显示还是在当前webview中显示 * * * @param view * @param url * @return false表示在当前webview中显示,默认是用系统浏览器显示 */ @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { return false; } /** * 当页面加载完后的操作 * @param view * @param url */ @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); LoadServerPageUtil.injectScriptFile(webView, script); }}
onPageFinished()方法作用很大,例如如果你想要加载图片到html页面是,我们知道加载图片是个很慢的过程,期间会对用户体验造成一定的影响,我们可以将加载图片的操作放在页面加载完后,提高用户体验。
我们在onPageFinished()方法中加载js代码片段,注意:这里如果有与上述引用js文件中同名的方法会将其覆盖掉。
最后就是在Activity中使用它了:
public class MainActivity extends Activity { private WebView wvJs; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); wvJs = (WebView) findViewById(R.id.wv_js); wvJs.getSettings().setJavaScriptEnabled(true); wvJs.getSettings().setDefaultTextEncodingName("UTF-8"); wvJs.setWebChromeClient(new WebChromeClient()); String script = "alert(\"你好,世界!\");"; wvJs.setWebViewClient(new MyWebViewClient(wvJs, script)); wvJs.loadUrl("file:///android_asset/as.html"); }}
好了,问题1已经解答完毕,可能脑子有点不清楚,写的东西比较乱,各位请谅解。
接下来的第二个问题:
现如今,WebApp越来越受到大众的喜爱,它的优点明显:
1.跨平台,开发一款app最蛋疼的无异于要考虑到不同平台的问题,我们可以不考虑windows phone、黑莓等系统,但不能只考虑Android和iOS中的一种,因为这两个平台的用户数量都是极大的,所以用原生开发需要开发两款app,而且使用的开发语言有较大的差别,会导致成本提高。2.可快速迭代版本
具体的可自己google,这里的第二个问题可以结合这一点,由于我们使用的H5开发界面以及js响应相关操作的,这样我们可以在不更新apk(目前只是只做Android,iOS的坑还没入门)的情况下更新我们的应用。这里只能向你们讲解一下思路,代码还没整,等整出啦之后,问问老大能不能贡献给各位。
客户端启动时,向服务端传一个版本号,与服务端的版本号比对,若不一致,则读取服务端的html和js文件成字符串,加密后传给客户端,客户端通过解析这些字符串为html语言和js代码在webview中显示。
大致的意思就是这样,具体操作还在摸索中,对这方面的解释可能有点low,请各位自行理gai。
最后奉上源码:
传送门
- WebView杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- 杂谈
- jquery中关于 (function($){...})(jQuery)与$(document).ready();的区别
- linux环境变量配置
- Android Studio系列--快捷键
- oc数组
- linux笔记之1--文件系统+创建、删除文件和文件夹命令
- WebView杂谈
- WCF中常用的binding方式
- SQL语句大全
- Programming in scala学习笔记(一)First step in scala
- Android自定义控件——ListView的下拉刷新与上拉加载
- Objective-C基础语法笔记
- CreateFileMapping用法
- 组织架构图,比较实用,收走
- Tomcat HTTPS