chrome 拡張で音声を再生したい

投稿者: Anonymous manifest.json { “name”: “test”, “version”: “1.0”, “manifest_version”: 2, “description”: “test”, “content_scripts”: [ { “matches”: [ “https://*/*” ], “js”: [“test.js”], “run_at”: “document_idle” } ], “web_accessible_resources”: [ “*.mp3” ] } test.js const audioElem = new Audio(); audioElem.src = chrome.extension.getURL(“sound.mp3”); audioElem.play(); という 2 つのファイルと sound.mp3 をフォルダに入れて ページを開くと音を鳴らす最小セットの拡張機能を chrome にインストールしたんですが test.js:3 Uncaught (in promise) DOMException: play() failed…(Continue Reading)

Chrome extensionのアイコンがデフォルトではツールバーに表示されない

投稿者: Anonymous manifest.jsonにはbrowser_actionを記載しています。 "browser_action": { "default_title": "Check Periodically", "default_popup": "popup.html", "default_icon": { "16": "images/icon16x16.png", "32": "images/icon32x32.png", "48": "images/icon48x48.png", "128": "images/icon128x128.png" } }, ところが、アイコンがデフォルトでは表示されず、ツールバーの「拡張機能」ボタンを押すと「アクセス不要 これらの拡張機能は、このサイトの情報の表示、変更を必要としてません」の下にアイコンが表示されており、手動で表示するように設定しなければいけません。 browser_actionを設定していればすべてのページが対象になるのではないのでしょうか? 他に必要な記述があるのでしょうか? 解決 manifest.jsonのpermissionsに"http:///", "https:///", を加えたら「アクセス不要」の下に表示されることはなくなりました。 それと現在FirefoxからChromeへの移行中なので最近の拡張機能の仕様に疎かったんですが、新しくインストールされた拡張機能のアイコンは最初だけツールバーに表示され、その後は手動で固定しない限りツールバーには表示されないんですね。ということでこの問題も自己解決しました。 回答者: Anonymous

Chromeの拡張機能開発でJavaScriptの「location.href」が正しく動作しない

投稿者: Anonymous プログラミング初心者です。 現在、Chromeの拡張機能開発を行っています。 Chromeの拡張機能をクリックするだけで、閲覧中のWEBサイトのURLを取得し、別タブでWEBサイトの表示速度が測定できる「Google PageSpeed Insights」に取得したURLが自動的に反映されるプログラムを制作しています。 完成イメージとしては、閲覧中のサイト(stackoverflow)でChromeの拡張機能をクリックすることで、 「Google PageSpeed Insights」のサイト内にある、URL入力欄に取得したURLが自動的に反映されるプログラムです。 発生している問題・エラーメッセージ javascriptの「location.href」を活用して、閲覧中のサイトのURLを取得しようとしたのですが、うまくいきません。 閲覧中のサイトのURLを「https://○○○」の形で取得できず、 「chrome-extension://afodfheljgloicekcifhieopgnbpibjm/_generated_background_page.html」の形で取得してしまいます。 該当のソースコード manifest.json { “manifest_version”: 2, “name”: “page speed checker”, “version”: “2.0”, “description”: “閲覧中のサイトの表示速度を測定します”, “icons”: { “128”: “page.png” }, “browser_action”: { “default_title”: “page speed checker”, “default_icon”: “page.png” }, “background”: { “scripts”: [“contents.js”] }, “permissions”: [ “tabs”, “http://*/*”, “https://*/*” ] } contents.js…(Continue Reading)

Chrome ExtencionでAjaxを行い、HTMLを表示したい

投稿者: Anonymous chrome extensionでitune RSSをパースしてHTMLに表示したくて以下のコードを書いたのですが、結果が反映されませんでした。 どこを変更すれば表示できるようになりますか? 教えて下さい。よろしくおねがいします。 _x000D_ _x000D_ <!–popup.js–>_x000D_ chrome.browserAction.onClicked.addListener(function(){_x000D_ sendMessage({action: “getMusic”});_x000D_ })_x000D_ _x000D_ var sendMessage = function(message, callback){_x000D_ chrome.runtime.sendMessage(message, callback);_x000D_ };_x000D_ _x000D_ chrome.runtime.onMessage.addListener(_x000D_ function (request, sender, sendResponse){_x000D_ if(request.action == “getMusic”){_x000D_ $.ajax({_x000D_ url: ‘https://itunes.apple.com/jp/rss/topsongs/limit=50/genre=29/xml’,_x000D_ method: ‘GET’,_x000D_ dataType: ‘xml’,_x000D_ success: function(feed) {_x000D_ $(feed).find(‘entry’).each(disp);_x000D_ },_x000D_ error: function(){_x000D_ console.log(‘itunes api search error.’, arguments);_x000D_ },_x000D_ });_x000D_ }_x000D_ }_x000D_…(Continue Reading)

Chrome拡張のoptions.jsが発火しない

投稿者: Anonymous 公式ドキュメントに従って以下のようなコードを書いたのですが、白紙のページが表示されます。 alert(‘a’)//testも動かないのでDOMContentLoadedイベント自体起きてないようです。なお、options.htmlとoptions.jsは同じフォルダに置いてます。 また、これに限らずoptions.jsをデバッグする方法はあるでしょうか? <!DOCTYPE html> <html> <head> <title>W2UI Demo: grid-17</title> <script src="library/jquery-3.5.1.min.js"></script> <script type="text/javascript" src="library/w2ui-1.5.rc1.min.js"></script> <link rel="stylesheet" type="text/css" href=library/jquery-3.5.1.min.css" /> </head> <body> <div id="grid" style="width: 100%; height: 400px;"></div> <script src="options.js"></script> </body> </html> function load(){ alert(‘a’)//test $(‘#grid’).w2grid({ name: ‘grid’, show: { toolbar: true, footer: true, toolbarAdd: true, toolbarDelete: true, toolbarSave: false, toolbarEdit: true },…(Continue Reading)

HTMLでGridView部品のような表示・動作がしたい

投稿者: Anonymous FirefoxアドオンをChrome拡張に移植中なんですが、Visual StudioなどにあるGUI、GridViewのような表示をしたくて悩んでます。具体的にどんなものかと言うと以下の画像のようなものです。 selectタグだと複数列ができません。 条件としては、 複数列表示ができる 行単位での選択・検知ができる を満たすようなものです。 解決 HTML, CSS のみで質問文にあるような動作を実現することは難しいと思います。DataTables や tabulator のようなテーブル生成を行う JavaScript ライブラリを用いることで、そのようなことが可能です。 たとえば、 tabulator を使用した場合は下記コードのようになります。tabulator では選択や選択解除時に rowSelectionChanged イベントが発生します。これは最初の引数として、選択された順序で各行のデータの配列を渡す[1]ため、「行単位での選択・検知」が行えます。 Row Selection Changed[1] Whenever the number of selected rows changes, through selection or deselection, the rowSelectionChanged event is triggered. This passes an array of the data objects for each row in…(Continue Reading)

firefox拡張機能でファイルをダウンロードしたらブラウザの履歴を残さない設定に反して履歴に残る

投稿者: Anonymous 動画共有にサイトを使っていて動画をボタン一つでダウンロードできるように拡張機能を作りました 動画のページの情報を整理して動画の名前にしてchrome.downloads.downloadでダウンロードするようにしています chrome.downloads.download({ url : src, filename: name, saveAs : true }); しかしファイルをダウンロードしたらブラウザの履歴を残さない設定に反して履歴に残ってしまいます 拡張機能はプライベートモードの実行を許可しないといけなかったので許可しました(これをしないと拡張機能が使えません) どうすればブラウザの履歴に残さずに拡張機能でダウンロードをできるでしょうか? 解決 MDN によれば、 downloads.download() 関数の第一引数として与えるオプションには、 incognito オプションを設定出来ます[1]。デフォルト値に関して書かれていませんが、質問文の動作から恐らく false に設定されていると考えられます。 incognito Optional[1] A boolean: if present and set to true, then associate this download with a private browsing session. This means that it will only appear in the download…(Continue Reading)

Chrome拡張機能開発(Extension)でonRequestFinished使用時にtargetDate.getTime is not a function

投稿者: Anonymous Chrome拡張機能開発(Extension)にて、 chrome.devtools.network.onRequestFinished.addListener でHTTPリクエストを監視する際に、 一部のページでエラーが発生します。 chrome.devtools.network.onRequestFinished.addListener((data) => { }) 上記のように onRequestFinished を使用し、developer toolでリクエスト情報を取得しようとしたところ、 inspector.js:956 TypeError: targetDate.getTime is not a function TypeError: targetDate.getTime is not a function at SDK.Cookie.expiresDate (inspector.js:3603) at NetworkLog.HAREntry._buildCookie (inspector.js:6023) at Array.map (<anonymous>) at NetworkLog.HAREntry._buildCookies (inspector.js:6022) at NetworkLog.HAREntry._buildResponse (inspector.js:6009) at NetworkLog.HAREntry.build (inspector.js:6003) at Extensions.ExtensionServer._notifyRequestFinished (inspector.js:7414) at SDK.NetworkManager.dispatchEventToListeners (inspector.js:482) at SDK.NetworkDispatcher._finishNetworkRequest (inspector.js:5671) at…(Continue Reading)