2

我正在页面上编写一个脚本，检查页面的特定部分是否应该更新（基于从 Django 视图传入的页面中的信息）。更新适用于计算机/笔记本电脑上的浏览器，但在 iPad 上的浏览​​器上失败（根据我的阅读，我希望是 iPhone）。它甚至可以在我的 Pixel 手机上使用。所以，看起来这是一个仅限于 iPad（和手机？）的问题。

目前，我正在 Django 的开发服务器上运行，如果这对问题有任何影响的话。从我在腻子终端上看到的内容来看，iPad 正在发出请求（每 2 秒有一次 GET），但我不知道 iPad 上发生了什么，没有任何更新。Safari 和 Chrome 都表现出相同的问题行为。上次我查看这个问题（代码略有不同）时，这不是 Macbook 的问题，只是 iPad 的问题。

- -编辑 - -

我现在在生产服务器上运行。仍然有同样的问题。查看访问日志，我可以看到来自 iPad 的请求，只是显示的页面没有变化。

这是有问题的代码：

HTML

{% block page_updates %}
<div class="container-fluid" id="last_times">
    <p style="display:none">Last action taken: <span id="actionTime">{{ update_times.action.isoformat }}</span></p>
    <p style="display:none">Last chat made: <span id="chatTime">{{ update_times.chat.isoformat }}</span></p>
</div>
<p style="display:none">Page last updated: <span id="updateTime"></span>
{% endblock %}

Javascript

<script>
function refresh_action_log(){
    var url_actions = document.URL + ' #action_log';
    var url_destiny = document.URL + ' #destiny_box';
    $('#action_log').load(url_actions);
    $('#destiny_box').load(url_destiny);
}
function refresh_chat_log() {
    var url_chat_log = document.URL + ' #chat_log';
    $('#chat_log').load(url_chat_log);
}
function check_and_update() {
    var pageUpdate = new Date(document.getElementById('updateTime').innerHTML);
    var actionUpdate = new Date($("#actionTime").text());
    var chatUpdate = new Date($("#chatTime").text());
    var now = new Date();
    if (actionUpdate > pageUpdate && chatUpdate > pageUpdate) {
        refresh_action_log();
        refresh_chat_log();
        // changing all of the .toLocaleString() to .toISOString() was the solution
        document.getElementById('updateTime').innerHTML = now.toLocaleString();  
    } else if (actionUpdate > pageUpdate) {
        refresh_action_log();
        document.getElementById('updateTime').innerHTML = now.toLocaleString();
    } else if (chatUpdate > pageUpdate) {
        refresh_chat_log();
        document.getElementById('updateTime').innerHTML = now.toLocaleString();
    };
}
function update_times() {
    var url_last_times = document.URL + ' #last_times';
    $('#last_times').load(url_last_times, function () {
        // When it loads, schedule the next request for 2s later
        setTimeout(update_times, 2000)
    });
    check_and_update();
};
$(function () {
    update_times();
    var dt = new Date();  // This line and the next were sitting in another function
    document.getElementById('updateTime').innerHTML = dt.toLocaleString();
})
</script>

基于其他一些堆栈溢出问题，我有预感问题是在 iPad 中缓存。

问题：

  1. 这是缓存问题吗？
  2. 如果是这样，我如何告诉 iPad 来处理它？
  3. 如果没有，我还应该看什么？

编辑：

最终解决方案：iPad 读取时间不正确。我会发布一个详细的答案。

4

2 回答 2

0

好吧，蝙蝠侠，给我一个谜语：为什么 iPad 处理日期字符串的方式与其他处理方式不同？在质疑一切（包括我的理智）之后，问题是，在 iPad 上，我用来确定是否应该重新加载这些部分的日期是无效的日期类型，而它们在其他所有方面都工作得很好。

所以，回答我的问题：

  1. 不
  2. 不适用
  3. 时间格式化。

解决方案是将所有 .toLocaleString() 转换为 .toISOString()。由于我不知道的原因，iPad 无法重新读取 updateTime，将其解析为 Date 对象并将其与代码使用 .toLocaleString() 的其他时间进行比较（即使所有其他设备都可以。）

因此，重申一下，iPad 无法解析来自已放入 .toLocaleString() 的 Date 对象的文本，但如果文本是 ISOString 格式，则可以。

于 2019-03-14T20:10:20.763 回答
0

在这里你可以有一个竞争条件：如果 JavaScript 代码在页面完全呈现之前执行，对 update_times() 的第一次调用可能会错过 $('#last_times')，并且 setTimeout() 永远不会被触发。

我建议推迟通话如下：

$(document).ready(function() {
    update_times();
});

这确保了 update_times() 在页面 DOM 准备好执行 JavaScript 代码后运行。

正如 Jane 在之前的评论中所建议的那样，也许尝试用 ajax() 替换 load() 来让 iPad 开心；所以使用：

$.ajax( {
    url: url_actions,
    success: function(data) {
        $('#action_log').html(data);
    }
});

代替：

$('#action_log').load(url_actions)
于 2019-03-12T05:46:59.883 回答