Запретить анализ всего или некоторого содержимого DOM для каждого домена веб-сайта

Я создал небольшой императивный ванильный JavaScript-скрипт для блокировки отвлекающих новостных сайтов, которые я чувствую, как зависимость от:

// ==UserScript==
// @name         blocksite
// @match        *://*.news_site_1.com/*
// @match        *://*.news_site_2.com/*
// ==/UserScript==

function blocksite () {
    document.body.innerHTML =`<div dir="ltr"; style="font-size:100px; font-weight: bold; text-align: center">Blocked !</div>`;
}

setTimeout( blocksite(), 1000)
setTimeout( blocksite(), 5000) // Block possible later DOM mutations;
setTimeout( blocksite(), 10000) // Block possible later DOM mutations;

Сценарий в основном работает (всплывающее окно берет на себя DOM), но моя проблема в том, что он блокирует сайты только после того, как весь их контент DOM был проанализирован и визуализирован, в то время как я заинтересован в блокировании синтаксического анализа в целом.

Слушая load событие слишком поздно, слушайте более раннее DOMContentLoaded событие может иметь лучший результат, чем прослушивание load или слушать setTimeout(), так как блокировка может произойти сразу после анализа содержимого, а не отрисовки.
Тем не менее, мне нужен способ полностью предотвратить синтаксический анализ любой веб-страницы соответствующих веб-сайтов (или, альтернативно, заблокировать любой дальнейший синтаксический анализ после того, как был проанализирован самый первый узел элемента DOM HTML).

Что я пробовал

В комментариях я пробовал в Google Chrome:

window.stop(); Я не помню каких-либо существенных изменений
window.close(); У меня работало только с консоли devtool
window.location.replace("about:blank"); У меня сработало только после load событие завершается вместо этого, когда начинается синтаксический анализ

Мой вопрос

Возможна ли операция, которая мне нужна, с последней версией ECMAScript (10), и если да, то какую команду следует использовать?


Обновление для Sxribe:

Уважаемый Sxribe, я создал следующий файл со следующим кодом.
Файл загружается Tampermonkey (с правильным@match list), но я не заметил изменений в браузере при загрузке совпавших веб-сайтов (эти веб-сайты не блокируются и загружаются нормально).

Код в файле

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>

Вызов файла в Tampermonkey

window.open("C:\Users\MY_USER_NAME\Desktop\blocksite.html");

3 ответа

Решение

Старый, неправильный ответ здесь: https://hastebin.com/vujuduforu.txt

Хорошо, поэтому chrome/firefox не любит, когда локальные файлы открываются с помощью window.close(). В конце концов, я просто разместил сайт на glitch.com (100% бесплатный), а затем перенаправил на него. Вот мой код для всего:

Скрипт Tampermonkey:

// ==UserScript==
// @name         blocktest
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        *://*.bing.com/*
// ==/UserScript==

(function() {
    'use strict';
    window.open("https://block-sxribe.glitch.me/", "_self");
})();

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>This site has been blocked.</title>
    <link rel="stylesheet" href="./index.css">
</head>
<body>
    <div class="flex-container">
        <div class="content">
            <h1>This site has been blocked.</h1>
            <p id="sep"></p>
            <p>This site was blocked with Tampermonkey.</p>
        </div>
    </div>
</body>
</html>

CSS:

@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');

* {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
}

.flex-container {
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

#sep {
    margin-left: 20vw;
    width: 60vw;
    border-bottom: 1px solid lightgray;
}

tl; dr Разместите веб-сайт онлайн, запустите window.open("website location.com", "_self"), чтобы открыть веб-сайт в текущем окне.

Чтобы прервать загрузку веб-сайта, вы можете просто использовать window.stop() метод.

При вызове, когда текущий скрипт завершает работу, анализ веб-сайта полностью останавливается.

Например:

<p>Before scripts</p>
<script>
  document.write('<p>Before stop</p>')
  console.log('Before stop')

  window.stop()

  document.write('<p>After stop</p>')
  console.log('After stop')
</script>
<p>Between scripts</p>
<script>
  console.log('Second script')
  document.write('<p>Second script</p>')
</script>
<p>After scripts</p>

Приведенный выше HTML-код отображает:

Before scripts
Before stop

а в консоли вы можете увидеть следующее:

Before stop
After stop

Это показывает, что <script> вызов .stop() полностью оценивается, но изменения, внесенные в DOM после .stop() не отображаются.

В качестве альтернативы, чтобы стереть полное содержимое DOM, может быть лучше перенаправить браузер, это решение работает даже после загрузки страницы:

window.open('about:blank','_self')

Если вы каким-либо образом контролируете сервер веб-сайта, вы можете проксировать внешние сценарии или даже внутренние сценарии, чтобы, когда вы не хотите, чтобы их анализировали, вы просто добавляли return; вверху каждого прокси-скрипта.

Под проксированием я имею в виду что-то вроде:

  1. У вас есть скрипт http://example.com/script.js
  2. Вы создаете путь в приложении, которое загружает http://example.com/script.js с сервера и возвращает результат.
  3. Если ты не хочешь http://example.com/script.js для анализа, либо вернуть пустой скрипт, либо вернуть содержимое http://example.com/script.js но после добавления return; как начало файла.

Путь к прокси-серверу может быть примерно таким:

const script = encodeUriComponent('http://example.com/script.js')
http://myserver.com/proxy?url=script&allowed=false
Другие вопросы по тегам