Background js что это

ключ background

Используйте ключ background для включения одного или нескольких фоновых сценариев и, возможно, фоновой страницы в ваше расширение.

Фоновые сценарии — это место для размещения кода, который должен поддерживать долгосрочное состояние или выполнять долгосрочные операции, независимо от времени жизни каких-либо конкретных веб-страниц или окон браузера.

Фоновые сценарии загружаются сразу при загрузке расширения и остаются загруженными до тех пор, пока расширение не будет отключено или удалено. Вы можете использовать любой API-интерфейс WebExtension в сценарии, если вы запросили необходимые права (permissions).

Дополнительную информацию можно найти в статье Внутреннее устройство расширения.

Ключ background это объект, у которого есть два следующих необязательных свойства:

Массив строк, каждая из которых представляет собой путь к файлу JavaScript. Путь к этим файлам указывают относительно папки, в которой находится файл manifest.json. Это скрипты, которые будут выполняться в фоновой странице расширения.

У этих скриптов общий глобальный контекст объекта window .

Скрипты загружаются в том порядке, в котором они указаны в массиве.

Если вы указали значения с помощью свойства scripts , будет создана пустая фоновая страница, в которой будут работать все эти скрипты.

Примечание: Если вы хотите добавить скрипт из удалённого расположения с помощью тега (например, ), может также понадобиться изменить значение ключа content_security_policy в файле manifest.json вашего расширения.

Примечание: В Firefox до версии 50, когда открыт отладчик, скрипты не всегда загружаются в том порядке, в котором они расположены в массиве. Чтобы обойти этот баг, можно использовать свойство page (вместо scripts ) и добавить фоновые скрипты с помощью тегов в странице HTML. Этот баг починен в Firefox 50. Начиная с этой версии, скрипты всегда загружаются в том порядке, в котором они следуют в массиве.

Если вам нужно какое-нибудь содержимое HTML-страницы, можно определить свою фоновую страницу с помощью свойства page . Это строка, которая представляет собой путь к файлу документа HTML, заданный относительно расположения файла manifest.json. Этот файл HTML должен находиться внутри вашего расширения.

Если используется это свойство, то уже нельзя добавлять скрипты с помощью свойства scripts . Вместо этого нужно добавлять скрипты в страницу — точно таким же образом, как в обычную веб-страницу.

Ключ background также может содержать следующее необязательное свойство:

Двоичное значение ( Boolean ).

• true определяет, что фоновая страница должна храниться в памяти с момента, когда загрузилось расширение или запустился браузер и до того, как расширение будет удалено или выключено, или браузер будет закрыт (то есть фоновая страница постоянна).
• false определяет, что фоновая страница может быть выгружена из памяти во время бездействия и создана заново, когда будет нужна. Такие фоновые страницы часто называются «Страницами Событий» (Event Pages) — потому, что они загружаются в память только для того, чтобы обрабатывать события, для которых в фоновых скриптах назначены функции-обработчики. Зарегистрированные события остаются когда фоновая страница выгружена из памяти, но остальные значения сбрасываются. Если нужно хранить постоянные данные при использовании страницы событий, используйте storage API (en-US).

Примеры

"background":  "scripts": ["jquery.js", "my-background.js"] > 

Загрузит два фоновых скрипта.

"background":  "page": "my-background.html" > 

Загрузит файл фоновой страницы.

Совместимость с браузерами

BCD tables only load in the browser

Found a content problem with this page?

• Edit the page on GitHub.
• Report the content issue.
• View the source on GitHub.

This page was last modified on 11 дек. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

• Product help
• Report an issue

Our communities

Developers

• Web Technologies
• Learn Web Development
• MDN Plus
• Hacks Blog

• Website Privacy Notice
• Cookies
• Legal
• Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2024 by individual mozilla.org contributors. Content available under a Creative Commons license.

Создаём расширение google chrome для записи экрана и камеры

В данной статье рассмотрим основные моменты при создании расширения google chrome для записи экрана и камеры. Оно может записывать целый экран, отдельное окно или вкладку. В режиме записи экрана можно вставлять окно с фронтальной камерой внутрь страницы на которой активен плагин, либо вне браузера. Также можно включить запись микрофона или звук системы. Ну и дополнительно можно осуществлять запись только с камеры.

В расширении также будет использоваться интернационализация (i18next). Для управления состоянием будет использоваться библиотека onChange. Для перемещения встраиваемой камеры по странице jquery-ui. И для стилизации видеоплеера библиотека plyr-player.

Первым делом нужно настроить главный файл расширения google chrome — manifest.json

"action": < "default_popup": "html/popup.html" >,

default_popup: файл HTML, который будет отображаться в выпадающем меню, когда пользователь нажимает на значок действия. В нашем случае это будет loader, после загрузки которого мы будем вставлять iframe на страницу пользователя.

"background": < "service_worker": "js/background.js", "type": "module" >,

Файл background.js обязателен для всех расширений google chrome. Он может использоваться для выполнения различных задач в фоновом режиме, таких как обновление данных, отправка запросов на сервер, мониторинг веб-страниц и т.д. Это позволяет расширению работать в фоновом режиме, даже если пользователь не активен в браузере. В нашем случаем в нем нет необходимости, поэтому просто создадим его и оставим пустым.

