Javascript и Chrome расширение

@minedroid · Регистрация: 11.11.2013

Студворк — интернет-сервис помощи студентам

Я от нечего делать решил запилить себе расширение для хрома. Начинаю с простых вещей, чтобы потом разобраться с более сложным. Само расширение создать могу, (я запаковываю туда тупо js с всякими описаниями\etc) но мне хотелось бы сделать так, чтобы был popup с настройками (отключить скрипт\включить скрипт). Я смотрел примеры, но там очень много всего, я не могу разобраться.

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

@BANO · 13.10.2015, 23:15

minedroid, это называется default_popup, почитай, он достаточно прост в реализиции

@minedroid · 14.10.2015, 15:40 **[ТС]**

BANO, да я знаю как реализовать popup, мне главное понять как сделать смену и сохранение настроек для включения и выключения работы скрипта.

Я думаю, нужно куда-то записывать (хотя бы) 0 или 1. А скрипт при запуске это читает (1=вкл\0=выклы, например), но вот куда и как записывать - не знаю.

@BANO · 14.10.2015, 18:05

minedroid, на это есть localStorge

@minedroid · 14.10.2015, 18:48 **[ТС]**

BANO, а подробнее?) Так как мне сделать так, чтобы взять параметр из этого локала? Видел примеры с записью, но не понял как работает само чтение\функция

@BANO · 14.10.2015, 19:07

minedroid, почитайте, поймите
там вообще всё делается на колбеках

@minedroid · 14.10.2015, 19:13 **[ТС]**

BANO, а по ссылке вообще все по-другому написано. Ладно, видно не судьба мне в js пока, надо распахивать и распахивать его. Я просто не могу понять, как это вообще работает.
Ну записал я это значение куда-то, а что дальше? Что-то нужно добавить в рабочий код или какой-то параметр отвечает за это - я не знаю.
Объясните принцип?)

@BANO · 14.10.2015, 19:16

minedroid, чтение работает вообще просто

вы покажите как вы сделали запись?

@minedroid · 14.10.2015, 20:54 **[ТС]**

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

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

Добавлено через 1 час 2 минуты
BANO, нет, ничего я не понял. Пытался повесить на батон - не работает.

Будь другом - напиши мне коды батонов, 1-запишет в локал нужное значение, 2 - Запишет значение из локал в спан.
<button onclick="записать в TestValue значение tseT">write test</button>
<button onclick="отобразить в span значение TestValue">show test</button>
<span id="writehere">empty</span>

Обниму и расцелую.

Добавлено через 33 минуты
Нашел интересный пример на гитхабе (какой раз выручает): GitHub - запись\чтение локал

Ничего лишнего, просто вводим текст - получаем его обратно. То, что мне было нужно.

@BANO · 14.10.2015, 20:57

minedroid,

HTML5
1
2
3
<button onclick="set()">write test</button>
<button onclick="get()">show test</button>
<span id="writehere">empty</span>

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
function set(){
    chrome.storage.local.set({TestValue:"tesT"},function(){alert("Значение поставлено")})
}
 
function get(){
    chrome.storage.local(/* а тут начинается прикольная вещь, я могу либо указать строку "TestValue", 
                 либо массив с этой строкой, либо объект*/
         "TestValue",
        function(data){
             writehere.innerHTML=data.TestValue;
             alert("Значение взято")
        })
}

Добавлено через 1 минуту
вот и сам разобрался, только ты должен знать разницу между sync и local

@minedroid · 14.10.2015, 21:16 **[ТС]**

BANO, кстати не работает Ваш код. Ну или я опять накосячил. В консоли пишет что-то про безопасность. Краем глаза читал, что там нельзя исполнять какие-то скрипты в хтмл, но не понял какие.
Скрин:

Пробовал и <script>код<script> и <script src="popup.js"></script>

Наверно здесь еще не хватает манифеста докучи:

Кликните здесь для просмотра всего текста

