Chromeの拡張機能のソースコードをいじる

事象発生日：2018-04-24

記事公開日：2018-04-27

アクセス数：22251

Chromeのある拡張機能のサポートが終了したようで動かなくなった．

そこで，ソースコードをいじって動くようにしたお話．

１．動作環境

Microsoft Windows 10 Home (64 bit)

Google Chrome 65.0.3325.181（Official Build）(64 bit)

２．背景・モチベーション

Startup Bell - doorbell for Google AnalyticsというChrome拡張機能を愛用していたのだが，突然動かなくなってしまった．

公式HPにもアクセスできなくなっているので，どうやらサポートが終了したようだ．

代替となる拡張機能がなかったので，この拡張機能のソースコードをいじって動くようにした．

この拡張機能は，googleアナリティクスのリアルタイム - 概要タブを開いておくと，現在アクティブなユーザー数をそこから抽出し，Chromeメニューバーの右に取得した数字を表示してくれるという単純なものだ．

３．エラーの特定

エラー箇所を確認してみる．

上図のように，bell.js にてエラーが発生している．

そして，これはC:\Users\${username}\AppData\Local\Google\Chrome\User Data\Default\Extensions\pbjbgplnnelkehhpnlcfolhgdimmlehd\0.7_2\bell.jsにあった．

なお，どうやらpbjbgplnnelkehhpnlcfolhgdimmlehdは拡張機能のIDのようで，ChromeウェブストアのURLにも含まれている．

bell.jsのソースコードは以下のようであった．

(function(e,t){
	
	r=function(s){
		var o=parseInt(e.getElementById('ID-overviewCounterValue').innerHTML);
		if(s||s===0){
			chrome.runtime.sendMessage(o);
			var u=o-s;
			if(u>0){
				t.log('You have new visitor');
				chrome.runtime.sendMessage({ msg: "startFunc" });
			}
			
					}setTimeout(function(){r(o)},2000)};
					r()})
(document,console);

bell.js（変更前）

IDがID-overviewCounterValueのDOMからテキストを取得している部分で，Uncaught TypeError: Cannot read property 'innerHTML' of nullというエラーが発生している．

現在のアクティブユーザー数を表示している部分は<div id="ID-overviewCounterValue" class="_GAnGb">2</div>であっているのだが，e.getElementById('ID-overviewCounterValue')がnullを返してしまっている．

よくよくDOMを確認すると，この画面の右側はiframeで実装されていたため，iframe以下の埋込DOMにアクセスできていないことが原因だった．

（ここ最近でページの実装が変わったのか？）

４．修正

そこで，bell.jsを次のように変更．

(function(e,t){
	
	r=function(s){
		var o;
		var myTag = e.getElementById('galaxyIframe').contentWindow.document.getElementById('ID-overviewCounterValue');
		//console.log(myTag);
		if (myTag == null) {
			//console.log("NULL!!");
			o = 0;
		} else {
			//console.log("NOT null!!");
			o = parseInt(myTag.innerHTML);
		}

		if(s||s===0){
			chrome.runtime.sendMessage(o);
			var u=o-s;
			if(u>0){
				t.log('You have new visitor');
				chrome.runtime.sendMessage({ msg: "startFunc" });
			}
			
					}setTimeout(function(){r(o)},2000)};
					r()})
(document,console);

bell.js（変更後）

これでうまく動くようになった．

５．うまくいったと思ったが...？

うまくいくと思ったのだけれど，Chromeを再起動したら不具合が生じた．

拡張機能が壊れていると言われ，修復すると元のコードに戻ってしまった．

そこでChromeの拡張機能ディレクトリを詳しく見てみよう．

C:\Users\${username}\AppData\Local\Google\Chrome\User Data\Default\Extensions\pbjbgplnnelkehhpnlcfolhgdimmlehd\の構成はこうなっていた．

└─0.7_2
    │  background.js
    │  bell copy.js
    │  bell.js
    │  icon-128.png
    │  icon-16.png
    │  icon-48.png
    │  icon.js
    │  manifest.json
    │
    ├─audio
    │      doorbell.mp3
    │
    └─_metadata
            computed_hashes.json
            verified_contents.json

_metadataが怪しすぎる．

