0

我正在尝试使用 Ratchet 创建一个简单的 Cordova 移动应用程序，但无法push.js加载任何页面。我的研究发现的唯一一件事是推送事件仅适用于移动设备，但我没有在浏览器中使用它。我尝试通过 XCode 和cordova build ios cordova emulate iosCLI 进行模拟，但链接不起作用。它们闪烁表示我点击了它们，但没有发生任何操作。这是我想要在它们之间转换的两个页面。

索引.html

<html>
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />

        <!-- Set the viewport settings to prevent scaling -->
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, target-densitydpi=device-dpi" />

        <!-- Makes your prototype chrome-less once bookmarked to your phone's home screen -->
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">

        <title>MyProject</title>
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <link rel="stylesheet" href="css/ratchet.css">
        <meta name="msapplication-tap-highlight" content="no" />
        <script src="js/jquery-2.1.1.min.js"></script>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
        <script src="js/ratchet.js"></script>
        <script type="text/javascript">
            app.initialize();
            $(function(){
                window.localStorage.setItem('phone-number', '1-330-697-3044');
            });
        </script>
        <style>
            /*Stops the text from being in all caps*/
            body * {
                text-transform: none;    
            }
        </style>
    </head>
    <body>
        <!-- Bar items -->
        <header class="bar bar-nav">
            <h1 class="title">RealtyShout</h1>
        </header>
        <nav class="bar bar-tab">
            <a href="#" class="tab-item active">
                <span class="icon icon-home"></span>
                <span class="tab-label">Home</span>
            </a>
            <a href="subscriptions.html" data-transition="slide-in" class="tab-item">
                <span class="icon icon-star"></span>
                <span class="tab-label">Subscriptions</span>
            </a>
            <a href="#" class="tab-item">
                <span class="icon icon-person"></span>
                <span class="tab-label">Contact Info</span>
            </a>
            <a href="#" class="tab-item">
                <span class="icon icon-download"></span>
                <span class="tab-label">Messages</span>
            </a>
        </nav>
        <!-- Page contents -->
        <div class="content">
            <ul class="table-view">
                <li class="table-view-cell"><a href="subscriptions.html" data-transition="fade" class="navigate-right">Subscriptions</a></li>
                <li class="table-view-cell"><a href="#" class="navigate-right">Contact Info</a></li>
                <li class="table-view-cell"><a href="#" class="navigate-right">Messages</a></li>
            </ul>
        </div>
    </body>
</html>

订阅.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="format-detection" content="telephone=no" />

        <!-- Set the viewport settings to prevent scaling -->
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, target-densitydpi=device-dpi" />

        <!-- Makes your prototype chrome-less once bookmarked to your phone's home screen -->
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">

        <title>MyProject: Subscriptions</title>
        <link rel="stylesheet" type="text/css" href="css/index.css" />
        <link rel="stylesheet" href="css/ratchet.css">
        <meta name="msapplication-tap-highlight" content="no" />
        <script src="js/jquery-2.1.1.min.js"></script>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="js/index.js"></script>
        <script src="js/ratchet.js"></script>
        <script type="text/javascript">
            app.initialize();
        </script>
        <style>
            /*Stops the text from being in all caps*/
            body * {
                text-transform: none;    
            }
        </style>
    </head>
    <body>
        <header>
        <!-- Bar items -->
        <header class="bar bar-nav">
            <h1 class="title">MyProject</h1>
        </header>
        <nav class="bar bar-tab">
            <a href="#" class="tab-item">
                <span class="icon icon-home"></span>
                <span class="tab-label">Home</span>
            </a>
            <a href="#" class="tab-item active">
                <span class="icon icon-star"></span>
                <span class="tab-label">Subscriptions</span>
            </a>
            <a href="#" class="tab-item">
                <span class="icon icon-person"></span>
                <span class="tab-label">Contact Info</span>
            </a>
            <a href="#" class="tab-item">
                <span class="icon icon-download"></span>
                <span class="tab-label">Messages</span>
            </a>
        </nav>
        <!-- Page contents -->
        <div class="content">
            <ul class="table-view">
                <li class="table-view-cell">Hello World</li>
            </ul>
        </div>
        </header>
    </body>
</html>
4

1 回答 1

0

我猜 index.html 和 subscriptions.html 是通过文件系统提供的？意味着它符合您的 phonegap/cordova 应用程序？可能是 url 是使用 file:// 协议在已编译的应用程序中加载的，目前 push.js 不支持。

我能够通过应用来自@artemave 的 push.js 代码的修改版本来使其工作

只需用这个版本替换 ratchet.js 的“// Core PUSH 功能”部分：

https://github.com/artemave/ratchet/commit/5ccfdd765ecd15666b83b0b9abc15e4c120b7713

为我解决了 ios 模拟器中的问题。

于 2015-03-03T16:00:28.353 回答