{
"background_page" : "bck.html",
"content_scripts" : [
{
"js":[ "json.js" ],
"matches":[ "http:/*/*" ],
"run_at":"document_end"
}
],
"background": {
"scripts": ["pp.js"],
"persistent": false
},
"browser_action": {
"default_title": "bbb",
"default_popup": "pp.html"
},
"description" : "abc",
"manifest_version": 2,
"name" : "TestApp",
"permissions" : [ "http://*/*", "unlimitedStorage", "storage"],
"version" : "1.1.1"

}

Скрипты все писал в pp.html , background (bck.html) не трогал вообще.

@BANO · 14.10.2015, 21:27

minedroid, блин, он же не eval-ит
это я накосячил

Сообщение от minedroid

Скрипты все писал в pp.html

у него в настройках стоит, что он не будет выполнять то, что стоит в html, я имею в виду js скрипты, поэтому все скрипты в расширениях выносят в отдельные файлы

Добавлено через 2 минуты
короче

popup.html

HTML5
1
2
3
4
<button id="setb">write test</button>
<button id="getb">show test</button>
<span id="writehere">empty</span>
<script src="popup.js"></script>

popup.js

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
function set(){
    chrome.storage.local.set({TestValue:"tesT"},function(){alert("Значение поставлено")})
}
 
function get(){
    chrome.storage.local(/* а тут начинается прикольная вещь, я могу либо указать строку "TestValue", 
                 либо массив с этой строкой, либо объект*/
         "TestValue",
        function(data){
             writehere.innerHTML=data.TestValue;
             alert("Значение взято")
        })
}
setb.onclick=set;
getb.onclick=get;

@minedroid · 14.10.2015, 21:38 **[ТС]**

BANO, BANO, и снова ошибка С:
Оставил мне для проверки или сам ошибся?)

Сообщение от BANO

function get(){
* * chrome.storage.local(/* а тут начинается прикольная вещь, я могу либо указать строку "TestValue",
* * * * * * * * *либо массив с этой строкой, либо объект*/
* * * * *"TestValue",
* * * * function(data){
* * * * * * *writehere.innerHTML=data.TestValue;
* * * * * * *alert("Значение взято")
* * * * })
}

chrome.storage.local что за функция такая

? chrome.storage.local.get
И.. Кажется хром ругался на комментарий, но я уже не уверен, там просто на одной строке все было. Но без комментария ошибка другая стала.

Короче все работает теперь, а это главное. В очередной раз спасибо тебе, BANO.
Спасибо за наводки по линкам и за то, что возился со мной снова С: . Хороший ты человек. Да и программист явно не плохой.

@BANO · 14.10.2015, 21:41

Сообщение от minedroid

сам ошибся?)

сам ошибся, забыл про неё

Добавлено через 47 секунд
комент многострочный, на него ничто не может ругаться

@minedroid · 15.10.2015, 16:53 **[ТС]**

Up, снова не получается)

В итоге есть код:
pp.js

Кликните здесь для просмотра всего текста

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
function off(){
    chrome.storage.local.set({Enbld:"off"})
}
 
 function on(){
    chrome.storage.local.set({Enbld:"on"})
}
 
function get(){
    chrome.storage.local.get("Enbld",function(data){writehere.innerHTML=data.Enbld;})
}
offm.onclick=off;
onm.onclick=on;
getm.onclick=get;

И pp.html

Кликните здесь для просмотра всего текста

HTML5
1
2
3
4
5
<button id="onm">On</button>
<button id="offm">Off</button>
<button id="getm">Get</button>
<span id="writehere">empty</span>
<script src="pp.js"></script>

json.js (из прошлого топика)

Кликните здесь для просмотра всего текста

JavaScript
1
2
3
4
if (chrome.storage.local.get("Enbld")==on) {
;[].forEach.call(document.getElementsByClassName("test"),function(e){e.innerHTML=e.innerHTML.match(/^([1-9aа]|10)$/)?e.innerHTML:"empty";})
}
else{}

И скрипт при любом раскладе не работает.
Даже если ставить код в else - не работает. Видимо проблема опять с защитой хрома, выручай

@BANO · 15.10.2015, 22:51

minedroid, что именно не работает?
локалстордж или вывод?

