質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Chrome extension

Chrome拡張機能

Q&A

解決済

3回答

5838閲覧

googleの拡張機能の実行タイミングを遅らせるためには?

mansei2010

総合スコア9

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Chrome extension

Chrome拡張機能

0グッド

0クリップ

投稿2016/12/27 05:46

拡張機能の実行において、ページ読み込み後に実行するためには、
"window.onload"を用いればよいと調べてわかったのですが、挿入してもプログラムが先に実行されてしまうのですが、どこで用いればよいかアドバイスを頂けませんか。

できれば、アイコンクリックは用いらないように考えています。

プログラムは下記のとおりとなっております。

javascript

1 function Sub(url){ 2 3 var form = document.createElement('form'); 4 form.setAttribute('method', 'post'); 5 form.setAttribute('action', 'http://images.google.com/searchbyimage/upload'); 6 form.style.display = "none"; 7 document.body.appendChild(form); 8 9 var hiddenField = document.createElement('input'); 10 hiddenField.setAttribute('type', 'hidden'); 11 hiddenField.setAttribute('name', 'image_content'); 12 hiddenField.setAttribute('value', url); 13 form.appendChild(hiddenField); 14 15 form.submit(); 16 }; 17 18 var imageToBase64 = function(imgElement, mimeType) { 19 var canvas = document.createElement('canvas'), 20 context = canvas.getContext('2d'), 21 base64String = ''; 22 23 if (!imgElement || typeof mimeType !== 'string') { 24 return ''; 25 } 26 27 mimeType = mimeType.replace(/\/png$/, '/octet-stream'); 28 29 canvas.width = imgElement.width; 30 canvas.height = imgElement.height; 31 32 context.drawImage(imgElement, 0, 0); 33 34 base64String = canvas.toDataURL(mimeType); 35 36 canvas.clearRect(0, 0, 0, 0); 37 38 return base64String; 39 }; 40 41 var image = document.getElementsByTagName('img')[0]; 42 43 var base64String = imageToBase64(image, 'image/jpeg'); 44 45 SearchCode = Sub.toString().replace(/(\n|\t)/gm, ''); 46 47 chrome.tabs.create({ 48 'url': 'javascript:' + SearchCode + '; Sub("' + base64String +'");' 49 });
{ "manifest_version": 2, "version": "1.0.0", "name": "Tab Searcher", "description": "画像をタブの部分にドラッグ&ドロップするだけで画像検索の出来る拡張機能です。", "permissions": [ "tabs", "activeTab", "browsingData", "<all_urls>", ], "background" : { "scripts": [ "ImageSearch_test_6.js" ], "persistent" : false }, "browser_action":{ "default_icon": "tabsearch.png" } }

よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

自己解決

manifestファイルにおいて、content_scriptの部分に「"run_at" : "document_end"」と記入すればページを読み込んだ後に拡張機能のプログラムを実行させる事が出来ました。

投稿2017/01/08 18:47

mansei2010

総合スコア9

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

【参考】
HTMLの読み込みが完了してから実行

HTMLの読み込みが完了してから実行して欲しい処理を上記リンク先の記事を参考に適切な位置に書きましょう。

投稿2016/12/27 05:56

hitsujimeeee

総合スコア486

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

mansei2010

2016/12/27 06:19

御回答ありがとうございます。 お答え頂いた内容から、ページが読み込まれる際に今までにない動作がありましたので、うまくいくと思います。 ありがとうございます。
guest

0

setTimeoutで少し待ってから処理を始めるという方法ではだめですかね。
拡張機能が表示中のページにできることなんてほとんどないですよ。
今回のようにパーミッション次第では何とかできますが、とても大変だったはずです。
あと一応書いておきますが、表示中のページのonloadに直接値を設定してはだめです。
そのページにonloadが書いてあった場合は上書きされてしまいます。
試していないですけど

javascript

1function Sub(url){ 2 var form = document.createElement('form'); 3 form.setAttribute('method', 'post'); 4 form.setAttribute('action', 'http://images.google.com/searchbyimage/upload'); 5 form.style.display = "none"; 6 document.body.appendChild(form); 7 var hiddenField = document.createElement('input'); 8 hiddenField.setAttribute('type', 'hidden'); 9 hiddenField.setAttribute('name', 'image_content'); 10 hiddenField.setAttribute('value', url); 11 form.appendChild(hiddenField); 12 form.submit(); 13}; 14 15function Main(){ 16 var imageToBase64 = function(imgElement, mimeType) { 17 var canvas = document.createElement('canvas'), 18 context = canvas.getContext('2d'), 19 base64String = ''; 20 21 if (!imgElement || typeof mimeType !== 'string') { 22 return ''; 23 } 24 25 mimeType = mimeType.replace(/\/png$/, '/octet-stream'); 26 27 canvas.width = imgElement.width; 28 canvas.height = imgElement.height; 29 30 context.drawImage(imgElement, 0, 0); 31 32 base64String = canvas.toDataURL(mimeType); 33 34 canvas.clearRect(0, 0, 0, 0); 35 36 return base64String; 37 }; 38 39 var image = document.getElementsByTagName('img')[0]; 40 41 var base64String = imageToBase64(image, 'image/jpeg'); 42 43 SearchCode = Sub.toString().replace(/(\n|\t)/gm, ''); 44 45 chrome.tabs.create({ 46 'url': 'javascript:' + SearchCode + '; Sub("' + base64String +'");' 47 }); 48} 49window.addEventListener('load', Main, false);

でどうですかね。
あまり拡張機能は作ってないので自信がないですけど。

投稿2016/12/27 05:56

stmkza

総合スコア478

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問