Все технические форумы на одном сайте Удобный поиск информации с популярных форумов в одном месте
Вопрос: Встраивание контента из расширения chrome

Делаю расширение под google chrome.
По нажатию на кнопку расширения встраиваю в содержимое текущей открытой страницы дополнительный код:
chrome.extension.onConnect.addListener(function(port) {
	port.onMessage.addListener(function() {
		if(!document.getElementById("yImgDropBox")) {
			// jquery
			var jqscript = document.createElement("script");
			jqscript.setAttribute("type", "text/javascript");
			jqscript.setAttribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js");
			document.getElementsByTagName("head")[0].appendChild(jqscript);
			// плагин
			var dbscript = document.createElement("script");
			dbscript.setAttribute("type", "text/javascript");
			dbscript.setAttribute("src", chrome.extension.getURL("dropbox.js"));
			document.getElementsByTagName("head")[0].appendChild(dbscript);
			// стиль
			var dbstyle = document.createElement("link");
			dbstyle.setAttribute("type", "text/css");
			dbstyle.setAttribute("rel", "stylesheet");
			dbstyle.setAttribute("href", chrome.extension.getURL("dropbox.css"));
			document.getElementsByTagName("head")[0].appendChild(dbstyle);
			// Объект для работы плагина
			var dbobj = document.createElement("div");
			dbobj.setAttribute("id", "yImgDropBox");
			dbobj.innerHTML = 'click twice';
			document.getElementsByTagName("body")[0].appendChild(dbobj);
		}
		var newEvent = new CustomEvent('yImgDropBoxStart', {'detail': {'yImgToken': '111'}});
		window.dispatchEvent(newEvent);
		});
	});
});


В файле плагина делаю инициализацию

$(window).on('yImgDropBoxStart', function(event) {
	var receivedToken = event.detail.yImgToken ? event.detail.yImgToken : event.originalEvent.detail.yImgToken;
	console.log('plugin inited');
});


Проблема в том, что после первого нажатия на кнопку расширения все, что нужно, корректно встраивается в содержимое открытой страницы. Но сообщение не отрабатывается. Если нажать на кнопку расширения еще раз - плагин получает сообщение и все работает дальше нормально.
Почему обработка сообщения не выполняется сразу после первого нажатия?
Ответ: Давно не возвращался к проблеме, сейчас вот вернулся
Пока разбирался, понял, что видимо подключение как jquery так и собственных js-плагинов требует времени для браузера. Т.е. встраиваются ссылки на них в страницу сразу а еще нужно дождаться полной загрузки js-файла.
В общем пока получилось примерно такое решение проблемы:
chrome.extension.onConnect.addListener(function(port) {
	port.onMessage.addListener(function(message) {
		if(!document.getElementById("yImgDropBox")) {
			// Внедрить jquery
//			if(!window.jQuery) {
				var jqscript = document.createElement("script");
				jqscript.setAttribute("type", "text/javascript");
				jqscript.setAttribute("id", "jqueryminjs");
				jqscript.setAttribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js");
				document.getElementsByTagName("html")[0].appendChild(jqscript);
//			}
			// Только после загрузки jquery
			document.getElementById("jqueryminjs").onload = function() {
				var dbscript = document.createElement("script");
				dbscript.setAttribute("type", "text/javascript");
				dbscript.setAttribute("id", "dropboxplugin");
				dbscript.setAttribute("src", chrome.extension.getURL("dropbox.js"));
				document.getElementsByTagName("html")[0].appendChild(dbscript);
				// Только после загзуки плагина dropbox.js
				document.getElementById("dropboxplugin").onload = function() {
					// стиль
					var dbstyle = document.createElement("link");
					dbstyle.setAttribute("type", "text/css");
					dbstyle.setAttribute("rel", "stylesheet");
					dbstyle.setAttribute("href", chrome.extension.getURL("dropbox.css"));
					document.getElementsByTagName("head")[0].appendChild(dbstyle);
					// Объект для работы плагина
					var dbobj = document.createElement("div");
					dbobj.setAttribute("id", "yImgDropBox");
					dbobj.innerHTML = 'not ready';
					document.getElementsByTagName("body")[0].appendChild(dbobj);
					// Отправить событие для инициализиции плагина
					chrome.storage.sync.get('yImgToken', function(responce) {
						if(responce.yImgToken) {
							var newEvent = new CustomEvent('yImgDropBoxStart', {'detail': {'yImgToken': responce.yImgToken}});
							window.dispatchEvent(newEvent);
						}
					});
				}
			}
		}
	});
});
Вопрос: Расширение под Google Chrome

