phonegap与H5中的接口对比
接口 |
HTML5 |
phonegap |
差异 |
地理定位 geolocation |
单次定位: navigator.geolocation.getCurrentPosition(Success, [error],[options]); 重复性定位: navigator.geolocation.watchPosition(Success, [error],[options]); |
调用接口同左 |
二者调用方法一致 在phonegap中定位时,会由于设备差异,导致某些设备上无法定位,需要借助百度地图SDK定位。 |
摄像头 carema |
HTML5 的 The Media Capture(媒体捕捉) API 提供了对摄像头的可编程访问,用户可以直接用 getUserMedia获得摄像头提供的视频流 调用: navigator.getUserMedia(‘video’,success,error) (1)获取视频流:一个HTML5 的 Video 标签,将从摄像头获得的视频作为这个标签的输入来源。 Function success(videoStream){ viedo_ele.src=videoStream; } (2 )使用canvas绘制video标签的内容, ctx.drawImage(video_element,0,0,cw,ch,0,0,vw,vh) (3)获取图片:将Canvas的数据转换为base64位编码的PNG图像 Var imgData=canvas.toDataURL(“image/png”); |
提供对设备默认摄像头应用程序的访问,图片以base64编码的字符串或图片URI形式返回: navigator.camera.getPicture(Success, cameraError, [ cameraOptions ] ); 通过cameraOptions参数所设定返回格式:默认返回base64编码 destinationType:Camera.DestinationType.FILE_URI(返回URI) |
调用接口不一样 HTML5通过访问摄像头的接口,使用video和canvas标签,模拟拍照效果。目前仅Chrome和opera支持。 phonegap是直接调用原生的摄像头。 |
方向变化 compass |
HTML5提供了DeviceOrientation 事件监听有关设备的物理方向和移动信息。根据手机旋转情况确定指南针旋转角度 指南针的显示用canvas绘制。 window.addEventListener("deviceorientation", update, false); Deviceorientation方向事件对象中包含设备前后旋转、左右旋转、沿Z轴旋转等的角度。 (1)DeviceOrientationEvent.absolute 返回的是个bool值表示设备是否绝对支持方向定位 (2)DeviceOrientationEvent.alpha 表示设备沿z轴上的旋转角度,范围为0~360。 (3)DeviceOrientationEvent.beta范围为-180~180。它描述的是设备由前向后旋转的情况。 (4)DeviceOrientationEvent.gamma范围为-90~90。它描述的是设备由左向右旋转的情况。 |
检测设备方向或朝向,使用度作为衡量单位,取值范围从0度到359.99度。 navigator.compass.getCurrentHeading(Success,Error,Options); 在固定的时间间隔获取罗盘朝向的角度变化: navigator.compass.watchHeading(Success,Error, [compassOptions]); function Success(heading) { alert(heading.magneticHeading); }; |
调用的接口不一样 HTML5提供的方向变化事件包含的信息更详细。 Phonegap只提供了设备朝向 |
本地存储 Storage |
HTML5中支持localStorage和sessionStorage两种storage存储方式,前者是持久性的数据存储,后者是会话级别的数据存储。 localStorage.setItem(key,value); localStorage.getItem(key); |
phonegap提供对W3C localStorage 接口的访问,可以使用键值对的方式存储数据。 var storage= window.localStorage; storage.setItem(key,value) storage.getItem(key); |
二者调用接口一致 |
文件系统 fileSystem |
HTML5提供了PERSISTENT(永久存储)和TEMPORARY (临时存储)两种存储模式。 (1)获取调用fs对象的方法 window.requestFileSystem=window.requestFileSystem || window.webkitRequestFileSystem; (2)请求fs对象 window.requestFileSystem(type,size,success,error); (3)通过fs对象获取文件,利用FileReader、FileWriter读写文件: function success(fs){ //获取目录 fs.root.getDirectory(); // fs.root.getFile(); //获取文件 } /*申请5MB临时存储空间*/ window.requestFileSystem(window.TEMPORARY,5*1024*1024,onInitFs,errorHandler); |
也提供两种存储模式,但是通过一个localFileSystem对象来指定存储类型。 (1)请求一个filesystem对象:window.requestFileSystem(LocalFileSystem.PERSISTENT,0,onSuccess, onError); (2)通过fs获取文件,利用 FileReader、FileWriter读写文件: function onSuccess(fs){ fs.root.getDirectory(); // fs.root.getFile(); } |
二者调用接口基本一样。 只是前者请求filesystem对象的方法跟浏览器有关,目前只有chrome支持。 Phonegap中使用自身封装的接口,与浏览器无关。 |
phonegap与H5中的接口对比的更多相关文章
- Java和C#中的接口对比(有你不知道的东西)
1.与Java不同,C#中的接口不能包含字段(Field). 在java中,接口中可以包含字段,但是这些字段隐式地是static和final的.而C#不允许接口中有字段,编译器在编译时就会提示错误(如 ...
- HTML5与phonegap接口对比
HTML5与phonegap接口对比 接口 HTML5 phonegap 差异 地理定位 geolocation 单次定位: navigator.geolocation.getCurrentPosit ...
- 从web图片裁剪出发:了解H5中的Blob
刚开始做前端的时候,有个功能卡住我了,就是裁剪并上传头像.当时两个方案摆在我面前,一个是flash,我不会.另一个是通过iframe上传图片,然后再上传坐标由后端裁剪,而我最终的选择是后者.有人会疑惑 ...
- 关于H5中的Canvas API的探索
Canvas API 是H5中比较炫酷的一部分内容.可以通过它动态的生成和展示图形.图表.图像以及动画.下面我将学习一下Canvas API. 最后有书籍和源码. 一.概述: 1.基本元素: 在网页上 ...
- 微信H5中静默登录及非静默登录的正确使用姿势
在微信中打开网页且需要调用微信登录接口时,微信官方给我们提供了两种登录调用方式:静默登录和非静默登录:但是官方文档中却没有说明在何种情况下使用静默登录,何种情况下使用非静默登录,所以在这里,我想将之前 ...
- 从工程角度看C++观察者模式中的接口是否需要提供默认的实现
在C++中,我们会经常用到观察者模式(回调模式,Delegate模式等,意思都一样),比如当Source中的某个参数发生了变化时,我们通过观察者模式进行回调通知,下面是一个例子: class Sour ...
- (转)C#抽象类和接口对比
c#中抽象类(abstract)和接口(interface)的相同点与区别 转自:http://blog.csdn.net/fxh_hua/archive/2009/08/20/4464739.as ...
- h5调用底层接口的一些知识
之前接触过这方面的知识,一直想写一些关于代码的文字,但考虑到浪费时间,又不具备大神的实力,也不想去把别人的代码照搬过来,所以一直都是空白着的,今天敲代码的时候,有了一个比较好的想法,第一,定位在学习这 ...
- 对飞猪H5端API接口sign签名逆向实验
免责声明 本文章所提到的技术仅用于学习用途,禁止使用本文章的任何技术进行发起网络攻击.非法利用等网络犯罪行为,一切信息禁止用于任何非法用途.若读者利用文章所提到的技术实施违法犯罪行为,其责任一概由读者 ...
随机推荐
- vue+axios 前端实现登录拦截(路由拦截、http拦截)
一.路由拦截 登录拦截逻辑 第一步:路由拦截 首先在定义路由的时候就需要多添加一个自定义字段requireAuth,用于判断该路由的访问是否需要登录.如果用户已经登录,则顺利进入路由, 否则就进入登录 ...
- Https系列之四:https的SSL证书在Android端基于okhttp,Retrofit的使用
Https系列会在下面几篇文章中分别作介绍: 一:https的简单介绍及SSL证书的生成二:https的SSL证书在服务器端的部署,基于tomcat,spring boot三:让服务器同时支持http ...
- Python dict operation introduce
字典是另一种可变容器模型,且可存储任意类型对象. 字典的每个键值(key=>value)对用冒号(:)分割,每个对之间用逗号(,)分割,整个字典包括在花括号({})中 ,格式如下所示: d = ...
- 实例讲解webpack的基本使用第四篇
这一篇来讲解一下webpack的loader的使用,用webpack打包文件,css,img,icon等都需要下载安装对应的loader文件,并且写好配置项,才可以进行打包,废话不多说,直接开始实战. ...
- Linux系统管理命令(1)accton的使用
安装: apt install acct accton accton命令是Linux系统进程管理命令之一,它的作用是打开进程统计,如果不带任何参数,即关闭进程统计. 具体用法为:acc ...
- 批处理之 for/f 详解
含有/F的for格式:FOR /F ["options"] %%i IN (file) DO command FOR /F ["options"] %%i IN ...
- 深入理解C# 静态类与非静态类、静态成员的区别 [转载]
静态类 静态类与非静态类的重要区别在于静态类不能实例化,也就是说,不能使用 new 关键字创建静态类类型的变量.在声明一个类时使用static关键字,具有两个方面的意义:首先,它防止程序员写代码来实例 ...
- WPF使用资源字典组织资源
转载:http://blog.163.com/wangzhenguo2005@126/blog/static/371405262010111413321728/ 首先在解决方案资源管理器中添加 ...
- ViewPager使用记录1——展示固定数据
ViewPager是v4支持库中的一个控件,相信几乎所有接触Android开发的人都对它不陌生.之所以还要在这里翻旧账,是因为我在最近的项目中有多个需求用到了它,觉得自己对它的认识不够深刻.我计划从最 ...
- XamlReader动态使用xaml
xamlload先在xaml做出一个grid,命名xgrid <Page x:Class="xamlload.MainPage" xmlns="http://sch ...