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

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

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

Google Chromeは携帯、テレビ、デスクトップなどの様々なプラットフォームで利用できるウェブブラウザです。Googleが開発したもので、Blink (レンダリングエンジン) とアプリケーションフレームワークを使用しています。

JavaScript

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

Chrome extension

Chrome拡張機能

受付中

imgタグのURL部分を用いて画像検索させるに当たっての仕様について

mansei2010
mansei2010

総合スコア9

Chrome

Google Chromeは携帯、テレビ、デスクトップなどの様々なプラットフォームで利用できるウェブブラウザです。Googleが開発したもので、Blink (レンダリングエンジン) とアプリケーションフレームワークを使用しています。

JavaScript

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

Chrome extension

Chrome拡張機能

0回答

0評価

0クリップ

1983閲覧

投稿2017/01/07 21:05

編集2022/01/12 10:55

画像を現存するタブと新規タブ作成のボタンの間にドラッグアンドドロップする事で画像検索を行いたいと考えています。

ですが、いざ実装し画像をドラッグアンドドロップを行った際、情報はバックグラウンドに送れていると思われますが、常にタブが作成し続けてしまい、ブラウザクラッシュみたいな状況が起こってしまいました。

理由としては、タブを読み込んだ後タブを作成し、そのタブを読み込んで作成のループが原因であると思っています。
その為、location.hrefをバックグラウンドで試してみたのですが、ページ遷移が行われずにいます。

また、作成されたページの中には、「画像での検索はご利用になれません。数時間後にもう一度お試しください。」と出てしまっており、画像が取得出来ていないのではないかと考えています。

さらに、画像のurlについて、コンテンツスクリプトとバックグラウンドのどちらで取得すれば良いかについても曖昧です。

下記にmanifestファイル、コンテンツスクリプトのプログラム、バックグラウンドのプログラムを載せます。

どうか、画像の取得並びにループの抜け出し方について教えて頂けませんでしょうか。

よろしくお願い致します。

JSON

{ "manifest_version": 2, "version": "1.0.0", "name": "Tab Searcher", "description": "画像をタブの部分にドラッグ&ドロップするだけで画像検索の出来る拡張機能です。", "permissions": [ "tabs", "activeTab", "browsingData", "<all_urls>" ], "content_scripts" : [ { "matches" : [ "file:///*/*", "http://*/*", "https://*/*" ], "js": [ "content.js" ], "run_at" : "document_end" } ], "background" : { "scripts" : [ "ImageSearch_test_6.js" ], "persistent" : false }, "browser_action":{ "default_icon": "tabsearch.png" } }

javascript

//content.js var id = chrome.runtime.id; chrome.runtime.sendMessage(id,"image");

javascript

//background.js function Sub(image){ var form = document.createElement('form'); form.setAttribute('method', 'post'); form.setAttribute('action', 'http://images.google.com/searchbyimage/upload'); form.style.display = "none"; document.body.appendChild(form); var hiddenField = document.createElement('input'); hiddenField.setAttribute('type', 'hidden'); hiddenField.setAttribute('name', 'image_content'); hiddenField.setAttribute('value', image); form.appendChild(hiddenField); form.submit(); }; var imageToBase64 = function(imgElement, mimeType) { var canvas = document.createElement('canvas'); base64String = ''; if (!imgElement || typeof mimeType !== 'string') { return ''; } mimeType = mimeType.replace(//png$/, '/octet-stream'); canvas.width = imgElement.width; canvas.height = imgElement.height; base64String = canvas.toDataURL(); return base64String; }; chrome.runtime.onMessage.addListener(function(request,sender,sendResponse){ var image = document.getElementsByTagName('img')[0]; var base64String = imageToBase64(image, 'image/jpeg'); var SearchCode = Sub.toString().replace(/(\n|\t)/gm, ''); chrome.tabs.create({ 'url': 'javascript:' + SearchCode + '; Sub("' + base64String + '");' }); });

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

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

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

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

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

まだ回答がついていません

会員登録して回答してみよう

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

ただいまの回答率
87.20%

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

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

質問する

関連した質問

同じタグがついた質問を見る

Chrome

Google Chromeは携帯、テレビ、デスクトップなどの様々なプラットフォームで利用できるウェブブラウザです。Googleが開発したもので、Blink (レンダリングエンジン) とアプリケーションフレームワークを使用しています。

JavaScript

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

Chrome extension

Chrome拡張機能