@minedroid · 16.10.2015, 22:17 **[ТС]**

BANO, все уже, пофиксил. Все с апи хрома перевел на localstorage[]\etc. Просто я с кастомного скрипта проверял значение вкл\выкл, запускал скрипт если вкл. А из кастомного скрипта доступа в хром апи нет. А для обычного стоража есть решение. Вот так.

В итоге: скрипт, который убирает ненужное, 3 кнопки и поле - вкл, выкл, состояние, состояние.

Добавлено через 21 час 23 минуты
Снова нужна помощь XD

Все тот же многострадальный код:

JavaScript
1
;[].forEach.call(document.getElementsByClassName("test"),function(e){e.innerHTML=e.innerHTML.match(/^([1-10aа]|10)$/)?e.innerHTML:"empty";})

Как мне обозначить '1-10aа' за переменную?

Добавлено через 1 час 39 минут
Я опять разобрался. Самому смешно, как все было просто:

JavaScript
1
2
var num=/^([1-10aа]|10)$/;
;[].forEach.call(document.getElementsByClassName("test"),function(e){e.innerHTML=e.innerHTML.match(/^([1-10aа]|10)$/)?e.innerHTML:"empty";})

Новые блоги и статьи Все статьи Все блоги /
Midnight Chicago Blues kumehtar 24.03.2026 Такой Midnight Chicago Blues, знаешь?. . Когда вечерние улицы становятся ночными, а ты не можешь уснуть. Ты идёшь в любимый старый бар, и бармен наливает тебе виски. Ты смотришь на пролетающие. . .	Контроль уникальности заводского номера - вариант №2 Maks 24.03.2026 В отличие от предыдущего варианта добавлено прерывание циклов, также добавлены новые переменные для сохранения контекста ошибки перед прерыванием цикла: Процедура ПередЗаписью(Отказ, РежимЗаписи,. . .	SDL3 для Desktop (MinGW): Вывод текста со шрифтом TTF с помощью библиотеки SDL3_ttf на Си и C++ 8Observer8 24.03.2026 Содержание блога Финальные проекты на Си и на C++: finish-text-sdl3-c. zip finish-text-sdl3-cpp. zip	Жизнь в неопределённости kumehtar 23.03.2026 Жизнь — это постоянное существование в неопределённости. Например, даже если у тебя есть список дел, невозможно дойти до точки, где всё окончательно завершено и больше ничего не осталось. В принципе,. . .
Модель здравоСохранения: работники работают быстрее после её введения. anaschu 23.03.2026 geJalZw1fLo Корпорация до введения программа здравоохранения имела много невыполненных работниками заданий, после введения программы количество заданий выросло. Но на выплатах по больничным это. . .	Контроль уникальности заводского номера - вариант №1 Maks 23.03.2026 Алгоритм контроля уникальности заводского (или серийного) номера на примере документа выдачи шин для спецтехники с табличной частью. Данные берутся из регистра сведений, по которому настроено. . .	Хочу заставить корпорации вкладываться в здоровье сотрудников: делаю мат модель здравосохранения anaschu 22.03.2026 e7EYtONaj8Y Z4Tv2zpXVVo https:/ / github. com/ shumilovas/ med2. git	Программный отбор элементов справочника по группе Maks 22.03.2026 Установка программного отбора элементов справочника "Номенклатура" из модуля формы документа. В качестве фильтра для отбора справочника служит группа номенклатуры. Отбор по наименованию группы. . .

@minedroid -1 / 0 / 0 Регистрация: 11.11.2013 Сообщений: 75

	Javascript и Chrome расширение 13.10.2015, 23:06. Показов 2200. Ответов 16 Метки нет (Все метки) Я от нечего делать решил запилить себе расширение для хрома. Начинаю с простых вещей, чтобы потом разобраться с более сложным. Само расширение создать могу, (я запаковываю туда тупо js с всякими описаниями\etc) но мне хотелось бы сделать так, чтобы был popup с настройками (отключить скрипт\включить скрипт). Я смотрел примеры, но там очень много всего, я не могу разобраться. Итог: мне нужно разобраться как сделать так, чтобы мое расширение имело popup с настройками, в которых можно отключить\включить выполнение скрипта. 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	13.10.2015, 23:15
	minedroid, это называется default_popup, почитай, он достаточно прост в реализиции 1

@minedroid -1 / 0 / 0 Регистрация: 11.11.2013 Сообщений: 75
	14.10.2015, 15:40 [ТС]
	BANO, да я знаю как реализовать popup, мне главное понять как сделать смену и сохранение настроек для включения и выключения работы скрипта. Я думаю, нужно куда-то записывать (хотя бы) 0 или 1. А скрипт при запуске это читает (1=вкл\0=выклы, например), но вот куда и как записывать - не знаю. 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	14.10.2015, 18:05
	minedroid, на это есть localStorge 1

@minedroid -1 / 0 / 0 Регистрация: 11.11.2013 Сообщений: 75
	14.10.2015, 18:48 [ТС]
	BANO, а подробнее?) Так как мне сделать так, чтобы взять параметр из этого локала? Видел примеры с записью, но не понял как работает само чтение\функция 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	14.10.2015, 19:07
	minedroid, почитайте, поймите там вообще всё делается на колбеках 1

