接口

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. 移动端touch事件实现页面弹动--小插件

    动手之前的打盹 说实话真的是好久没有更新博客了,最近一直赶项目,身心疲惫:最关键的是晚上还要回去上一波王者,实在是忙啊! 这周下来,清闲了些许,或许是因为要到国庆的缘故吧,大家都显得无精打采.俗话说的 ...

  2. java注解生成xml和包含CDATA问题

    百度java生成xml,有一大推的文章,主要的生成方式一种使用Dom4J ,还有一种使用Jdk自带注解类! 下面主要整理我注解类的使用,(可以参考这篇文章Dom4J生成xml和包含CDATA问题)和x ...

  3. netty4.x 传输文件

    一:简介 netty传输文件的例子并不多,当前的项目刚才需要使用netty,所以就记录一下使用方法,使用netty传输文件,首先需要启动一个服务端,等待服务端请求监听,然后传输文件的时候,启动一个客户 ...

  4. Find 找规律,递推

    Find Time Limit: 2000/1000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) SubmitStatus P ...

  5. bzoj3713 [PA2014]Iloczyn|暴力(模拟)

    斐波那契数列的定义为:k=0或1时,F[k]=k:k>1时,F[k]=F[k-1]+F[k-2].数列的开头几项为0,1,1,2,3,5,8,13,21,34,55,-你的任务是判断给定的数字能 ...

  6. 在CentOS6上编译安装实现LAMP(php-modules)+phpMyAdmin安装过程全记录

    php与apache协作有三种模式:CGI.modules.FastCGI. 在CGI模式下,用户请求php文件时,apache会启动响应进程,调用php处理器处理请求,然后将结果返回给客户端.用户响 ...

  7. 30分钟快速学习Shell脚本编程

    什么是Shell脚本 示例 看个例子吧: #!/bin/sh cd ~ mkdir shell_tut cd shell_tut for ((i=0; i<10; i++)); do touch ...

  8. C#实现断点续传

    断点续传的原理在了解HTTP断点续传的原理之前,先来说说HTTP协议,HTTP协议是一种基于tcp的简单协议,分为请求和回复两种.请求协议是由客户机(浏览器)向服务器(WEB SERVER)提交请求时 ...

  9. ch1-vuejs基础入门(hw v-bind v-if v-for v-on v-model 应用组件简介 小案例)

    1 hello world 引入vue.min.js 代码: ----2.0+版本 <div id="test"> {{str}} </div> <s ...

  10. 【转】TCP/IP报文格式

    1.IP报文格式 IP协议是TCP/IP协议族中最为核心的协议.它提供不可靠.无连接的服务,也即依赖其他层的协议进行差错控制.在局域网环境,IP协议往往被封装在以太网帧(见本章1.3节)中传送.而所有 ...