如何将服务器端生成的新页面加载到 PhoneGap 或 Cordova 应用程序中？答案

【问题标题】：How to load new pages generated server-side into a PhoneGap or Cordova app?如何将服务器端生成的新页面加载到 PhoneGap 或 Cordova 应用程序中？
【发布时间】：2019-04-03 16:47:35
【问题描述】：

我正在尝试找出最简单、最快捷的技术，以使我们公司的网站适应可从应用商店下载的应用。 PhoneGap/Cordova 看起来不错。使用 InAppBrowser 插件看起来很明显，但我们需要通过 Cordova 插件访问一些手机 API，而且似乎无法在 InAppBrowser（Webview？）窗口中访问它们的数据。

作为替代方案，我想知道为什么我不能直接用从我们的服务器加载的新 HTML 页面内容直接替换 PhoneGap 页面（实际上是单页应用程序）中的 HTML 内容？我们在服务器端使用 Laravel 模板，因此已经有一个页面包装器，Laravel 在发送到客户端之前将页面特定的内容（在服务器上）注入其中。我可以将页面包装器 HTML 移动到前端（进入编译到我的 PhoneGap 应用程序中的 SPA），完成所有页面所需的所有 JS 和 CSS，然后将新页面内容实时加载到 DOM 中（例如在页面中） BODY)，任何 JS 都可以通过 Cordova 插件访问手机 API。

这是可行的，还是我错过了什么？（有什么陷阱吗？）

谢谢。

【问题讨论】：

你实现了吗？
我现在得到了确切的要求，你是如何实现的会有帮助吗？
@NareshKumar 我不认为我曾经真正实现过这个，但我认为下面接受的答案看起来是正确的（虽然我没有尝试过）所以建议使用它？理论上实现这一点非常简单，只需通过 AJAX 加载内容，然后使用例如JQuery（或其他）来替换该页面上您要用来显示您加载的内容的元素的内容。

标签： javascript laravel cordova laravel-5 phonegap

【解决方案1】：

你可以使用这样的东西

在您的服务器中创建页面 home.php，如下所示：

<?php
header('Access-Control-Allow-Origin: *');
header("content-type: text/javascript");

          if(isset($_POST['home']))
           {
            $content_html = '<head><title> Test </title></head><body><span>working</span></body><script>declare  all necessary script hear</script>';
                  echo json_encode($content_html);  
            }
?>

在科尔多瓦 index.html 中

<html id="new_content">


</html>
 <script type="text/javascript" src="cordova.js"></script>
 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script>
       $('#new_content').html("<center><span>Loading ...</span></center>");
                  $.ajax({
                         type: "POST",
                         url: "http:/your_serveur/home.php",
                         data: {"home":"home"},
                         cache: false,
                         async:false,
                         success: function(data){   
                           var data = JSON.parse(data); 
                            $("#new_content").html(data);
                              },
                        });
</script>

【讨论】：

谢谢。我想它必须作为 JSON 编码发送？那是唯一的格式吗？好的，如果是这样，只是想确定一下。访问控制标头是因为响应是 JSON 格式吗？另外，是否可以将在 PHP 端定义的 Javascript（“在此处声明所有必要的脚本”）移动到 cordovaindex.html 中的
是的，它是通过 JSON 编码发送的，它快速且安全，如果您从 http server 发送请求，则访问控制允许来源，是的，您可以在 cordovaindex.html 中声明所有脚本，而不是 PHP 端。我在我的应用程序中使用了这个例子，它的工作很完美，u welcome
非常感谢。我认为这可以通过 HTTPS 工作？另外，cookies 怎么样——它们会起作用吗？我不希望我的用户在每次新页面查看时都退出登录 :) 谢谢
是的，可以使用 HTTPS&HTTP，是的，您可以在 javascript 中使用 cookie 并在不登录的情况下调用所有页面，欢迎