问题描述
|
如果我在phonegap中开发了一个Web应用程序,那么可以使同一Web应用程序运行在浏览器中的常规台式机/笔记本电脑中吗?
解决方法
请查看Ripple Chrome插件,以在Chrome浏览器中运行PhoneGap应用以及设备类型仿真。
, 是的...没有:
是的,因为它是由html,css和javascript组成的,所以您的web应用程序将在桌面浏览器中运行。
Phonegap专用的javascript调用(加速度计,指南针,文件等)不会。
基本上,如果您遵循标准的“是”,则可以相对轻松地将您的应用程序移植到大多数浏览器,此时的工作大部分是主题化工作。
, DesktopGap使用嵌入式Chrome浏览器代替IE。只有Windows版本。
, 不在浏览器中,但Phonegap具有Windows 8支持,因此如果您按此处编译应用程序
;您可以仅在w8上运行您的应用程序,但我没有尝试过。
, 如果您做对的话,它肯定会在台式机和网络服务器上运行。
我使用许多应用程序来执行此操作,需要注意的是:
PhoneGap允许使用CORS,但桌面浏览器可能不允许
Cordova / PhoneGap API无法正常工作,如果您尝试调用它们,可能会引发错误
好的做法是将设备特定的事件侦听器等包装在onDeviceReady函数中,如下所示:
onDeviceReady: function() {
// Register the device event listeners
document.addEventListener(\"backbutton\",function (e) {
console.log(\"default prevented\");
e.preventDefault();
},false );
document.addEventListener(\"resume\",onDeviceResume,false);
并在初始化函数中注册
document.addEventListener(\"deviceready\",onDeviceReady,false);
除此之外,如果需要了解我们所处的平台或桌面(如果为假),我可以使用原始函数来分配变量“ phonegap”,以供参考。
isPhoneGap: function() {
var is = false;
var agent = navigator.userAgent.toLowerCase();
var path = window.location.href;
if (path.indexOf(\"file://\") != -1) {
if (agent.indexOf(\"android\") != -1) {
is = \"android\";
} else if (agent.indexOf(\"iphone\") != -1 || agent.indexOf(\"ipad\") != -1 || agent.indexOf(\"ipod\") != -1) {
is = \"ios\";
} else if (agent.indexOf(\"iemobile\") != -1) {
is = \"wp\";
}
}
return is;
},
不太漂亮,但希望能有所帮助。
, MacGap是一个非常活跃的项目,似乎很好地支持了API。
las,它仅适用于Mac OSX,但可能是一个很好的起点?
, 现在,您可以将browser
平台与Cordova一起使用。
您可以使用常规的Cordova CLI命令安装它
cordova platform add browser
然后安装标准的Cordova插件,它们提供与设备上相同的编程接口。例如看一下https://github.com/apache/cordova-plugin-camera/#supported-platforms。 Howether支持的设备并非100%兼容,但Cordova团队尝试将尽可能多的兼容解决方案作为平台提供给浏览器
, 令我感到惊讶的是,我找不到在桌面浏览器中测试应用程序的简单方法,因此我启动了一个GitHub项目,这使整个过程变得毫不费力。目前仅模拟了数量有限的插件,但我将添加更多插件,希望贡献者可以帮助更快地完成其他插件。还计划支持选择不同的屏幕尺寸和其他自定义设置。希望能帮助到你。
, 如果您的phonegap应用程序不依赖于任何本机代码,那么可以,您只需使用创建Web应用程序所需的html,css和js文件即可。如果您的phonegap应用程序使用任何phonegap插件或特定于phonegap的javascript调用,那么您只需要决定如何在Web应用程序上实现这些即可。
, 您也可以尝试使用--disable-web-security命令行选项在Chrome中运行您的应用。它将允许您执行一些“移动”操作,例如跨域请求等。
希望这可以帮助 !
, 由于电话间隙应用程序是使用JS,HTML和CSS构建的,因此您可以访问这些HTML文件并在浏览器中运行。
但是您的代码可以访问任何设备特定的调用,那么它将引发错误。
, 如果您使用的是Mac,请打开终端并禁用网络安全
open -a /Applications/Google\\ Chrome.app --args --allow-file-access-from-files --disable-web-security
打开homepage.html并享受:)
, 正如雷米所说,您编写的大多数标准内容都可以,但是您需要包装某些使用摄像头/加速度计的方法,以查看您是否在应用程序中。
尽管更好的解决方案是使用功能检测,因为您可以上传图片并通过移动网站中的HTML输入使用相机,但是我敢肯定您现在可以在某些版本的Desktop Chrome中访问网络摄像头。
如果要构建适当的通用应用程序,则需要使用大量功能/设备检测,或者具有核心核心产品,并使用Git子模块之类的东西来将其作为Phonegap应用程序包含和扩展。
没有单一,简单,标准化的方式来做到这一点。
, 试试这个:https://github.com/icblenke/phonegap-mac
我尝试了一个样品,效果很好。
,如果您以正确的方式进行操作,它将肯定会在桌面上运行。
我使用许多我的应用程序执行此操作,但是最好包装特定于设备的事件监听器,例如:
onDeviceReady: function() {
// Your Code for Device event listner
},false);
并初始化功能
document.addEventListener(\"deviceready\",false);
, 有一个工具可以在系统上运行任何android应用。工具名称为“ bluestack”,它可以在系统上运行任何android应用。
, 在Chrome中使用Ripple Emulator,您可以运行phonegap应用。
PhoneGap是一个应用程序框架,使您可以使用HTML和JavaScript构建本地安装的应用程序。
想到PhoneGap的最简单方法是宽度为100%,高度为100%的Web视图容器,并带有JavaScript编程界面,该界面可让您访问基础操作系统功能。
有关Phonegap的更多详细信息
, 您可以安装Android VM并在台式机/ Mac / Cisco办公终端/电话/等上运行它。
您可能要问的是您是否可以拥有单个代码库。答案是99%是。您需要几个\“ extra \\”文件用于phonegap(index.html,config),但除此之外,您可以将相同的代码部署到两个地方。工作正常。好吧,有些“陷阱”,例如ѭ8,在某些手机/平板电脑上无法正常工作,而当前的Android版本和其他版本不支持这些数据列表。布局问题也可以通过媒体查询解决。但是,两个地方都使用相同的代码库。只需对Web服务进行AJAX即可。如果需要,HTML可以在应用程序本地存储。
PhoneGap应用程序与WebApp的99%相同。实际上,将完全相同的文件夹压缩并上传到build.phonegap,就像复制到Web门户一样。完全如上所述,您可以使用相同的Web应用程序,并且确实可以在Web浏览器中运行。顺便说一句,您可以使用HTML / js中的摄像头,并且不需要特定于PhoneGap的代码。对于GPS同样如此(尽管您需要一些健壮的代码才能使其在许多手机上都能正常工作)。加速度计和其他硬件当然是例外。但是,du!
实际上,我的答案是指出您将遇到的许多问题的仅有的两个之一。另外,需要指出设备像素的混乱情况。您可以使用CSS和百分比布局进行细化,然后使用media-query为平板电脑,更新的手机等添加自定义CSS mod。这当然是一团糟。如果您想要更好的支持,最终将为平板电脑,手机和其他显示器尺寸制作几乎定制的屏幕。然后,您将学习如何制作UI小部件/片段/使其变得更聪明。一个简单的示例是使用jquery数据表并在较小的设备上时更改列(隐藏较低的信息内容列)。等等,将单选按钮更改为较小的电话上的选项。等等。当然,由于html select的Android平板电脑实施受到打击,您最终将不得不发明自己的Droplist或使用jquery UI等中的一个。