如何在 tampermonkey 中捕获状态 503

How to catch status 503 in tampermonkey

我有一个每秒刷新一次页面的用户脚本,但有时它尝试刷新的网站会遇到状态 503 错误,这会导致脚本从 运行 停止。这意味着脚本将不再尝试每秒刷新页面。如何在页面运行状态 503 错误后保留脚本 运行?错误在控制台中看起来像这样:

加载资源失败:服务器返回状态 503(服务不可用)

// ==UserScript==
// @name        script
// @namespace   name
// @description example
// @match       *^https://example.com/$*
// @version     1
// @require     https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
// @grant       GM_xmlhttpRequest
// @run-at document-end
// ==/UserScript==

//*****************************************START OF SET_TIMEOUT
var timeOne = 1000;
var theTime = timeOne;

var timeout = setTimeout("location.reload(true);", theTime);
function resetTimeout() {
clearTimeout(timeout);
timeout = setTimeout("location.reload(true);", theTime);
} //end of function resetTimeout()
//*****************************************END OF SET_TIMEOUT

我能想到的简单解决方案是将需要每秒刷新的实际网页移动到另一个框架或某个 HTML 容器,并使用您的用户脚本,您可以使用 HTML要刷新的页面。

除非您发出 http 请求以从您的脚本加载网页,否则可能无法处理 http 错误(我可能错了!)。您的用户脚本应该处于超集级别,即使在任何 503 或任何类似的 HTTP 错误之后它也将具有控制权或范围。

您可以使用页面状态更改事件来确保或检查在 frame/container 是否已加载时刷新页面,以避免在加载之前重新加载网页。除非无论网页加载成功与否,你都想重新加载。

希望这对您有所帮助..

页面加载时的用户脚本 运行,如果页面根本没有加载 200 以外的任何状态代码,它们将不会 运行。您可以使用 <iframe>正如@Hemanth 建议的那样,但您必须打破无限循环,因为 <iframe> 还将加载用户脚本等。要打破它,只需检查用户脚本是否加载到顶部 window.

if (window == window.top) {
    // Remove everything from the page
    // Add an iframe with current page URL as it's source
    // Add an event to reload the iframe few seconds after it is loaded
}

完整代码:

(function ($) {
  'use strict';
  var interval = 5000;
  if (window == window.top) {
    var body = $('body').empty();
    var myframe = $('<iframe>')
      .attr({ src: location.href })
      .css({ height: '95vh', width: '100%' })
      .appendTo(body)
      .on('load', function () {
        setTimeout(function () {
          myframe.attr({ src: location.href });
        }, interval);
      });
  }
})(jQuery);

问题是 location.reload 试图用重新加载的版本完全替换页面,但是如果浏览器无法连接到服务器,则不会加载该页面,并且该页面的任何用户脚本都会运行 失败,因为没有页面供他们 运行 使用。

解决方法是使用 Javascript 网络请求获取新页面的文本,然后用 Javascript 的新内容替换现有内容 - 如果响应是503 错误(或其他错误),您可以简单地忽略它并重试。这确保您将始终停留在同一(已加载)页面上,因此用户脚本将无限期地继续 运行ning,即使响应有时会失败。

这是一个用户脚本示例,它每 10 秒使用新的 HTML 更新 Whosebug 的主页。您可以使用 DOMParser 将响应文本转换为可以使用 querySelector 导航的文档,其中包括:

// ==UserScript==
// @name         Update SO
// @namespace    CertainPerformance
// @version      1
// @match        https://whosebug.com/
// @grant        none
// ==/UserScript==

const container = document.querySelector('.container');
function getNewData() {
  console.log('getting new data');
  fetch('https://whosebug.com',
    {
      // The following is needed to include your existing cookies with the request, which may be needed:
      credentials: "same-origin"
    })
    .then((resp) => {
      // If there are errors, such as a 503 error, proceed directly to the `finally` to try again:
      if (!resp.ok) return;
      return resp.text();
    })
    .then((text) => {
      const doc = new DOMParser().parseFromString(text, 'text/html');
      container.innerHTML = doc.querySelector('.container').innerHTML;
    })
    .finally(() => {
      // Whether there was an error or not, try to refresh again in a few seconds:
      setTimeout(getNewData, 10000);
    });
}

setTimeout(getNewData, 10000);