{"file_hashes":[{"block_hashes":["3Qk3g7Zr7WT7hflPcVdk7tBVgfGUT1/wbgMIW+V3AsQ=","AhB90HpdK2jyPChFe5/Xgx9XLHTIyA5vJKZX6XUkzS0=","nU0uP3/xAKETrF9CeorjY8/mujkfHO2tPC5iaWQ4gss=","Z9ukF8T1aU0M/zPKcg3hJNTU5/v79YPL3sUWKfdh9hc=","nfFJWEZj4wSBKrEOvKFpHRMadcL90OaC8XvquXvCLVQ=","VIF+XrqHTXhDxydRgnFZoMZoVqOzDV9rratUvDPJIvY=","hGR52VuZV/5K6UP+xGbLGoKS2RXY7kXGCzEP3MYbmjQ="],"block_size":4096,"path":"audio/doorbell.mp3"},{"block_hashes":["Itki+V6YYlt663iI79fEODToHHcEPySfxvdDwiUu/HQ="],"block_size":4096,"path":"background.js"},{"block_hashes":["ljQbUrD+dTzpj77JldJ6jPMMBQDAqdcGvbe1AtOoC6Q="],"block_size":4096,"path":"bell copy.js"},{"block_hashes":["JeQ0Oigx4e7Oki7RktTJs6XxnycL3GEEmVCjSpjm/tA="],"block_size":4096,"path":"bell.js"},{"block_hashes":["bogAg94wBZeRiUc1DRQrobl6J2+8QxSuman5HOQ+6bg="],"block_size":4096,"path":"icon.js"}],"version":2}

computed_hashes.json

[{"description":"treehash per file","signed_content":{"payload":"eyJjb250ZW50X2hhc2hlcyI6W3siYmxvY2tfc2l6ZSI6NDA5NiwiZGlnZXN0Ijoic2hhMjU2IiwiZmlsZXMiOlt7InBhdGgiOiJhdWRpby9kb29yYmVsbC5tcDMiLCJyb290X2hhc2giOiJ3Skd1azUyUmFRVUxZMkVQSTVuSUc4dU5DVFA5R21DLW51dWJGS2pNVkQ0In0seyJwYXRoIjoiYmFja2dyb3VuZC5qcyIsInJvb3RfaGFzaCI6Ikl0a2ktVjZZWWx0NjYzaUk3OWZFT0RUb0hIY0VQeVNmeHZkRHdpVXVfSFEifSx7InBhdGgiOiJiZWxsIGNvcHkuanMiLCJyb290X2hhc2giOiJsalFiVXJELWRUenBqNzdKbGRKNmpQTU1CUURBcWRjR3ZiZTFBdE9vQzZRIn0seyJwYXRoIjoiYmVsbC5qcyIsInJvb3RfaGFzaCI6IkplUTBPaWd4NGU3T2tpN1JrdFRKczZYeG55Y0wzR0VFbVZDalNwam1fdEEifSx7InBhdGgiOiJpY29uLTEyOC5wbmciLCJyb290X2hhc2giOiJTWjJUX2E1YldSckJtazFTQ0dJcm10RGNRNm9obUs5NjBGY1hXT1U0TzdNIn0seyJwYXRoIjoiaWNvbi0xNi5wbmciLCJyb290X2hhc2giOiJUUTZuN3B4aEV1SUUybmZLZXhrLXhCeHVLZU40YkRwTzNyWWlRY1RHZUVrIn0seyJwYXRoIjoiaWNvbi00OC5wbmciLCJyb290X2hhc2giOiJzU2hwb2pCUFRhRmlVVVdDSVNHU3lRMXp2Tl9KbzZYOFhxSDZPOGhDUFVjIn0seyJwYXRoIjoiaWNvbi5qcyIsInJvb3RfaGFzaCI6ImJvZ0FnOTR3QlplUmlVYzFEUlFyb2JsNkoyLThReFN1bWFuNUhPUS02YmcifSx7InBhdGgiOiJtYW5pZmVzdC5qc29uIiwicm9vdF9oYXNoIjoiRUppb0Jqb0htRzhVWWVNN2lNSTNkanJIeklybTNuaFFiOHl2UkNZLUsxZyJ9XSwiZm9ybWF0IjoidHJlZWhhc2giLCJoYXNoX2Jsb2NrX3NpemUiOjQwOTZ9XSwiaXRlbV9pZCI6InBiamJncGxubmVsa2VoaHBubGNmb2xoZ2RpbW1sZWhkIiwiaXRlbV92ZXJzaW9uIjoiMC43IiwicHJvdG9jb2xfdmVyc2lvbiI6MX0","signatures":[{"header":{"kid":"publisher"},"protected":"eyJhbGciOiJSUzI1NiJ9","signature":"bHFuDIqqFBkT1sz4cx0XdQWwfq30h9lc2COmSrsAE9E8NusoowttYVTYLk2uHjMf3TSMB6I4c38xmCpb5pLVbdoPHYJiGpt_ShaW5TaPL1el38gBTJwqapnx_RQKsm21Jk4ycLru0HBpQu6XjdPKE6glNKE6FM__0HQWCnIOHua0V41A0tWQj4RFLWnUpwWP1M6Y1E401L5MXJy9lEPhNQw3fyvuS_kAXvT6MuRkbtA_UFf_Oh-kCh2Up11sYl6MwhW3FrW_BaHmc9OTOyEOhFE12w_woZyw7AIrwyUae2ZEpnVx6QInNMjCs9t_cBcvVtjAw3-fHrMSfVRWBpRb6w"},{"header":{"kid":"webstore"},"protected":"eyJhbGciOiJSUzI1NiJ9","signature":"dAniJJbdSpN80rt66W2sM6zd7-nErnJqucMgznElbGkIZV6aZPejgrZQnCTTLjPzj9f4N4Abp6j92BSt_CX8qkQKEZRtldUHNl6HMqHdTPHdpTn9A_vy24s6eunqPSAEYDML9uYmWyMHo_Bc3p8WWNRjSyWWLE23_7Inf0xaBxjWo514BuEtlRkopWMmalunG2vIbqzZfz0d_NSWqZVTQlY9e2KtCSzy1lo6De4D2qDrzhIVe6C62s3OHxljJZlbqiDdKlEuWoY5xLpwULaYKERBjdeAYzzSc3x1NpUPMGjKYwkw5WvfKUJ_cgU758HmDZCYBjdSeOkAkYUWwFkhEg"}]}}]