Подскажите пожалуйста как в расширение под google chrome работает background_page, и когда он запускается, я нашел что запускается только один раз при старте браузера, прописал в манифесте
"background": {
"scripts": ["background.js"]
} только вот скрипт в принципе не запускается, написал для примера самый простой код console.log("1213");
но ничего в консоль не выводится, подскажите пожалуйста, когда страничка должна загружаться
Ответ: Без полного кода сложно предположить что у тебя за расширение и почему оно не работает.

Возможно ты просто смотришь не в ту консоль (у каждой страницы есть своя консоль)

Для того что бы открыть консоль расширения chrome нужно перейти на страницу "chrome://extensions/" в списке расширений найти свое расширение и чуть ниже будет строка «Проверить режимы просмотра: фоновая страница» нажатие на эту ссылку открывает нужную консоль
Вопрос: Новинки внутри браузера Chrome

Какие полезности можно использовать в Chrome, которых нет в обычном JS?
Ответ: _Alex9_,
??? К примеру Chrome ES6-ready. так что можно уже использовать всякую ново-стандартную фигню
Вопрос: Нужна помощь с доработкой скрипта расширения под Chrome

Всем доброго времени суток!
Ребята выручайте, неделю воюю, но опыта 0. Делаю расширение для рабочего сайта. Расширение само по себе блокирует возможность открывать более чем задано количество вкладок в окне браузера.
Реализованный алгоритм, на данный момент, его таков: Есть 1 вкладка с главным сайтом на котором есть 2 кнопки -> при попытке открыть новое окно оно закрывается через N секунд. -> когда новая вкладка закрывается, главная страница автоматически обновляется.
Мне нужно что бы после обновления страницы, нажималась кнопка id=0.
Вот кнопка:
<button class="button" type="button" data-href="https://sportloto.com.ua/#sports" data-index="0" id="0">Ставки на спорт</button>


manifest.json:
{
    "name": "Tab Limit",
    "description": "Limit the number of open, non-pinned browser tabs",
    "version": "0.1.0",
	
    "background": {
        "scripts": ["background.js"]
    },

    "permissions": [
        "tabs"
		
    ],
    "browser_action": {
        "default_icon": {
            "19": "icons/19.png",
            "38": "icons/38.png"
        },
        "default_title": "Tab Limit"
    },
    "icons": {
        "48": "icons/48.png",
        "128": "icons/128.png"
    },
    "manifest_version": 2
}

background.js:
var isEnabled = true;
var maxTabs = 1;
var tabsCount;


function updateBadgeText() {
    var tabsBalance = maxTabs - tabsCount;
    var tabsAllowanceRemaining = (tabsBalance > 0) ? tabsBalance : 0;

    chrome.browserAction.setBadgeText({
        text: "" + tabsAllowanceRemaining
		
    });
	
}

function updateTabsCount() {
	
    chrome.tabs.query({
        windowType: 'normal',
        pinned: false
    }, function (tabs) {
        tabsCount = tabs.length;
        updateBadgeText();
    });
}

function handleTabCreated(tab) {
   if (tabsCount >= maxTabs) {
		setTimeout(function() {
        chrome.tabs.remove(tab.id);
		}, 2000);	
	}
    else {
        updateTabsCount();
    }
}

function handleTabClick() {
	
			setTimeout(function() 	{
				
		}, 5000);
}

function handleTabRemoved(tab) {
    updateTabsCount();
	chrome.tabs.reload(tab.id);
		handleTabClick();
	}

function handleTabUpdated(tab) {
    updateTabsCount();
}


function init() {
    updateTabsCount();
    chrome.tabs.onCreated.addListener(handleTabCreated);
    chrome.tabs.onRemoved.addListener(handleTabRemoved);
    chrome.tabs.onUpdated.addListener(handleTabUpdated);
	}

function teardown() {
    chrome.tabs.onCreated.removeListener(handleTabCreated);
    chrome.tabs.onRemoved.removeListener(handleTabRemoved);
    chrome.tabs.onUpdated.removeListener(handleTabUpdated);
	}

chrome.browserAction.onClicked.addListener(function (tab) {
    if (!isEnabled) {
        init();
        chrome.browserAction.setIcon({ path: "icons/19.png" });
	}
    else {
        teardown();
        chrome.browserAction.setIcon({ path: "icons/19-disabled.png" });
        chrome.browserAction.setBadgeText({ 'text': '' });
  }

    isEnabled = !isEnabled;
});


init();


Соответствено пробовал все что нашел в Google и тут на сайте. Ничего не вышло. В консоли браузера все отлично работает. Подставляю в расширение, ноль.
function handleTabClick() {
	
			setTimeout(function() 	{
				
		}, 5000);
}

В эту же форму вставляю Alert('111'); для проверки, сообщение как положено выводится через 5 секунд. Вставляю
document.getElementById('0').click();

или
document.getElementByClassName('button')[0].click();

Ничего не работает
Ответ: Попытался, по совету реализовать.
//background.js
function handleTabRemoved(tab) {
    updateTabsCount();
	chrome.tabs.reload(tab.id);
	began();
	}
	
function began() {

  chrome.runtime.sendMessage({greeting: 'hello'}, function(response) {
      console.log(response.msg); /*При необходимости получаете ответ*/
    });
}

//content.js
function handleTabClick() {
	
		setTimeout(function() 	{
				document.getElementById('0').click();
		}, 5000);
}

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    if (request.greeting == 'hello'){
    alert('111');
/*Можете отправить ответ, если необходимо*/

      sendResponse({msg: 'Update'});

    }

  });
но не работает... Сообщение не выводится...
Вопрос: Есть расщепление chrome, написанное на AngularJS. Нужно менять иконку на панеле, в

Есть расщепление chrome, написанное на AngularJS. Нужно менять иконку на панеле, в зависимости от данных в переменной item.weather[0].icon, где название иконки содержится в item.weather[0].icon.

chrome.browserAction.setIcon({ path: "icons/13d.png"});


Конструкция типа

chrome.browserAction.setIcon({ path: "icons/{item.weather[0].icon}.png" });


не срабатывает.
chrome.alarms.onAlarm.addListener(function( alarm ) {
  // события по будильнику.
  console.log("Got an alarm!");
   alert('great1');
   chrome.browserAction.setIcon({ path: "icons/13d.png" });
   chrome.alarms.create({'delayInMinutes': 1});
   location.reload();
});

// создаем будильник
chrome.alarms.create({'delayInMinutes': 1});

Также, по хорошему этот background скрипт надо сделать на AngularJS, но там даже вывод не работает:
(function(angular){
      'use strict';
    angular.module('backskrip',[]).controller('BackController',['$scope',function($scope){
    chrome.alarms.onAlarm.addListener(function(alarm) {
      // события по будильнику.
       console.log("Got an alarm!");
       alert('great1');
       chrome.browserAction.setIcon({ path: "icons/{{vm.data.list[0].weather[0].icon}}.png" });
       chrome.alarms.create({'delayInMinutes': 1});
       location.reload();
    });

    // создаем будильник
    chrome.alarms.create({'delayInMinutes': 1});
    }]);
    })(window.angular);
Ответ: triest, значит нет такой переменной или иконки.
Вопрос: chrome.tabs.sendMessage

Подскажите пожалуйста, как мне отправить сообщение из 2го в 1й скрипт?

, но без примера я ничего не понимаю...

Есть 2 скрипта, 1й(background.js) висит в приложении постоянно, 2й(maps.js) подключается только к определённым страницам.

В background.js
chrome.runtime.onMessage.addListener // Отлов сообщений
(
	function(request, sender, sendResponse)
	{
		switch(request.id) // Это типа идентификатор сообщений
		{
			case 2: // GET запрос
			{
				GetHttpRequest(request.href, {rid: request.rid})
				break
			}
		}
	}
)