"content_scripts": [ < "matches": [ "https://*/*", "http://*/*" ], "js": [ "js/content-script.js" ] >],

Пожалуй, главный файл нашего расширения — это content-script.js. Он может использоваться для изменения внешнего вида и поведения веб-страницы, добавления или удаления элементов на странице, взаимодействия с содержимым страницы и т.д. matches: URL-адреса веб-страниц, на которых должен быть запущен сценарий.

"web_accessible_resources": [ < "matches": [ "" ], "resources": [ "html/popup.html", "html/iframe.html", "js/renderContent/camera.js", "js/renderContent/iframe.js", "libs/jquery-3.6.0.min.js", "libs/jquery-ui.min.js" ] > ],

Файл «web_accessible_resources» в Google Chrome Extension используется для определения ресурсов, которые могут быть доступны на веб-странице, даже если они находятся за пределами расширения.

"permissions": [ "tabs", "storage", "downloads", "activeTab", "scripting" ]

Ну и «permissions» является важным элементом в разработке расширений Google Chrome, позволяющим расширению запросить необходимые разрешения у пользователя, чтобы выполнить необходимые действия. Без этого файла расширение не сможет получить доступ к некоторым функциям браузера, что может ограничить его функциональность.

setTimeout(() => < chrome.tabs.query(< active: true, currentWindow: true >, function (tabs) < chrome.tabs.sendMessage(tabs[0].id, "open") window.close() >) >, 1500)

Итак в выпадающем окне popup у нас отображается loader, после загрузки которого с помощью таймера передается сообщение в content-script и закрывается наш popup с помощью window.close()

