Question

以下代码适用于ripple和使用fiddler我已经测试了服务器服务，它正在按预期工作。但是，当我在实际设备上加载代码时，它会锁定。

任何帮助将不胜感激：

<div data-role="view" data-title="Home" data-layout="main" data-model="APP.models.home">
<h1 data-bind="html: title"></h1>
<p>Hello, your application is ready!</p>
<div id="btn_checkin" data-role="button" data-icon="action" class="km-large" style="width:90%;align-self:center;">Talk to server</div>
<div class="row">
    <div class="col s12 m6">
        <div class="card darken-1">
            <div class="card-content black-text">
                <span class="card-title black-text"></span>
                <p id="regId"></p>
            </div>
        </div>
    </div>
</div>

<div id="cards"></div><script>
    $(function () {
        var helloworld = {"hello":"hello"};

        var stringy = JSON.stringify(helloworld);
        function onClick(e) {
            e.preventDefault();
            $.ajax({
                type: "POST",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                url: conn + "/CheckIn/Hello",
                data: stringy,
                success: function (data) {
                    var cards = document.getElementById("cards");
                    var push = '<div class="row">' +
                          '<div class="col s12 m6">' +
                          '  <div class="card darken-1">' +
                          '    <div class="card-content black-text">' +
                          '      <span class="card-title black-text">Hello</span>' +
                           '      <p>In Notification</p>' +
                          '      <p>' + data.world + '</p>' +
                          '    </div>' +
                          '  </div>' +
                          ' </div>' +
                          '</div>';
                    cards.innerHTML += push;

                },
                error: function (error) {
                    jsonValue = jQuery.parseJSON(error.responseText);
                    console.log(jsonValue);
                    var cards = document.getElementById("cards");
                    var push = '<div class="row">' +
                          '<div class="col s12 m6">' +
                          '  <div class="card darken-1">' +
                          '    <div class="card-content black-text">' +
                          '      <span class="card-title black-text">Hello</span>' +
                           '      <p>In Notification</p>' +
                          '      <p>' + jsonValue + '</p>' +
                          '    </div>' +
                          '  </div>' +
                          ' </div>' +
                          '</div>';
                    cards.innerHTML += push;
                }
            });
        };

        $('#btn_checkin').kendoMobileButton({ click: onClick });
    });
</script></div>

再次感谢。

此外，已确认的设备与服务器位于同一网络上。

Answer 1

@shammon它是一个混合应用程序但我目前正在测试Android版本。很好的捕获错误功能，这是一个漫长的一天结束。我更正并更新了代码。

 error: function (jqXHR, textStatus, errorThrown) {
            cards.innerHTML = '<p>status code: ' + jqXHR.status + '</p><p>errorThrown: ' + errorThrown + '</p><p>jqXHR.responseText:</p><div>' + jqXHR.responseText + '</div>';
        }

结果测试证实了@jcesarmobile建议的内容，这是一个CSP问题。

我最终使用我的CSP执行以下操作：

<meta http-equiv="Content-Security-Policy" 
      content="default-src 'self' 'unsafe-inline'  http://example.com data: gap: https://ssl.gstatic.com 'unsafe-eval'; 
      style-src 'self' 'unsafe-inline'; 
      media-src *">

这是对默认政策的略微修改。

我最初尝试使用connect-src而不是将'example.com'绑定到default-src但是当应用程序加载它时，它“挂起”在奇怪的“加载微调器”上（它看起来像一个白色的暂停按钮一个小的蓝色圆圈背景和暂停按钮的垂直条，交替生长/收缩）。所以，如果有人知道那是什么，请告诉我。我认为是应用程序尝试与服务器通信，但我不确定。

对于偶然发现此事的其他人，请看一下： HTML5Rocks 和 Generate your own CSP

phonegap ajax发布到服务器

1 个答案: