ネコがたわむれるだけのChrome拡張、「阿部寛のホームページ」で利用可能に 有志が対策パッチ開発
シルエット姿のネコがWebブラウザ上に集まりたわむれるだけのChrome拡張「ネッコサーフィン」の“問題”が解決した。俳優の阿部寛さんの公式Webサイト「阿部寛のホームページ」だけネコが来なかったのだが、有志が対策パッチを開発。同サイトにネコを召喚することに成功した。 ちなみにネッコサーフィンは、ロシアとウクライナでバズっており、ネコの癒やし効果は世界をで求められているようだ。 ネッコサーフィンは、発明家・デザイナーの「もにゃ」さんが開発した拡張。マウスの移動量に応じてネコが現れてたわむれるだけで、便利な機能はない。むしろちょっと邪魔だ。 「阿部寛のホームページ」は、1990年代にタイムスリップしたかのような古風なサイト。なつかしのframesetタグが利用されているため、ネッコサーフィンを入れたブラウザでもネコが現れないという問題が起きていた。 もにゃさんはユーザーに対して、「阿部寛のホ
マウスに猫が集まるだけのChrome拡張機能『ネッコサーフィン』に「阿部寛のホームページだけで猫が消える」という問い合わせが10件近く来ている
もにゃ.txt @Monya_sub 「阿部寛のホームページでだけネコが消える」という問い合わせが既に10件近く来ているのでこちらで回答させてください。 すみません、どうしてもあそこだけはホームページの実装が特殊すぎて技術的にネコが寄りつかないんです。修正予定もないです。 twitter.com/monyaizumi/sta… 2024-01-08 19:07:39 もにゃ @Monyaizumi 【作業を邪魔されたい方へ】 マウスの移動量に応じてネコが集まってくるだけのChrome拡張『ネッコサーフィン』をリリースしました。 monyaizumi.com/cat-surfing/ こんな感じで、窓の外からやってきたネコたちがじゃれついてきます。 便利な機能はなにもありません。 #ネッコサーフィン pic.twitter.com/MW0GwNydPq 2023-12-29 17:08:03
僕の自作ツールが大学のサーバーをダウンさせてしまった日の話｜くりきん
2021年10月25日、この日は僕がただの大学生から、大学のサーバーをダウンさせた"犯人"へと変わった日です。 小説みたいな書き出しをしてみましたが、これは嘘みたいな本当の話で、ふと思い出して懐かしくなったので回想録として note に残すことにしました。 出来事の概要2年前の2021年10月、何が起きたかを簡単に書くと以下の通りです。 ・大学の授業や課題を管理するためのシステムを拡張するツールを作った ・ツールが予想以上の人数に使われ、結果として大学のサーバーに負荷がかかりサーバーが落ちる事態になった ・大学から呼び出しを受けることになった 時系列を追って、この note で出来事の全容を書きたいと思います。 使いづらい LMSまず前提として、私の大学では毎日の授業や課題は授業支援システム、通称 LMS と呼ばれるオンラインのシステムで管理されています。 実際のLMSの画面しかし、この
Chrome 拡張機能を作って公開しよう⑥ 〜コンテキストメニューを作る〜 - Qiita
この記事は、先日ブログに投稿したものと同じ内容です。ぜひ、ブログの方もご覧ください。 1回15分で拡張機能を作るシリーズ、第6弾！ 拡張機能も完成に近づいてきました！今回は、更に利便性を向上させるため、コンテキストメニュー(右クリックで開けるメニュー)からも拡張機能を起動できるようにします。 background.js の作成 開発用フォルダの一番上の階層に、background.js を作成してください。 これは、バックグラウンドで動く JavaScript ファイルで、ここからコンテキストメニューを作成することができます。 また、これを使用するにあたって、manifest.json の変更が必要になります。 manifest.json の書き換え manifest.json の permissions を以下のように書き換えてください。
Google Chrome Extensionを作ってみた-その7- | DevelopersIO
はじめに 今回はコンテキストメニューについてです。 コンテキストメニューを出すためのcreateメソッドの引数createPropertiesの内容を中心にして紹介します。 使ってみる manifest.json コンテキストメニューを使うには、manifest.jsonの"permissions"に"contextMenus"を追加します。 コンテキストメニューに対する処理はbackground.html内に記述します。アイコンは128を指定していますが、16x16が推奨サイズです。 { "name" : "ContextmenuSample", "version" : "1.0.0", "background_page" : "background.html", "permissions" : [ "contextMenus", "http://*/*", "https://*/*"
Chrome Extension の作り方 (最終話: メッセージパッシング) - Qiita
Chrome Extension の作り方 (その1: 3つの世界) - Qiita Chrome Extension の作り方 (その2: Contents Script) - Qiita Chrome Extension の作り方 (その3: Browser Action / Page Action) - Qiita Chrome Extension の作り方 (その4: Event Page / Background Page) - Qiita の連載の最終回！！ ChromeExtensionを作っていると「メッセージパッシング」という言葉を見かけます。 Message Passing - 公式 Chrome Extension の作り方 (その1: 3つの世界) - Qiitaの説明の通り、3つの世界があるのですが、異世界とやり取りしたい状況が出てきます。 今回のサンプルでは c
ブラウザ拡張機能におけるメッセージパッシング - Qiita
はじめに ChromeやFirefoxで採用されているWebExtensionsによる拡張機能の開発を前提に話をします。 拡張機能の作り方は思ったより簡単ですし、ストアへの公開時の審査も厳しくないので敷居は低く、でも自分や他人の役に立ちやすいので、おすすめの開発だと思います。 HTMLとCSSとJavaScriptで作れます。 今回はこのブラウザ拡張機能を作るときに使用するメッセージパッシングについてです。 拡張機能の構成について さて、この拡張機能ですが、作成するときに大きくわけて2つの部分から構成されます。 （1のみとか2のみの拡張機能もありますが、その場合は特に言うこともないので） 拡張機能自体（background,popup） Webページに埋め込まれる機能(content_scripts) 拡張機能自体の部分 backgroundのスクリプトはブラウザが起動したときにロードされ
Chrome 拡張 manifest v3 で setTimeout が動かない
本家マニュアル It's common for web developers to perform delayed or periodic operations using the setTimeout or setInterval methods. These APIs can fail in service workers, though, because the scheduler will cancel the timers when the service worker is terminated. Web開発者がsetTimeoutやsetIntervalメソッドを使って遅延や周期的な操作を行うのはよくあることです。しかし、これらのAPIはサービス・ワーカーでは失敗することがあります。なぜなら、サービス・ワーカーが終了したときにスケジューラーがタイマーをキャンセルするからです。
Chrome拡張機能 manifest.json Ver.3の書き方 - Qiita
はじめに 現在のChrome拡張機能のマニフェストのバージョンはV2とV3がありますが、こちら によると、 - 2022/1/17 でmanifest v2で新規公開はできなくなる - 2022/6でmanifest v2で非公開でも新規登録はできなくなる - 2023/1で例外を除き,既存のmanifestV2の機能は動かなくなる - 2023/6でmanifestV2は例外なく動かなくなる とのことなのでよっぽどの理由がない限りV3を今後は使うことになります。 V2で書かれた情報の記事はいっぱいあったのですが, V3の記事はあまりなかったので自分用メモも兼ねて整理しようと思います。 manifest.jsonの基本設定 manifest_version 拡張機能自体のバージョンではなく、マニフェストのバージョンです。 ここはとにかく 2 ではなく 3 にしておきましょう！
Chrome Extension を円滑に作るためのポイント
Chrome Extension を作った際にいくつかハマったことがあったのでメモします。 ページ上での JavaScript 実行結果を取得する scripting.executeScript を使うのですが、関数を指定する形式のみしか値が返ってきません。ファイルを指定する形式と同じページに書かれており、制限が明確に書かれていないため紛らわしいので注意が必要です。 NG 次は実行結果が null として返ってきます。 function getTitle() { return document.title; } // returns null getTitle(); // same result // (() => getTitle())(); async function walkDocumentTitle() { const tabId = getTabId(); const inje
Chrome拡張機能Manifest V3対応の勘どころ(?) - 風柳メモ
Chrome ウェブストアに登録している4つの拙作Chrome拡張機能のManifest V3への対応が先日ようやく完了しました。 Manifest V3対応のために当方が実際に行った作業の概要やハマった点などを備忘として残しておきます。 詳細でなかったり整理できていない点に関してはご容赦ください 何はともあれ、公式ページを見ておくべし Firefoxとコードを共通化したいんだけど？ backgroundはService Workerに変更 Manifest V3では削除されてしまったAPIに注意 manifest.json上"permissions"の指定方法変更（ホスト指定の分離） Action APIについての変更（browser_actionとpage_actionの統合） content_scripts等から拡張機能内のファイルにアクセスしたい場合は？（Web-accessibl
Chrome拡張機能をGitHub ActionsでChrome Web Storeにデプロイ
どうも。えーたん（@eetann092）です。 先日、Chrome拡張機能「Choomame（チューマメ）」を公開しました。 本記事では、Choomame開発時に使っている「Chrome拡張機能をGitHub Actionsを使ってChrome Web Storeへデプロイする手順」を紹介します。 メリットは以下です。 自分で拡張機能のversionを制御しなくて良い 更新版をアップロードするときのバージョンの上げ忘れを気にしなくて良い Chrome Web Store Developer Dashboardに手動でアップロードする手間が省ける Chrome Web Store Developer Dashboardから手動で審査の申請をする手間が省ける GitHubの「Releases」に自動でリリースノートを作成＆拡張機能のzipファイルをアップロード 初回はChrome Web St
Chrome拡張機能でコールバック地獄を解決する - mizdra's blog
Chrome拡張機能の非同期APIはコールバックにより実装されています. 例えば, 拡張機能ごとに用意されるストレージからデータを取得する場合, ストレージへのアクセス中にJavaScriptの処理が中断されるのを防ぐため, 非同期APIが用意されています. // background.js chrome.storage.local.get(['admin'], (result1) => { chrome.storage.local.get([`user/${result1.admin}/name`], (result2) => { console.log(result2) }) }) このコールバックによる非同期APIはJavaScriptにおいては一般的な非同期APIの実装手法ですが, 「コールバック地獄」という問題を引き起こします. これを解決する手法としてES2015で追加されたP
Chrome 拡張機能の content_scripts で CORS を回避する方法
注意 現在は Manifest V3 が登場しているので、もしかしたら Manifest V3 とはやり方が異なるかもしれないが、備忘録として残しておく。Manifest V3 での方法については気が向いたらいずれ投稿する予定。 概要 Chrome 拡張機能の content_scripts のスクリプト内で XMLHttpRequest や fetch などの非同期通信を実行すると以下のようなエラーが発生する。 XMLHttpRequest cannot load https://example.com/. Origin chrome-extension://xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx is not allowed by Access-Control-Allow-Origin このエラーは CORS というセキュリティ機能によるもので、許可されていな
Manifest V3 migration checklist | Extensions | Chrome for Developers
Keep track of your migration progress The checklists below are here to help you keep track of your migration work. They define tasks that must be completed with links to instructions. Migration work is broadly divided into five categories as described in the Migration summary. Update the manifest The manifest.json file requires a slightly different format for Manifest V3 than for Manifest V2. This
フロントエンド刷新のために DevTools を作って開発を捗らせる - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは、フロントエンドエキスパートチームの麦島(@mugi_uno)です！ 2021年5月に新しくメンバーとして加わり、富山からフルリモートで働いています。 最近はチームメンバーに誕生日を祝ってもらって嬉しかったです🎉 さて、以前に "kintoneのフロントエンド刷新に向けた取り組み"*1 というエントリでもご紹介しましたが、現在サイボウズ社内では kintone で利用するフロントエンドの技術スタックを刷新する取り組みを進めています。 その一環として、 "Closure Tools DevTools" という Google Chrome 向け拡張機能を作成しました。 作成した DevTools は kintone に限らず利用することができるため、Chrome ウェブストアで公開しています。 chrome.google.com ソースコードも次のリポジトリでご確認いただけます。
Yahooニュースの一覧から特定のキーワードを指定して見たくない記事を非表示にするChromeの拡張機能を作ってみた。 – ノーズブログ
Yahoo!ニュースのとある記事のコメント欄を読んでいたところ、 「なんでこんなニュースばかり載せるんだ」「この話題もういい」「見たくないなら見なければいいんだけど、そもそも一覧に載せないでほしい」「加藤紗里というワードをブロックする機能が欲しい」 というコメントをみかけました。 なるほど、そんな機能ならもしかしたら割と簡単に作れるかもしれないと思い、 初めてChrome拡張機能を作ってみました。 拡張機能を作るにあたり、下記のサイトを参考にさせていただきました。 ありがとうございました。 Chromeブラウザの拡張機能を作ってみたい初心者向けに開発方法を紹介！【サンプルあり】Chrome拡張の作り方 (超概要)超最低限の Chrome エクステンションを開発しウェブストアで公開するまでの手順What are extensions? – Google Chrome（公式ドキュメント） さて
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Chrome extension development: chrome.contextMenus is null
chrome拡張機能のストレージへの容量増加と中身の確認 - 俺より凄いやつしかいない。
自作のChrome拡張機能をManifestV3に移行してみた - Qiita
