简体   繁体   English

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

[英]How to load new pages generated server-side into a PhoneGap or Cordova app?

I'm trying to figure out the easiest and quickest technique to adapt our company's website to an app that can be downloaded from the app stores. 我正在尝试找出最简单,最快的技术来使我们公司的网站适应可以从应用程序商店下载的应用程序。 PhoneGap/Cordova looks the way to go. PhoneGap / Cordova看起来很不错。 Using the InAppBrowser plugin looks like an obvious route but we're going to need access to some phone APIs via Cordova plugins and there seems no way to access data from them in the InAppBrowser (Webview?) window. 使用InAppBrowser插件似乎是一条显而易见的路线,但我们将需要通过Cordova插件访问某些电话API,并且似乎无法在InAppBrowser(Webview?)窗口中从其中访问数据。

As an alternative I'm wondering why can't I simply replace the HTML content directly in my PhoneGap page (effectively a single page app) with new HTML page content loaded from our server? 作为替代方案,我想知道为什么不能简单地将我的PhoneGap页面(实际上是单个页面应用程序)中的HTML内容替换为从服务器加载的新HTML页面内容吗? We're using Laravel templates server-side, so there is already a page wrapper into which Laravel injects page-specific content (on the server) before sending to the client. 我们在服务器端使用Laravel模板,因此已经有一个页面包装器,Laravel在将页面特定的内容(在服务器上)注入到页面包装器中之后再发送给客户端。 I could just move the page wrapper HTML to the front end (into the SPA compiled into my PhoneGap app) complete with all the JS and CSS needed across all pages, and then just live load new page content into the DOM (eg in the page BODY), and any JS would have access to phone APIs via Cordova plugins. 我可以将页面包装HTML移至前端(移入已编译到我的PhoneGap应用程序的SPA中),并包含所有页面所需的所有JS和CSS,然后将新页面内容实时加载到DOM中(例如,在页面中BODY),并且任何JS都可以通过Cordova插件访问电话API。

Is this feasible, or am I missing something? 这可行吗,或者我缺少什么? (any gotchas?) (有陷阱吗?)

Thanks. 谢谢。

You can use something like this 你可以用这样的东西

in your serveur create page home.php like this : 在您的serveur创建页面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);  
            }
?>

in cordova index.html 在cordova 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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM