본문 바로가기

카테고리 없음

광고차단 크롬 플러그인 만들기

728x90
반응형

광고차단 크롬 플러그인을 만들어보자.

일단 크롬 플러그인은 언어가 javscript 로 되어있다.

크롬 플러그인을 만들려면 기본적으로 manifest.json 파일을 만들어야 한다.

{
// Required
"manifest_version": 2,
"name": "Adv block",
"version": "1",
// Recommended
"description": "A plain text description",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"activeTab",
"webRequest",
"webRequestBlocking",
"storage",
"https://*/*",
"http://*/*"
],
"content_scripts": [
{
"matches": ["http://*/*","https://*/*"],
"js": ["jquery-1.11.0.min.js","content_script.js"]
}
],
"web_accessible_resources": [
"data.json"
],
"background": {
"scripts": ["background.js"],
"persistent": true
}
}

플러그인에서 정의된 js가 2가지가 있는데, 하나는 background.js , 그리고 하나는 content_script.js 이다.

background.js 는 백그라운드로 처리되는 것들을 처리할 때 사용되고, content_script.js 는 현재 보고 있는 html 을 수정하려고 할 때 사용된다. (밑줄을 친다든지..등등).

popup.html 은 플러그인 아이콘이 생겼을때 해당 아이콘을 눌렀을 때 나타나는 팝업이다.

permission 의 webRequest, webRequestBlocking 퍼미션을 이용하여 광고 차단을 하는 것이고, 위처럼 작성하면 background 로 webReqeust Callback 이 올 때 미리 작성된 url 과 비교하여 해당 url 의 host 값과 비교하여 일치하면 해당 이미지?js 등을 cancel 하면 된다.

관련 내용 궁금하시면 리플을 달아주시면 최대한 답변 해드리겠습니다.

728x90
반응형