0

EDIT - 8-15

To Refine my questions down:

1.) Can I pass data between two webviews within the same app using localStorage? If not is there a better solution?

2.) Can I use localStorage between a remote domain and local android files? If not is there a better solution?

3.) Does localStorage use cookies? Is this the same as the DOM adapter? I've seen a lot of explanations, some seem contradictory so I think I'm a bit confused about what is actually going on.


I'm creating a mobile application using phonegap and apppresser. Essentially, it is just a webview and I have two versions, and online and offline. The online version is sent to www/index.html which then redirects them to my live site. The offline version is assets/offline.html and I am going to make it appear similar to the online version so the user doesn't really know anything is inherently different other than they can no longer do online functions.

Long story short, I am trying to use lawnchair as I've only seen good comments about it and it seems pretty flexible. Let me preface this with lawnchair seems to work. I have tried the dom adapter and can successfully set and retrieve data between pages on the online version, but it does not seem to be able to be retrieved on the the offline version. The code I have used to successfully do this is below:

                    var store = new Lawnchair({
                        adapter: "dom",
                        name: "testing"
                    }, function(store) {
                    });

                    store.exists('events', function(available){
                        var preStr = "";

                        if(available){
                            preStr = "key is already available, ";
                        }else{
                            preStr = "key not available, ";
                        }

                        // create an object
                        var me = <?php echo json_encode($json_posts); ?>;

                        // save it
                        store.save(me);

                        // access it later... even after app restart!
                        store.get('events', function(me) {
                            $("#data").html(preStr + JSON.stringify(me));
                            alert(preStr + JSON.stringify(me));
                        });
                    });

and I used a slightly different variation for the offline version that doesn't save any data. So it kind of boils down to a few questions:

1.) Does lawnchair allow me to persist data on the same mobile application between domains in the webview? I'm not sure what domiain offline.html would be on, but technically index.html (the online version) is setting data on mydomain.com

2.) Is there a better technology I should be using in this scenario to persist data between html files and/or domains?

4

1 回答 1

0

目前,这是我找到的最佳解决方案。重申一下,我正在使用 phonegap 和 apppresser,它允许我将我的 wordpress 网站显示为一个移动应用程序。

在 index.html 中,我的代码如下所示:

<script src="jquery-2.0.2.js"></script>
<script src="lawnchair-0.6.1.js"></script>
<script type="text/javascript">   
function checkNetConnection(){
 var xhr = new XMLHttpRequest();
 var file = "http://example.com";
 var r = Math.round(Math.random() * 10000);
 xhr.open('HEAD', file + "?subins=" + r, false);
 try {
  xhr.send();
  if (xhr.status >= 200 && xhr.status < 304) {
   return true;
  } else {
   return false;
  }
 } catch (e) {
  return false;
 }
}

    if(checkNetConnection()){
        var store = new Lawnchair({
            adapter: "dom",
            name: "cachedvalues"
        }, function(store) {
        });

        // create an object
        $.get("http://example.com/api/get_posts/?post_type=event&ondate=2014-09-14",function(data){
            data.key = "events";
            alert(data);
            alert(data.key);
            store.save(data);   

            window.location = "http://example.com?appp=1";      
        });


    }else{
        var store = new Lawnchair({
            adapter: "dom",
            name: "cachedvalues"
        }, function(store) {
        });

        store.exists('events', function(available){
            var preStr = "";

            if(available){
                preStr = "key is already available, ";
            }else{
                preStr = "key not available, ";
            }

            // access it later... even after app restart!
            store.get('events', function(me) {
                alert(preStr + JSON.stringify(me));
            });
        });
    }

</script>

还有解释:

函数 checkNetConnection 检查互联网连接。如果存在,我会使用 $.get ping 我的 wordpress 网站,并且我的网站上安装了 JSON API 插件。我使用 JSON API 检索发布数据并在应用程序在线时将其缓存,因为这些数据通常似乎在应用程序重新启动之间持续存在(这让我相信“我可以使用 localStorage 在同一个应用程序内的两个 webviews 之间传递数据吗? " 和 "我可以在远程域和本地 android 文件之间使用 localStorage 吗?" 不是)。

如果应用程序不在线,那么我只是尝试获取已经缓存的数据。

优点:

  • 持久数据
  • 通常不支持的解决方案的离线模式

缺点:

  • 在加载实际页面之前必须等待 $.get 完成,这可能会导致应用程序启动感觉有点慢,并且页面的初始 html 会显示直到 $.get 完成(我希望使用启动来缓解屏幕掩码)
  • 用户必须至少通过互联网连接访问过应用程序一次(如果没有可用的缓存,我希望通过使用静态内容来缓解)
  • 可定制的解决方案与即插即用

这是我的自定义解决方案。它将满足我公司的需求。我不能保证它对其他人也一样有效。

于 2014-08-15T15:53:11.637 回答