Создаем расширения для Google Chrome
Вчера задался себе таким вопросом: как можно обезопасить мой профиль в Google Chrome и вообще все данные, которые в нем хранятся? Немножко погуглив, я нашел ссылки на кучу расширений (типа этого), которые позволяют устанавливать пароль как на браузер так и на отдельные его профиле (это логично, если знать как работает Chrome в режиме мультипрофильности). Я начал их устанавливать и сразу тесты на баги. И как оказалось ни один из них не хочет адекватно работать в режиме мультипрофильности. Не очень-то долго думая я решил написать собственное расширение и заодно разобраться в Google Chrome API.Немного почитав документацию и разобравшись в принципе работы расширений я приступил к работе.
Принцип написания расширений
Некоторые думают, что расширение это нечто заморское, неподвластно простым людям. На самом деле для его написания достаточно просто блокнота, в котором это все писать, и браузера, в котором тестировать написаное.Итак, любое расширение для Chrome состоит из следующих составляющих:
Файл манифеста manifest.json, в котором записывается информация о приложении;
Иные файлы, которые используются в расширении: это могут быть html-странички, скрипты, картинки и т.д.
Для запуска готовой работы нужно всего лишь на стрничке расширений в режиме разработчика загрузить ваше творение.
Итак, приступим к работе!
Пишем файл манифеста
Файл манифеста хранится в корневой папке проекта и, как вы уже поняли, представляет из себя набор данных в формате JSON. Рассмотрим исхоник манифеста, а после этого я опишу каждый пункт подробнее.
А теперь по порядку:
name, description и version — собственно имя расширения, его короткое описание и номер версии;
permissions — массив с дополнительными правами расширения на выполнение тех или иных действий. Подробнее почитать можно здесь. В даном случае расширение может знать об открытых вкладках и окнах браузера;
background_page — главная страника которая запускается при запуске браузера и работает на фоне;
icons — набор иконок разных размеров;
browser_action — описание кнопочки на панели инструментов. default_title — текст при наведении на кнопку, default_icon — иконка на кнопке, popup — html-страничка, которая откроется в попапе после клика;
Кроме этих параметров в файле манифеста может быть и много других.
Фоновая страничка
Фоновая страничка будет проверять установлен ли пароль и запрашивать его при открытии браузера или создании окна с неким профилем. От протестированных мною расширений моё отличается именно тем, что более менее адекватно работает в режиме мультипрофильности.Пароль от нашего профиля будет храниться в localStorage['profile_password']. localStorage — это массив, в котором расширение может хранить свои какие-то данные, не беспокоясь о том, что какое-то другое расширение доступиться к этим данным. Для каждого расширения и профиля это отдельная переменная, поэтому можно устанавливать разные пароли на разные профили.
Установка и изменение пароля
Устанавливать и изменять пароль мы сможем на страничке, которая открывается в попапе popup.html. Изначально пароль не установлен и его можно будет установить. Пожже его можно будет изменить или вовсе удалить. Короче говоря всяческие манипуляции с паролем для входа.Исходник файла запихиваю в спойлер, особо пояснять ничего не буду, по-моему и так всё понятно.
Завершающий этап
В завершение нам нужно упаковать наше творение, это можна сделать на странице расширений нажав на кнопку «Упаковка расширений». Указав папку с нашим расширением на выходе мы получаем два файла: .crx — файл с самим расширением, .rem — файл с секретным ключом. В придачу вы можете поделится своим творением с людьми, залив его на Chrome WebStore, но для этого нужно заплатить гуглу взнос в размере $5 (но это лишь первый раз, при регистрации).
Принцип написания расширений
Некоторые думают, что расширение это нечто заморское, неподвластно простым людям. На самом деле для его написания достаточно просто блокнота, в котором это все писать, и браузера, в котором тестировать написаное.Итак, любое расширение для Chrome состоит из следующих составляющих:
Файл манифеста manifest.json, в котором записывается информация о приложении;
Иные файлы, которые используются в расширении: это могут быть html-странички, скрипты, картинки и т.д.
Для запуска готовой работы нужно всего лишь на стрничке расширений в режиме разработчика загрузить ваше творение.
Итак, приступим к работе!
Пишем файл манифеста
Файл манифеста хранится в корневой папке проекта и, как вы уже поняли, представляет из себя набор данных в формате JSON. Рассмотрим исхоник манифеста, а после этого я опишу каждый пункт подробнее.
{
"name": "Profile Guard",
"description": "Google Chrome profile protection by password",
"version": "0.1",
"permissions": [ "tabs" ],
"background_page": "background.html",
"icons": {
"48":"images/bigicon.jpg"
},
"browser_action": {
"default_title": "Profile Guard",
"default_icon": "images/icon.png",
"popup": "popup.html"
}
}А теперь по порядку:
name, description и version — собственно имя расширения, его короткое описание и номер версии;
permissions — массив с дополнительными правами расширения на выполнение тех или иных действий. Подробнее почитать можно здесь. В даном случае расширение может знать об открытых вкладках и окнах браузера;
background_page — главная страника которая запускается при запуске браузера и работает на фоне;
icons — набор иконок разных размеров;
browser_action — описание кнопочки на панели инструментов. default_title — текст при наведении на кнопку, default_icon — иконка на кнопке, popup — html-страничка, которая откроется в попапе после клика;
Кроме этих параметров в файле манифеста может быть и много других.
Фоновая страничка
Фоновая страничка будет проверять установлен ли пароль и запрашивать его при открытии браузера или создании окна с неким профилем. От протестированных мною расширений моё отличается именно тем, что более менее адекватно работает в режиме мультипрофильности.Пароль от нашего профиля будет храниться в localStorage['profile_password']. localStorage — это массив, в котором расширение может хранить свои какие-то данные, не беспокоясь о том, что какое-то другое расширение доступиться к этим данным. Для каждого расширения и профиля это отдельная переменная, поэтому можно устанавливать разные пароли на разные профили.
<html>
<head>
<title>Profile Guard background page</title>
</head>
<body onload="pass();">
<script type="text/javascript">
function pass(){
chrome.windows.getAll(function(wins){
if(wins.length==1){
if(localStorage["profile_password"]){
var pass = prompt("Please enter password:","");
if(pass!=localStorage["profile_password"]){
alert("Access denied!");
chrome.windows.getCurrent(function (window){chrome.windows.remove(window.id)});
}
}
}
});
}
chrome.windows.onCreated.addListener(function(window){
pass();
});
</script>
</body>
</html>Установка и изменение пароля
Устанавливать и изменять пароль мы сможем на страничке, которая открывается в попапе popup.html. Изначально пароль не установлен и его можно будет установить. Пожже его можно будет изменить или вовсе удалить. Короче говоря всяческие манипуляции с паролем для входа.Исходник файла запихиваю в спойлер, особо пояснять ничего не буду, по-моему и так всё понятно.
Завершающий этап
В завершение нам нужно упаковать наше творение, это можна сделать на странице расширений нажав на кнопку «Упаковка расширений». Указав папку с нашим расширением на выходе мы получаем два файла: .crx — файл с самим расширением, .rem — файл с секретным ключом. В придачу вы можете поделится своим творением с людьми, залив его на Chrome WebStore, но для этого нужно заплатить гуглу взнос в размере $5 (но это лишь первый раз, при регистрации).
Теги:
Похожие новости:
Комментарии:
Нету комментариев для вывода...