добавление пользовательских функций в консоль Chrome

Question

Возможно ли иметь в google-chrome пользовательские функции, которые всегда будут доступны в консоли (независимо от того, какая страница загружена)?Например, я хотел бы иметь функцию с именем echo, которая была бы просто оболочкой для console.log.Это немного экономит время при наборе текста, но позже я могу захотеть создать некоторые полезные функции отладки.

Answer 1

Ну, это довольно легко сделать. Что вам нужно, это создать скрипт контента . Этот скрипт будет внедрен на любой странице и создаст некоторые необходимые глобальные функции, которые вы будете использовать в своей консоли. Самым сложным является то, как сделать эти пользовательские функции scrtipt контента частью вашего фактического window объекта, потому что обычно вы не можете получить доступ к функциям или переменным, которые вы определяете в вашем скрипте контента, из остальной части кода javascript, который не является в контентном скрипте. Сценарии содержимого выполняются в так называемой изолированной среде.

Сценарии содержимого выполняются в специальной среде, называемой изолированным миром. Они имеют доступ к DOM страницы, в которую они внедрены, но не к каким-либо переменным или функциям JavaScript, созданным этой страницей. Каждый скрипт содержимого выглядит так, как будто на странице, на которой он запущен, нет другого JavaScript-кода. То же самое верно и в обратном: JavaScript, работающий на странице, не может вызывать какие-либо функции или обращаться к любым переменным, определенным скриптами содержимого.

Но есть причудливый обходной путь.
Вы определяете свой файл манифеста следующим образом:

manifest.json

{
    "name": "Content script",
    "version": "0.1",
    "manifest_version": 2,
    "content_scripts": [{
        "matches": ["http://*/*"],
        "js": ["console.js"]
    }]
}

А ваш контент-скрипт:

console.js

function customConsole() {
    window.myNewFunction = function() {
        console.log("Hello I'm available from console.");
    };
}

var script = document.createElement('script'),
    code   = document.createTextNode('(' + customConsole + ')();');
script.appendChild(code);
(document.body || document.head || document.documentElement).appendChild(script);

Таким образом, вы указываете свои новые функции как глобальные функции, чтобы вы могли использовать их в console.
Также взгляните на этот пост