在phonegap和web上使用相同的代码库？

Question

在我们的移动web应用和phonegap应用中使用相同的代码库是明智的吗？它们应该是相似的，phonegap版本只是让我们做更多的事情。我们能检测到它是否没有运行在phonegap和对phonegap api的隔离调用上，还是将它们分开更有意义。

Answer 1

当然，您可以使用大多数相同的代码库。一些phonegap在html5中是相同的(例如localStorage)，所以在代码上没有区别。

如果您使用的是phonegap构建服务，它会将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
}

如果您需要一些常用的启动代码，请将其放入一个函数中，并从上面的onDeviceReady处理程序和else块调用此函数。

如果您正在调用的phonegap api与html5 api的名称不完全相同(例如，因为它具有Moz*或WebKit*前缀)，那么只需将这两个名称都包装在一个新名称中。例如：

var requestFileSystem = (isPhonegap() ? requestFileSystem : window.WebKitRequestFileSystem);

如果你正在使用的phonegap API确实没有html5的等价物，如果可能的话，试着自己用javascript复制这个功能，否则你只会失去浏览器中的功能。但要确保它在没有该功能的情况下足够优雅地降级。

注:测试移动设备的功能，如加速度计、地理位置等。在浏览器中，查看Ripple Chrome extension。

Answer 2

我想出了一种方法来保持网络代码库的完整性。

使用内置的deviceready事件的当前问题是，当页面加载时，你无法告诉应用程序：“嘿，这不是在移动设备上运行的，没有必要等待设备准备好启动”。

1. 在代码的本机部分，例如iOS，在MainViewController.m中有一个方法viewDidLoad，我发送了一个javascript变量，稍后我将在web代码中检查该变量，如果该变量存在，我将等待启动页面的代码，直到一切就绪(例如，导航地理位置)。

在MainViewController.m:

• (void) stringByEvaluatingJavaScriptFromString:jsString；}

1. index.html { viewDidLoad viewDidLoad；NSString* jsString = NSString stringWithFormat:@"isAppNative = true;"；self.webView stringByEvaluatingJavaScriptFromString:jsString；}
   1. index.html下，代码如下：

function onBodyLoad() { document.addEventListener("deviceready"，onDeviceReady，false)；} function onDeviceReady(){；myApp.run()；} try{ if(isAppNative！=未定义)；}catch(err){ $(document).ready(function(){ myApp.run()；})；}

Answer 3

我也会使用相同的代码库。PhoneGap的全部意义在于将你的移动站点转换成应用程序。适当地检测特性和屏幕区域并不是那么困难。单独代码库的麻烦通常是双重处理您的内容和样式的成本。如果有必要，您可以将它们分离到一个共享资源中，并在运行时/访问时将它们捆绑在一起，但就我个人而言，我仍然倾向于将它们放在一起。

这个博客涵盖了检测问题(也请参阅评论)：http://bennolan.com/2011/08/22/phonegap-detection.html。但问题的症结在于if (window.PhoneGap){...}