Question

我正在尝试使用Ratchet创建一个简单的Cordova移动应用程序，我无法让push.js加载任何页面。我的研究唯一提到的是push event only works on mobile devices，但我没有在浏览器中使用它。我已尝试通过XCode和来自CLI的cordova build ios cordova emulate ios进行模拟，但链接无法正常运行。他们眨着眼睛表示我点击了它们但没有采取任何行动。这是我要翻译的两页。

的index.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>

subscriptions.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>

Answer 1

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

我能够通过应用@artemave的push.js代码的修改版本来实现它的工作

只需更换＆＃34; //核心PUSH功能＆＃34;这个版本的ratchet.js部分：

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

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

棘轮push.js未能重定向网页

1 个答案: