本节书摘来自异步社区《PhoneGap精粹：构建跨平台的移动App》一书中的第1章，第1.3节PhoneGap工作机制，作者 【美】John M. Wargo，更多章节内容可以访问云栖社区“异步社区”公众号查看
1.3 PhoneGap工作机制
PhoneGap精粹：构建跨平台的移动App
正如之前提到的，PhoneGap让开发人员可以使用Web技术（HTML、CSS和JavaScript）为移动设备（智能机和平板电脑）构建原生的应用程序。一名开发人员为移动设备构建Web应用程序，然后使用PhoneGap提供的特殊工具将Web应用程序打包成各个平台的原生应用程序。图1-1揭示了这个打包的过程，在本章后面的部分我们会详细解释其中的细节。
在打包出来的原生应用程序中，该应用程序的用户界面主要由一个满屏显示的web视图构成。当启动应用程序时，该应用程序会将Web应用程序的启动页（通常是index.html，但你也可以修改为其他的页面）加载到Web视图中，然后将用户操作传入Web视图中，让用户可以与Web应用程序交互。当用户与应用程序的内容（即Web应用程序）交互时，应用程序中的链接或者JavaScript代码可以从随应用程序打包的资源文件中加载其他内容，当可以访问网络时，也可以从Web服务器或者应用程序服务器上获取内容。
对于某些移动平台来说，比如bada、Symbian和webOS，原生应用程序就是Web应用程序。它们没有编译成原生应用程序，然后部署到设备的概念。取而代之的是在设备上运行一个被专门打包的Web应用程序。在后续的章节中，我们会更详细地介绍。
Web视图
Web视图是一个原生应用程序组件，该组件用于显示原生应用程序中的Web内容（通常是HTML页面）。在移动设备中，Web视图本质上是一个可以通过编程方式访问的内置Web浏览器的封装器。
比如，在BlackBerry平台上，Web视图被实现为一个Browser Field对象（使用net.rim. device. api. browser.filed2）。在Android上，通过WebView视图（android.webkit. WebView）实现，还有在iOS上，它是UIWebView（System/Library/Frameworks/UIKit. framework）。
Web应用程序运行在Web视图这个容器中，就像Web应用程序运行在移动Web浏览器中。Web视图也可以显示其他（本地或远程Web服务器上）的HTML页面；内嵌在应用程序中的JavaScript实现了所需的应用程序逻辑、根据页面需要显示或隐藏内容、播放多媒体文件、打开新的页面、执行运算以及向服务器收发内容。应用程序的外观和体验可以通过CSS或者直接在HTML元素中添加设置来实现，比如线、间距、色彩或底纹等属性。在页面中使用图形元素也可以为应用程序提供更好的外观。任何可以通过Web应用程序实现的功能，你都可以用PhoneGap应用程序实现。
通常来说，移动Web浏览器无法像设备上的其他应用程序（比如，通讯录（Contacts）应用程序）那样访问设备端的组件和硬件（加速度计、摄像头、罗盘、麦克风等）。但是典型的原生移动应用程序是会经常使用这些组件的。为了能够创造出有趣的移动应用程序，我们的移动应用程序需要访问这些web容器之外的原生设备组件。PhoneGap提供了一套JavaScript API来满足这些需要，开发人员可以使用这些JavaScript API让运行在PhoneGap应用程序容器中的Web应用程序访问这些设备组件。图1-2在一个较高的层次上说明了其中的原理。
当开发人员在应用程序中使用PhoneGap实现某个功能时，该应用程序会通过JavaScript调用PhoneGap API，然后应用程序的某个特殊的层会将对PhoneGap API的调用翻译成对应的原生API。比如在BlackBerry上调用摄像头的方法就和在Android上的不一样，所以这个API公共层让开发人员可以对不同平台使用同一接口，该接口会在作为容器的应用程序中被翻译成对应平台的原生API。让我们来看下使用PhoneGap的应用程序，JavaScript代码看上去应该像下面这样：
navigator.camera.getPicture( onSuccess, onFail );
这里我们传入了两个回调函数作为参数：onSuccess和onFail（在后面的章节中我们会详细解释）。
在BlackBerry上，上面这段代码相当于在后端执行了下面的代码：
Player player = Manager.createPlayer("capture://video");
player.realize();
player.start();
VideoControl vc = (VideoControl) player.getControl("VideoControl");
viewFinder = (Field)vc.initDisplayMode(VideoControl.USE_GUI_PRIMITIVE,
"net. rim.device.api.ui.Field");
scrnMain.add(viewFinder);
vc.setDisplayFullScreen(true);
String imageType ="encoding=jpeg&width=1024&height=768&quality=fine";
byte[] theImageBytes = vc.getSnapshot(imageType);
Bitmap image = Bitmap.createBitmapFromBytes(imageBytes, 0, imageBytes.length, 5);
BitmapField bitmapField = new BitmapField();
bitmapField.setBitmap(image);
scrnMain.add(bitmapField);
在Android上，对应的代码如下所示：
camera.takePicture( shutterCallback, rawCallback,jpegCallback );
以及在iOS上，代码如下所示：
UIImagePickerController *imgPckr =[[UIImagePickerController alloc] init];
imgPckr.sourceType = UIImagePickerControllerSourceTypeCamera;
imgPckr.delegate = self;
imgPckr.allowsImageEditing = NO;
[self presentModalViewController:imgPckr animated:YES];
虽然这里列出的示例代码并没有涵盖获取图片过程的所有方面（比如处理错误或者处理返回的图片），但是这个示例向我们展示了PhoneGap是如何简化跨平台移动开发的。在PhoneGap支持的移动平台间，开发人员可以使用一个通用的API，PhoneGap会将这次调用翻译成每个平台对应的原生API。这使得开发人员无需掌握大量潜在的技术，让他们可以更专注于应用程序本身而不是如何在不同设备上实现。
目前，PhoneGap支持以下API：
Accelerometer（加速度计）
Camera（摄像头）
Capture（捕获）
Compass（罗盘）
Connection（连接）
Contacts（通讯录）
Device（设备）
Events（事件）
File（文件）
Geolocation（地理位置）
Media（多媒体）
Notification（通知）
Storage（存储）
随着新标准的演变，PhoneGap项目团队会不断提出其他的API。PhoneGap对于API的实现倾向根据W3C的Device APIs and Policy（DAP）Working Group（www.w3.org/2009/dap）的规范进行实现。该小组致力于“创造一种客户端API，通过该API可以在开发Web应用程序和Web元件时和设备服务（比如日历、通讯录、摄像头等）交互。随着DAP API越来越规范，PhoneGap将会实现DAP API。
随着时间的推移，当移动设备浏览器完全实现DAP API时，PhoneGap就会失去价值。当所有移动浏览器都支持DAP API时，就没有什么功能是需要PhoneGap提供的了，同时PhoneGap也将消失。
Apple和PhoneGap
在iOS应用程序中，Apple对能做什么和不能做什么有着严格的限制。在2009年9月，Apple通过了PhoneGap应用程序（使用PhoneGap框架的0.8版本）。如今，在Apple App Store中已经有许多PhoneGap应用程序了。
