为phonegap和web使用相同的代码库?

fan*_*ncy 5 javascript mobile cordova

为我们的移动网络应用程序和phonegap应用程序使用相同的代码库是否明智?它们是相似的,phonegap版本只是让我们做更多.我们可以检测它是否没有在phonegap上运行并隔离对phonegap api的调用,或者将它们分开更有意义.

chr*_*ben 17

当然,您可以使用大部分相同的代码库.一些phonegap API在html5中是相同的(例如localStorage),因此那里的代码没有区别.

如果您正在使用phonegap Build服务,它会将phonegap.js/cordova.js脚本文件添加到您的项目根目录.只需将它包含在您的HTML中.然后,您可以检测您的应用程序是否在phonegap中运行:

var isPhonegap = function() {
  return (typeof(cordova) !== 'undefined' || typeof(phonegap) !== 'undefined');
}

if (isPhonegap()) {
  // phonegap.js/cordova.js exists.. now let's handle the onDeviceReady event
} else {
  // in-browser
}
Run Code Online (Sandbox Code Playgroud)

如果你需要一些常见的启动代码,把它放在一个函数中,并从onDeviceReady处理程序和上面的else块调用这个函数.

如果你正在调用的phonegap api与html5没有完全相同的名称(例如,因为它具有Moz*或WebKit*前缀),只需将两者都包含在一个新名称中.例如:

var requestFileSystem = (isPhonegap() ? requestFileSystem : window.WebKitRequestFileSystem);
Run Code Online (Sandbox Code Playgroud)

如果您使用的phonegap API确实没有等效的html5,请尝试在javascript中自行复制功能,否则您将丢失浏览器中的功能.但是如果没有该功能,请确保它足够优雅地降级.

注意:要在浏览器中测试移动设备的功能,如加速度计,地理位置等,请检查Ripple Chrome扩展程序.


Spl*_*iFF 0

我会使用相同的代码库。PhoneGap 的全部目的是将您的移动网站转换为应用程序。适当地检测功能和屏幕空间并不困难。单独代码库的问题通常是双重处理内容和样式的成本。如果有必要,您可以将它们分离到共享资源中,并在运行时/访问时将它们捆绑在一起,但就我个人而言,我仍然倾向于将它们全部放在一起。

该博客涵盖了检测问题(也请参阅评论):http ://bennolan.com/2011/08/22/phonegap-detection.html 。其关键在于if (window.PhoneGap){...}