Это дополнительная информация из background.js
function GetHttpRequest(href, arg) // Запрос
{
	var xhr = new XMLHttpRequest()
	xhr.withCredentials = true
	xhr.onreadystatechange = function(e)
	{
		e.data = arg
		ProcessRequestChange.apply(this, arguments)
	}
	xhr.open('GET', href, true)
	xhr.send(null)
}
function ProcessRequestChange(e) // Обработчик запроса
{
	var xhr = this

	if(xhr.readyState != 4) return
	if(xhr.status == 200)
	{
		var html = xhr.responseText
		
		switch(e.data.rid) // Это типа идентификатор запроса
		{
			case 3: // Покопаться в ответе на 'http://www.site.ru/bla-bla.php'
			{
				// Некий код который записывает необходимую информацию в str убрал для экономии
				var str = 'ответ' // Пусть будет это ответом
				
				chrome.tabs.query // Вроде это какое - то событие открытия(или получения) вкладок?
				(
					{active: true, currentWindow: true}, // Х.з
					function(tabs)
					{
						chrome.tabs.sendMessage // Это то, что отправляет ответное сообщение
						(
							tabs[0].id, // Х.з, наверное идентификатор вкладки, куда отправить?
							{greeting: "hello"}, // Это я так понял и есть ответ?
							function(response) // А это вообще не нужно вроде...
							{
								console.log(response.farewell);
							}
						)
					}
				)
				break
			}
		}
	}
}

В maps.js:
chrome.runtime.sendMessage // Отправить сообщение в background.js
(
	{id: 2, href: 'http://www.site.ru/bla-bla.php', rid: 3}, // Сделать запрос на адрес
	function(response) // Функция ответа не может быть вызвана, т.к. ответ не отправляется из background.js
	{
		document.querySelector('#fades').style.display = 'inline'
		document.querySelector('#guild').style.display = 'inline'
		document.querySelector('#mercenary').innerHTML = 'jhg'
	}
)


Так вот, вся проблема заключается в том, что в background.js сначала нужно послать запрос, получить ответ, покопаться в ответе, и только потом отправить ответ на сообщение в maps.js.
Ответ: Блин, задолбала уже эта ошибка:
Цитата:
Error in event handler for (unknown): TypeError: Cannot read property 'value' of undefined.
Если у chrome.runtime.sendMessage назначена функция(в которую ответ приходит), то она всегда что ли будет вызываться?

Просто я сделал одну фигню всплывающим окном(вставил часть другой страницы), через localStorage убрал лишние запросы на сайт...



Вот это всё равно вызывается:
chrome.runtime.sendMessage
(
	{id: 6, href: 'http://www.site.ru/bla-bla.php', rid: 3},
	function(response)
	{
		alert('ответ')
		document.querySelector('#fades').style.display = 'inline'
		document.querySelector('#guild').style.display = 'inline'
		document.querySelector('#mercenary').innerHTML = response.value
	}
)

А это обработчик(ну или прослушиватель, как его там правильно) этого сообщения.
Тут всё нормально с return'ами break'ами? Просто я не привык к этой дикости в свитче...
chrome.runtime.onMessage.addListener
(
	function(request, sender, sendResponse)
	{
		switch(request.id)
		{
			case 4: // Получить значение localStorage
			{
				var sid = request.sid
				sendResponse({sid: sid, value: localStorage[sid]})
				break
			}
			case 6: // Обработчик 
			{
				var l = localStorage['mercenary_guild']

				if(l != undefined && l > parseInt(+ new Date() / 1000)) break

				alert('запрос')
				GetHttpRequest(request.href, {rid: request.rid, response: sendResponse})
				return true
				break
			}
		}
		return false
	}
)


Когда срабатывает это условие:
if(l != undefined && l > parseInt(+ new Date() / 1000)) break
Появляется ошибка. Я понял, что нет параметра value в ответе(он вообще пустой).

Не понятно какого хрена он вообще приходит, ведь там нет sendResponse()...

Если всё так и должно работать, можно хотя бы как - то проверить, что ответ пустой?
Вопрос: Публикация в Chrome Web Store

Не хотят публиковать скрипт причина ниже. Код вот какие по вашем причины тут?


Уважаемый разработчик,

Ваш браузер Google Chrome пункт "« Лига чести В Окопе »", с ID: libchmijhhaelmljpnahekgmjpchpcfh не соответствует нашей политике и был удален из Google Chrome Web Store.

Мы регулярно проверяем элементы в Chrome Web Store на предмет соответствия правилам нашей программы для обеспечения безопасной и доверительной опыт для наших пользователей. Согласно нашим правилам, где это возможно, сделать как можно больше кода видимой в пакете, как вы можете. Если некоторые из логики вашего приложения скрыт, и это, кажется подозрительным, мы можем удалить его.

