接口

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中的接口对比的更多相关文章

  1. Java和C#中的接口对比(有你不知道的东西)

    1.与Java不同,C#中的接口不能包含字段(Field). 在java中,接口中可以包含字段,但是这些字段隐式地是static和final的.而C#不允许接口中有字段,编译器在编译时就会提示错误(如 ...

  2. HTML5与phonegap接口对比

    HTML5与phonegap接口对比 接口 HTML5 phonegap 差异 地理定位 geolocation 单次定位: navigator.geolocation.getCurrentPosit ...

  3. 从web图片裁剪出发:了解H5中的Blob

    刚开始做前端的时候,有个功能卡住我了,就是裁剪并上传头像.当时两个方案摆在我面前,一个是flash,我不会.另一个是通过iframe上传图片,然后再上传坐标由后端裁剪,而我最终的选择是后者.有人会疑惑 ...

  4. 关于H5中的Canvas API的探索

    Canvas API 是H5中比较炫酷的一部分内容.可以通过它动态的生成和展示图形.图表.图像以及动画.下面我将学习一下Canvas API. 最后有书籍和源码. 一.概述: 1.基本元素: 在网页上 ...

  5. 微信H5中静默登录及非静默登录的正确使用姿势

    在微信中打开网页且需要调用微信登录接口时,微信官方给我们提供了两种登录调用方式:静默登录和非静默登录:但是官方文档中却没有说明在何种情况下使用静默登录,何种情况下使用非静默登录,所以在这里,我想将之前 ...

  6. 从工程角度看C++观察者模式中的接口是否需要提供默认的实现

    在C++中,我们会经常用到观察者模式(回调模式,Delegate模式等,意思都一样),比如当Source中的某个参数发生了变化时,我们通过观察者模式进行回调通知,下面是一个例子: class Sour ...

  7. (转)C#抽象类和接口对比

    c#中抽象类(abstract)和接口(interface)的相同点与区别  转自:http://blog.csdn.net/fxh_hua/archive/2009/08/20/4464739.as ...

  8. h5调用底层接口的一些知识

    之前接触过这方面的知识,一直想写一些关于代码的文字,但考虑到浪费时间,又不具备大神的实力,也不想去把别人的代码照搬过来,所以一直都是空白着的,今天敲代码的时候,有了一个比较好的想法,第一,定位在学习这 ...

  9. 对飞猪H5端API接口sign签名逆向实验

    免责声明 本文章所提到的技术仅用于学习用途,禁止使用本文章的任何技术进行发起网络攻击.非法利用等网络犯罪行为,一切信息禁止用于任何非法用途.若读者利用文章所提到的技术实施违法犯罪行为,其责任一概由读者 ...

随机推荐

  1. RAID及热备盘详解

    RAID,为Redundant Arrays of Independent Disks的简称,中文为廉价冗余磁盘阵列. 一.出现的原因(RAID的优点): 它的用途主要是面向服务器,但现在的个人电脑由 ...

  2. 【转】Spark Streaming和Kafka整合开发指南

    基于Receivers的方法 这个方法使用了Receivers来接收数据.Receivers的实现使用到Kafka高层次的消费者API.对于所有的Receivers,接收到的数据将会保存在Spark ...

  3. Integer的自动拆箱

    public class Test2{ public static void main(String[] args){ Integer a=1; Integer b=2; Integer c=3; I ...

  4. 全方位解读及介绍windows网络安全及常见攻击方式

    本来我就是来逛逛论坛的,可是看到前面有位一样是干网络安全的同行,留下来过的痕迹,发了一篇相对不错的文章,我寻思咱既然来这一趟,也不能显得就比别人差啊.所以我也就写了这一片不算成熟小文章,望各位共勉之哈 ...

  5. epoll模型的使用

    1. 创建epoll句柄 int epfd = epoll_create(int size); 该函数生成一个epoll专用的文件描述符.它其实是在内核申请一空间,用来存放你想关注的socket fd ...

  6. jquery系列教程1-选择器全解

    全栈工程师开发手册 (作者:栾鹏) 快捷链接: jquery系列教程1-选择器全解 jquery系列教程2-style样式操作全解 jquery系列教程3-DOM操作全解 jquery系列教程4-事件 ...

  7. java.security.InvalidKeyException: Illegal key size

    今天遇到一个奇怪的问题. 自己做的加签验签功能已经没有问题了,本地测试通过,同事放到服务器上测试也没问题. 然后我将包放到自己搭建的环境上,会报这样一个错误: java.security.Invali ...

  8. ReactiveCocoa基础和一些常见类介绍

    一 导入ReactiveCocoa框架 通常都会使用CocoaPods(用于管理第三方框架的插件)帮助我们导入 podfile如果只描述pod 'ReactiveCocoa', '~> 4.0. ...

  9. Github Page--CSDN新人的第二选择

    我也是个CSDN新人,使用的CSDN的初衷应该和众人类似,就是想总结下平时的学习成果,或者一些想法. CSDN好的地方: 书写界面简洁,支持markdown语法 人还算多,也比较年轻 相对较活跃 内容 ...

  10. ABAP 在屏幕上显示图片

    1.se78 上传 或 预览图片 图片预览 2.程序代码 定义各变量 DATA: H_PICTURE TYPE REF TO CL_GUI_PICTURE, H_PIC_CONTAINER TYPE ...