Как я могу href локальный файл, используя tampermonkey?

Question

Я хочу заменить URL-адрес CSS-файла сайта через href, я знаю, что можно ссылаться на внешние ссылки, содержащие css, но как насчет локального файла?

document.querySelector("head > link:nth-child(7)").href = "http://example.com/style.css"

Answer 1

Как и все расширения Chrome, Tampermonkey по умолчанию подвергается ряду ограничений, разработанных для предотвращения вредоносных действий разработчиков. Если бы Tampermonkey имел беспрепятственный доступ к вашей файловой системе, авторы пользовательского скрипта могли легко злоупотребить разрешением украсть или изменить ваши данные без вашего ведома.

Самое близкое, что вы могли бы сделать, это разместить сервер на локальном компьютере (например, с Node.js). Это позволит вам предоставить Tampermonkey URL-адрес типа localhost/style.css, который будет обслуживаться локально с вашего компьютера. Это будет работать только тогда, когда у вас работает сервер.

Кроме того, вы можете создать собственное расширение Chrome в режиме разработчика, которое содержит таблицу стилей в пределах web_accessible_resources и внедряет ее на основе правила DeclarativeContent. Тем не менее, это полностью обошло бы Tampermonkey, поэтому не совсем отвечает на вопрос.

Answer 2

Один вариант может быть для локального файла: script , возможно, тот, который назначает желаемый текст CSS для свойства window, которое затем может быть получено из вашего пользовательского скрипта. Например:

// ==UserScript==
// @name         local
// @match        https://example.com
// @require      file:///C:/local.js
// ==/UserScript==

document.head.appendChild(document.createElement('style'))
  .textContent = window.cssTextFromLocal;

и

// local.js
window.cssTextFromLocal = `
  body {
    background-color: green;
  }
`;

Обязательно разрешить локальный доступ к файлам .

Конечно, если вы хотите сделать это безоговорочно (при каждой загрузке страницы, независимо от того), вам не нужно взаимодействие между сценариями, и вы можете вставить <style> в DOM внутри local.js.