在 phonegap 应用程序中显示动态 html 页面答案

【问题标题】：Showing dynamic html pages in phonegap applications在 phonegap 应用程序中显示动态 html 页面
【发布时间】：2014-05-21 02:09:43
【问题描述】：

我一直在使用 android sdk 在 eclipse 中使用我的 phonegap 应用程序，并试图弄清楚如何在 phonegap 应用程序中显示来自服务器数据库的动态 html 页面。

我想要完成的是；

拥有一个网页，例如 www.demo.com/login，phonegap 应用程序将登录该网页并显示 www.demo.com/dashboard.html，因此它会拍照，访问内置全球定位系统等。

是否有可能phonegap 应用程序可以像Web 浏览器一样使用并显示动态html 页面以及访问本机功能？我是否必须运行一个 web 服务，phonegap 应用程序将使用该 web 服务获取和发布 json 对象，然后在名为 mustache.js 的 js 或其他什么的帮助下呈现 html 代码？

非常感谢您的帮助

非常感谢

【问题讨论】：

标签： html dynamic cordova

【解决方案1】：

您可以将PhoneGap 与PHP 和jQuery Ajax 一起使用来获取内容。在文件头加载 jQuery 库。在函数onBodyLoad(), 处为 PHP 文件调用 Ajax：

$('#content').load('http://www.example.com/test.php'); 在 HTML 会话中，将 div id="content" 放在要显示内容的位置。

PHP：

for($i=1; $i<=10; $i++) {
    echo '<p>Dinamic content coming from test.php! Value: ' . $i . ' of 10.</p>';
}

HTML 将打印：

<p>Dinamic content coming from test.php! Value: 01 of 10.</p>
<p>Dinamic content coming from test.php! Value: 02 of 10.</p>
<p>Dinamic content coming from test.php! Value: 03 of 10.</p>
<p>Dinamic content coming from test.php! Value: 04 of 10.</p>
<p>Dinamic content coming from test.php! Value: 05 of 10.</p>
<p>Dinamic content coming from test.php! Value: 06 of 10.</p>
<p>Dinamic content coming from test.php! Value: 07 of 10.</p>
<p>Dinamic content coming from test.php! Value: 08 of 10.</p>
<p>Dinamic content coming from test.php! Value: 09 of 10.</p>
<p>Dinamic content coming from test.php! Value: 10 of 10.</p>

要将内容发送到另一个页面并让用户登录，您可以这样做

$.get('login.php?name=user', function(data) {
    $('#content').html(data);
});

你的 login.php 可能有类似的东西：

if (isset($_GET['name'])) {
    $name = $_GET['name'];
    echo "Name: $name";
} else {
    echo "Please enter a valid name!!";
}

为了确保您的登录安全，您可以使用 POST 方法，如下所述：

$('#form').submit(function() {
    $.post('login.php', $('#form').serialize(), function(data) {
        $('#content').html(data);
    });
    return false; // to avoid page going to login.php file
});

还有login.php

if(!empty($_POST)) {
    $user = $_POST['name'];
    $pass = $_POST['password'];
    // db query and stuff goes here...
    echo "Worked!";
} else {
    "Enter values!";
}

【讨论】：

非常感谢里奥。另一个问题;我如何能够以类似于您上面描述的方式执行 https 请求？你有什么推荐吗？再次感谢...

【解决方案2】：

jqueryMobile + PhoneGap 是一种快速完成工作的方法。对于 ajax 调用，只需点击一个 url，它将以 json 格式为您提供数据并动态呈现。

PhoneGap 提供了一些 javascript 函数来访问相机、GEO 位置和类似的东西。

看看这个：

http://www.mobiledevelopersolutions.com/home/announce-1/mds11eclipsepluginforphonegaponandroidreleasestoday-jquerymobileandsenchatouchadded

维基页面： http://wiki.phonegap.com/w/page/36868306/UI%20Development%20using%20jQueryMobile

【讨论】：