chrome.runtime.onMessage.addListener((msg, _, sendResponse) => < const iframePlugin = document.querySelector("#record_plugin") switch (msg) < case "close": < iframePlugin?.remove() break >case "open": < ;(async () =>< const src = chrome.runtime.getURL("js/renderContent/iframe.js") const contentScript = await import(src) contentScript.renderIframe(iframePlugin) >)() break >

В content-script мы слушаем сообщения, которые нам приходят из popup и из нашего iframe, который мы встраиваем тут же.

Внутри iframe будет происходить основная логика расширения. За доступ к содержимому экрана, звуку системы, микрофону и камере будет отвечать класс Media с помощью методов navigator.mediaDevices.getDisplayMedia и navigator.mediaDevices.getUserMedia.

if (state.mode === "screen") < combine = new MediaStream([ . this.screenStream.getTracks(), . this.voiceStream.getTracks(), ]) >else

Так создается поток медиа данных который включает в себя видео и аудио треки в зависимости от режима (запись экрана или запись с камеры).

let blobData = new Blob(data, < type: "video/mp4" >) // Convert the blob data to a url let url = URL.createObjectURL(blobData) // Assign the url to the output video tag and anchor output.src = url downloadTitle.href = url

Обработка готового потока медиа данных и их помещение внутрь проигрывателя и ссылки (для скачивания видеофайла).

const player = new Plyr("#video", < controls: [ "play-large", "play", "progress", "current-time", "volume", "captions", "settings", "fullscreen", ], >) const newMedia = new Media() const defaultLanguage = lStorage.get("language_plugin") || "en" newMedia.getFlowCamera() const i18nInstance = i18next.createInstance() await i18nInstance.init(< lng: defaultLanguage, debug: false, resources, >)

Итак внутри iframe сперва создаем экземпляр плеера, затем экземпляр Media для работы с потоками видео и аудио, запрашиваем доступ к камере, достаем из localStorage текущий язык и инициализируем тексты.

const initialState = < //активность записи recording: false, language: defaultLanguage, // полный экран для плеера fullscreen: false, // проверка на то, что запись не пустая emptyRecord: true, // режим - screen или camera mode: "screen", UIState: < wiewIframe: "control", switch: < microphone: false, camera: false, cameraLocal: false, audio: false, >, >, >

Создаем стейт iframe, состояние которого будем отслеживать с помощью библиотеки onChange и в следствие этих изменений перерисовывать наш UI.

Также создаем объект со всеми необходимыми элементами, на которые навешиваем обработчики, внутри которых будет меняться наш стейт.

Таким образом, в данной статье мы в общих чертах рассмотрели создание расширения google chrome для записи экрана и камеры. Исходный код — для более детального ознакомления с расширением.

• chrome extension
• google chrome
• javascript
• google apps
• recording

• JavaScript
• Google Chrome
• Google API
• Расширения для браузеров

Передача данных в background.js

Изучаю создание расширений для Google Chrome. Как понял из документации, есть 2 скрипта: background.js, который выполняется в тени, и front.js, который работает с DOM страницы. Мне нужно как-то из front послать в backround событие, чтобы там выполнилась функция и передала ответ обратно. Например, по клику по какому-нибудь тегу запустилась функция в background.js. Как это можно сделать?

• javascript
• google-chrome
• chrome-extension

Отслеживать
2,057 2 2 золотых знака 24 24 серебряных знака 44 44 бронзовых знака
задан 8 июл 2015 в 22:43
Радик Камалов Радик Камалов
968 2 2 золотых знака 24 24 серебряных знака 58 58 бронзовых знаков

1 ответ 1

Сортировка: Сброс на вариант по умолчанию

Чтобы отправить сообщение с front (или как чаще ее называют — content) доступен метод chrome.runtime.sendMessage(message, callback) (документация), где message — непосредственно само сообщение, callback — функция, в которую будет передан ответ от background, если таковой имеется (дополнительные параметры в документации).

Чтобы получить сообщение на background (или event) существует chrome.runtime.onMessage.addListener(callback) (документация), где callback — функция-обработчик сообщения. Она прининимает аргументы message , sender и sendResponse , где message — само сообщение, sender — информация об отправителе сообщения (например информация о вкладке, с которой отправили сообщение) и sendResponse — функция, которую нужно вызвать, если необходимо отправить ответ обратно на front.

Таким образом, чтобы отправить сообщение по клику и получить ответ:

// front.js document.addEventListener('click', function () < chrome.runtime.sendMessage('Hello, background', function (response) < console.log(response); // 'Hi front!' >); >, false); // background.js chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) < console.log(message); // 'Hello background' sendResponse('Hi front!'); >); 

Пространство chrome.runtime используется с Chrome 26+, до этой версии использовалось chrome.extension . (т.е. chrome.extension.sendMessage и chrome.extension.onMessage.addListener ).

Подозрительный файл Background.js

Background.js — это файл, который вызвал некоторое беспокойство у пользователей.

Файл .js — это фрагмент кода JavaScript. Файл с определенным именем «background.js» обычно ассоциируется с расширениями браузера Chrome и является одним из возможных компонентов расширения.

Теоретически любой файл может содержать вредоносный код, и это справедливо и для файла JavaScript. Если у вас есть опасения по поводу легитимности и безопасности файла, с которым вы столкнулись в своей системе, лучше всего использовать выбранный вами сканер вредоносных программ и запустить файл через него.

Сделайте то же самое с файлом «background.js» и проверьте результаты сканирования. Если вы не получили никакого обнаружения, и ваше приложение для защиты от вредоносных программ не обнаруживает ничего потенциально вредоносного внутри файла, вы можете быть спокойны.

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

К Zaib году
August 31, 2022
August 31, 2022

Популярные Посты

Pinaview — полнофункциональное рекламное приложение

8 months назад

Всплывающие окна «Ваш iCloud взломан» и «Ваш iPhone взломан»

5 months назад

Что такое Akira Ransomware?

8 months назад

Остерегайтесь сообщения «Nbp повредит ваш компьютер».

8 days назад

Мошенничество по электронной почте «American Express: обновите.

4 months назад

Обнаружение вредоносных программ Trojan Al11

9 months назад
Ваш комментарий ожидает модерации.
Убедитесь, что вы не робот.
Показать форму комментариев (0)

Оставьте Ответ

Продукты

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

Компания

Программные решения для управления данными, разработанные и разработанные для упрощения работы в Интернете.

Cyclonis Backup Details & Terms

The Free Basic Cyclonis Backup plan gives you 2 GB of cloud storage space with full functionality! No credit card required. Need more storage space? Purchase a larger Cyclonis Backup plan today! To learn more about our policies and pricing, see Terms of Service, Privacy Policy, Discount Terms and Purchase Page. If you wish to uninstall the app, please visit the Uninstallation Instructions page.

Cyclonis Password Manager Details & Terms

FREE Trial: 30-Day One-Time Offer! No credit card required for Free Trial. Full functionality for the length of the Free Trial. (Full functionality after Free Trial requires subscription purchase.) To learn more about our policies and pricing, see EULA, Privacy Policy, Discount Terms and Purchase Page. If you wish to uninstall the app, please visit the Uninstallation Instructions page.

Главная

Products

Support

Компания

Legal (Post Merger)

EnigmaSoft Limited (fka Cyclonis Limited)

Подписывайтесь на нас

© 2017-2023 Cyclonis Ltd. CYCLONIS is a trademark of EnigmaSoft Limited (Cyclonis was merged into EnigmaSoft Limited effective November 25, 2023.) All rights reserved.

Registered Office EnigmaSoft Limited: 1 Castle Street, 3rd Floor, Dublin 2 D02 XD82, Ireland.
EnigmaSoft Limited, Private Company Limited by shares, Company Registration Number 597114.

Windows является товарным знаком Microsoft, зарегистрированным в США и других странах.
Mac, iPhone, iPad и App Store являются товарными знаками Apple Inc., зарегистрированными в США и других странах.
iOS является зарегистрированным товарным знаком Cisco Systems, Inc. и / или ее дочерних компаний в США и некоторых других странах.
Android и Google Play являются товарными знаками Google LLC.

Cyclonis.com uses cookies to provide you with a better browsing experience and analyze how users navigate and utilize the Site. By using this Site or clicking on «OK», you consent to the use of cookies. Learn more.