verified_contents.json

あー，ファイルハッシュあるし，これで破損判定だしているのか..．．

６．仕方がないので...

C:\Users\${username}\AppData\Local\Google\Chrome\User Data\Default\Extensions\MyStartupBell\というフォルダを切って，そこに変更後のファイルを，_metadata以外コピーし，

さらにmanifest.jsonが拡張機能の定義ファイルっぽいのでそれを矛盾が生じないように書き換えた．

これを，Chrome設定 → 拡張機能 → パッケージ化されていない拡張機能を読み込むから読み込めば，正常に動くようになった．

が，これもまたChromeを再起動したらC:\Users\${username}\AppData\Local\Google\Chrome\User Data\Default\Extensions\MyStartupBell\ディレクトリがそっくりそのまま消去された...．

C:\Users\${username}\AppData\Local\はユーザーが勝手にファイルを置いたらダメなところなんですかね...？

仕方がないので，適当にユーザーディレクトリに置くと，Chrome再起動によって拡張機能が消されるという問題はなくなったが，

chromeを開くたびに，

“デベロッパーモードの拡張機能を無効にする”

“デベロッパーモードで実行される拡張機能はパソコンにダメージを与える恐れがあります。デベロッパーでない場合は、安全のため、デベロッパーモードで実行されているこれらの拡張機能を無効にしてください。”

と出てしまう．

ggるとお金払って登録しろとか出てくるけど，まあこれで良しとしますか．

７．総括

今までブラウザの拡張機能を作ったことはなかったが，オープンソースだったため自力でソースを直すことができた．

また，詳しくは述べないが，manifest.jsonで指定されているコードにトリガーなどが書かれており，拡張機能の動作の仕組みが少しわかった．

コメントを投稿

名前

Email (※公開されることはありません)

MENU

CATEGORY

TAG

ARCHIVE

RECENT