Android学习笔记 3 : Webview - Native和HTML5结合
来源:互联网 发布:我的世界java问题 编辑:程序博客网 时间:2024/05/01 21:50
要开发一个给公司内部使用的App,自然就会想到能不能用HTML5来做,几个好处
1. 速度快,HTML5做界面快,企业内部使用,简明快捷,不求酷炫,客户端对不同设备的兼容性也容易处理
2. 前后台接口简单,其实就没什么接口了,相当于客户端嵌一个browser
3. 功能修改,代码全部在服务器端,客户端不需要升级
4. 学习成本低
由于App还需要能接受push消息,获取地理位置等功能,所以准备用混合模式,native部分处理用户登录、整体导航、消息处理等,HTML5提供绝大部分业务功能,包括各类业务信息的查看和处理。
这个模式要解决的主要问题就是用户登录后,如何再HTML5网页访问服务器时,把认证信息带过去。
解决思路:
1. 用户登录后,生成一个token,缓存在本地,服务器会记录用户账号,设备标识,以及需要的各种id,设置有效期
2. App启动,本地如果有有效token,则使用token连服务器自动认证,更新服务器端信息
3. App内嵌webview,所有web请求都包含这个token
对于我这个初学者,难点就在这第3步
考虑了两种方式:
1. 截取web请求,设置header (或rewrite url)
2. cookie
先尝试了第一种,发现WebView只能截取页面点击link这个操作,post请求,ajax请求,都无法控制。不行
Cookie这个方式,上述所有操作都是work的
只是验证了技术原型。
在session、cookie有效期控制等方面还有很多细节要处理。
CookieManager cookieManager = CookieManager.getInstance();String tokenCookieStr = "token=my_token_in_cookie_new";cookieManager.setCookie(Host.URL_BASE, tokenCookieStr);
除此之外,还有两个小点:
1. html5 Title的显示
看了网上的资料,Android原生的标题栏看起来不大好控制,于是使用 no_title 的方式,自己加一个TextView作为标题栏
需要覆盖 WebChromeClient.onReceivedTitle() 方法
ps: WebChromeClient 这个名字挺莫名的,它是用来捕捉一些浏览器的事件,定制其行为,为什么这么命名?背后有什么故事?
final TextView tvTitle = (TextView)findViewById(R.id.web_title);WebChromeClient wcc = new WebChromeClient() {@Overridepublic void onReceivedTitle(WebView view, String title) {// TODO truncate string if too longtvTitle.setText(title);super.onReceivedTitle(view, title);}};myWebView.setWebChromeClient(wcc);
2. 回退功能
用户按手机自带的回退键的时候,期望的行为一般是回到上一个页面。
可以覆盖Activity的onKeyDown()方法来实现
@Overridepublic boolean onKeyDown(int keyCode, KeyEvent event) {final WebView myWebView = (WebView)findViewById(R.id.myWebView);if(myWebView.canGoBack() && KeyEvent.KEYCODE_BACK == keyCode) {myWebView.goBack();return true;} else {return super.onKeyDown(keyCode, event);}}
至此这部分技术点校验完工,写了前后台一套原型代码,这里好像不能上传,再说了
再下一步,就是研究 JavaScript 和 native 程序的交互了。用户体验要好,这是关键。
黄鹤
2015-01-27
ps: 漏了一条,AndroidManifest.xml文件中,要添加访问互联网的权限
<uses-permission android:name="android.permission.INTERNET" />
- Android学习笔记 3 : Webview - Native和HTML5结合
- android跨平台开发系列之-综合运用webview和html5结合(三)
- 学习笔记-Android webview和JS交互
- Android WebView和Native交互的3种方式总结
- Android WebView学习笔记
- Android WebView学习笔记
- android webview 学习笔记
- webview系列:Html5页面和Native App怎么进行交互
- webview系列:Html5页面和Native App怎么进行交互
- webview系列:Html5页面和Native App怎么进行交互
- android学习笔记之WebView
- Android开发学习笔记WebView
- React Native Android学习笔记
- 【HTML5学习笔记】3:超链接和路径
- Android WebView加载html5 3D全景
- HTML5 Cache, Android WebView
- Android webview+Html5 video
- 第三讲:React Native & HTML5+(学习笔记1)
- MyEclipse部署web项目按钮不能用、报空指针异常(绝壁管用)
- source insight 完美支持中文(解决中文乱码)
- 创建表的时候字段有中文状态的特殊符号,项目启动不成功
- 内存的工作原里(二)
- Android系统java层次service介绍
- Android学习笔记 3 : Webview - Native和HTML5结合
- MFC VC ADO链接SQL Server数据库 操作数据库数据
- TLD之学习篇(四)
- 查看Oracle EBS报表输出,IE闪了一下就消失,报表没有打开
- 判断字符串中是否含有中文字符
- iOSreloadSections:withRowAnimation:
- 基于STM32+W5500的UPnP协议应用
- HDU-IMNU集训之不及AC送我情~:Climbing Worm-新学到一个函数
- adb常用命令