@minedroid -1 / 0 / 0 Регистрация: 11.11.2013 Сообщений: 75
	14.10.2015, 19:13 [ТС]
	BANO, а по ссылке вообще все по-другому написано. Ладно, видно не судьба мне в js пока, надо распахивать и распахивать его. Я просто не могу понять, как это вообще работает. Ну записал я это значение куда-то, а что дальше? Что-то нужно добавить в рабочий код или какой-то параметр отвечает за это - я не знаю. Объясните принцип?) 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	14.10.2015, 19:16
	minedroid, чтение работает вообще просто вы покажите как вы сделали запись? 1

@minedroid -1 / 0 / 0 Регистрация: 11.11.2013 Сообщений: 75
	14.10.2015, 20:54 [ТС]
	BANO, извиняюсь, пока ничего не сделал, пытаюсь понять, а потом уже написать из понятого и тестировать. Ладно, я кажется понял немного, плохо гуглдев прочитал, попробую, отпишусь чуть позже, сейчас занят немного. Добавлено через 1 час 2 минуты BANO, нет, ничего я не понял. Пытался повесить на батон - не работает. Будь другом - напиши мне коды батонов, 1-запишет в локал нужное значение, 2 - Запишет значение из локал в спан. <button onclick="записать в TestValue значение tseT">write test</button> <button onclick="отобразить в span значение TestValue">show test</button> <span id="writehere">empty</span> Обниму и расцелую. Добавлено через 33 минуты Нашел интересный пример на гитхабе (какой раз выручает): GitHub - запись\чтение локал Ничего лишнего, просто вводим текст - получаем его обратно. То, что мне было нужно. 0

@minedroid -1 / 0 / 0 Регистрация: 11.11.2013 Сообщений: 75
	14.10.2015, 21:16 [ТС]
	BANO, кстати не работает Ваш код. Ну или я опять накосячил. В консоли пишет что-то про безопасность. Краем глаза читал, что там нельзя исполнять какие-то скрипты в хтмл, но не понял какие. Скрин: Пробовал и <script>код<script> и <script src="popup.js"></script> Наверно здесь еще не хватает манифеста докучи: Кликните здесь для просмотра всего текста { "background_page" : "bck.html", "content_scripts" : [ { "js":[ "json.js" ], "matches":[ "http://" ], "run_at":"document_end" } ], "background": { "scripts": ["pp.js"], "persistent": false }, "browser_action": { "default_title": "bbb", "default_popup": "pp.html" }, "description" : "abc", "manifest_version": 2, "name" : "TestApp", "permissions" : [ "http:///", "unlimitedStorage", "storage"], "version" : "1.1.1" } Скрипты все писал в pp.html , background (bck.html) не трогал вообще. 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	15.10.2015, 22:51
	minedroid, что именно не работает? локалстордж или вывод? 0

Javascript и Chrome расширение

Решение