В ходе обзора, ваш вопрос был найден, чтобы быть подозрительным и запросил / принес один или несколько внешних скриптов.
Для того, чтобы иметь ваш деталь восстановлен, пожалуйста, внесите необходимые изменения, чтобы избежать запроса или выполнения удаленного кода размещенного (в том числе и с помощью ссылки на удаленный JavaScript файлы или выполнения кода, полученного с помощью запросов XHR).

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

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

*Важная заметка
Неоднократное или грубое нарушение в магазине может привести к ваш аккаунт разработчика запрещен из магазина. Это также может привести к приостановке соответствующих служб Google, связанных с вашим аккаунтом Google. Все вновь представлены детали будут продолжать подвергаться политики и условий предоставления услуг Интернет-магазина Chrome.

Спасибо за ваше сотрудничество,
Команда Google Chrome Web Store
Ответ: Да показывал что там обычный JSON
Вопрос: Chrome и запуск iMacros-скрипта

Подскажите, хочу запустить iMacros-скрипт в Chrome из командной строки.
Для этого создал htm-файл:

Код:
 <html>
     <head>
         <script language="JavaScript">
             function launchMacro()
             {
                 // Body of the original function on the created macro, i. e.,
                 // from "var e_m64..." until "...window.dispatchEvent(evt);"
 
                var e_m64 = "VVJMJTIwR09UTyUzRHVrci5uZXQ=", n64 = "JTIzQ3VycmVudC5paW0=";if(!/^(?:chrome|https?|file)/.test(location)){alert('iMacros: Open webpage to run a macro.');return;}var macro = {};macro.source = decodeURIComponent(atob(e_m64));macro.name = decodeURIComponent(atob(n64));var evt = document.createEvent("CustomEvent");evt.initCustomEvent("iMacrosRunMacro", true, true, macro);window.dispatchEvent(evt);
       
             }// end function macro
         </script>
     </head>
     <body onload="launchMacro()"></body>
<script language="JavaScript"> 

  window.onload = setTimeout("launchMacro()", 100);
 </script> 
</html>
Запускаю
Код:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" www.google.com file:///D:/web/test.htm
И функция launchMacro() не хочет срабатывать. В чем может быть проблема?
Ответ: Проблема решена. Нужно было политику безопасности в хроме настроить
Вопрос: Сменить иконку расширения Google Chrome, добавив значок сети

Здравствуйте, уважаемые программисты!
Прошу вас помочь написать первое расширение для Google Chrome.

Я не владею js и jquery, но хочу знать, какая рекламная сеть присутствует на сайтах, не глядя на рекламу.

У меня Хром под линукс принял мое расширение, но оно не дает эффекта.
Нужно, чтобы в каждой вкладке в адресной строке отображался значок рекламной сети (они нарисованы и сложены в папку adv) - как это делает Wappalyzer, определяя технологии, используемые на сайтах.

Чтобы скрипт работал для каждой вкладки, я написал файл content.js, так как написано что для каждой вкладки запускается он.

var advarr = new Array();

var html = $("html").html(); //get entire html


/* searching adv codes in html */
advarr[0] = html.match(/pagead2\.googlesyndication\.com/g);
advarr[1] = html.match(/an\.yandex\.ru/g);

/* set up icons into address bar */
var i=0; var found = false;
while (i<advarr.length) {
	if (advarr[i] != '') { 
		chrome.pageAction.setIcon({ tabId: tab.id, path: 'images/adv/' + i + '.png' });
		found = true;
	}
	i++;
}
if (found) chrome.pageAction.show(tab.id);


никакого эффекта при посещении сайтов, где есть коды этих сетей.
Что не так?

Функцию установки иконки chrome.pageAction.setIcon() я нашел в расширении wappalyzer/js/driver.js строка 202.
Ответ: в коде вы видите запуск функции добавления значка в цикле.
то есть каждый значок добавляется к другим.
но проблема еще раньше: даже простая строка alert('hey'); в начале кода не срабатывает.
где можно подробно почитать об анатомии расширений для хрома? куда класть код, чтобы он запускался для каждой посещаемой страницы?
Вопрос: Подключение своих js скриптов в Chrome на любых сайтах

Возможно ли прикрепить js скрипт в Chrome, для какого-то сайта, к примеру грузиться YouTube(DOM), а потом загружается мой js код, который прикреплен с помощью Chrome.
Как можно это сделать? С помощью Инструменты разработчика в Chrome, или мб какого-то расширения для Chrome, как Stylebot, только для js
Ответ: Если не хотите особо разбираться и ковыряться, то есть расширение простенькое -