Chrome on akky@サイボウズラボ・ブログ

Content Edit & Blur - ウェブページにボカシを入れるブラウザ拡張

Thu, 11 Feb 2021 00:00:00 +0000

Content Edit & Blurは、ブラウザで開いているウェブページの任意の箇所を編集したりボカしたりできる拡張ツールです。

拡張アイコンを"Edit"や"Blur"にしてからウェブページ上の要素をクリックすることで、文字を編集したり、ボカシをかけて中身を読めなくしたりすることができます。

“Blur"モードでは、1回目のクリックで軽いボカシが掛かり、2回クリックすると強めのボカシになります。3度クリックすると元に戻ります。

何か所かボカしてみました。

スクリーンショットを撮ったり、ビデオ会議で画面を共有したりする際に、ちょっと個人情報が表示されている箇所を隠したい、という時などに気軽に使えそうです。developer’s tool でもできますがここまでお手軽ではないですからね。

ソースコードは公開されていて、Firefox, 新Edge 版もあります。

Link to Text Fragment - Googleによるウェブページの任意の場所をリンクできるブラウザ拡張

Thu, 18 Jun 2020 00:00:00 +0000

新しいLink to Text Fragment Google社自身によってリリースされた、ウェブサイトの好きな箇所をURL化して共有できるChrome拡張です。

拡張をインストールした状態でページ上のテキストを選択し、右クリックメニューを出すと、Copy Link to Selected Text (選択されたテキストへのリンクをコピー)というメニューが増えています。

ここでクリップボードに取得されたURLを Chrome ブラウザ上で開いてみると、

先ほどリンクを作成したwebページが開かれた上で、選択していた部分が黄色くハイライトされ、ページもそのハイライトされた部分までスクロールした状態で開かれます。

選択するテキストが短すぎると、URLが作れない、というエラーが出ます。

利用シーン

これまで、他人が作ったウェブサイトのURLを他の人と共有することはできても「この特定の部分を見せたい」というのは難しかったと思います。やるとすればページを開いた後にページ内検索で"○○○“を探して、とかでしょうか。

最新のブラウザとこの拡張を使えば、ページの特定の箇所をはっきりと示して共有できるため、長いページのある特定の箇所を素早く見てもらいたい、といった作業が効率化されるでしょう。

受ける側はブラウザが最新のバージョンであればこの拡張は不要です。Chrome を随時アップデートしている相手なら問題ないでしょう。

仕組み

Chrome バージョン80 から使えるようになった、Text URL Fragments の機能を使ったものだそうです。

コピーされたURLの後ろに、選択した文字列を含む文字列が追加されていますね。

日頃、チャットツールや社内のグループウェアなどでネット上のウェブページを紹介することが多い人などにとって、紹介の質が上がる良いツールなのではないかと思いました。

via The Verge

Hacker Tab - GitHubのtrendingプロジェクトをブラウザの新規タブに表示するChrome拡張

Sat, 16 Feb 2019 00:00:00 +0000

新たに公開されたHacker Tab Chromeブラウザ拡張は、ブラウザの新規タブで表示されるページを、Google検索ではなく GitHub のホットなプロジェクト(trending)に差し替えてくれます。

プログラミング言語/集計期間を選んで絞り込むこともできます。

拡張機能のソースコードはこちら。GitHub の trending の取得にはこちらのスクレイピングライブラリを使っているようです。

ブラウザのタブが表示されるたびにチェックすることになるので新たな面白いオープンソースプロジェクトの発見につながるかもしれませんね。

Cookiesの利用許可を訊かれなくするブラウザ拡張 I don't care about cookies

Mon, 19 Nov 2018 00:00:00 +0000

I don’t care about cookies(クッキーなんて気にしないよ)は、ヨーロッパのウェブサイト(や、ヨーロッパからもアクセスされるアメリカ他のウェブサイトでも)で最初に訪問した際によく出てくる、「cookies を使ってもいいかな? Yes / No 」というポップアップ等のダイアログを消してしまうブラウザ拡張機能です。

クロアチアのダニエル・クラドニクさん(Daniel Kladnik)が開発し、公開したこのブラウザ拡張、Chrome、Firefox、。AdBlock Plus/uBlock など、多くのブラウザ環境に対応しています。

動作例

通常状態でアクセスすると、こんな風に画面の半分を「Cookie 使うよ」という警告で埋めてしまうようなサイトに対して、

拡張をオンにしてアクセスすると、こんな風になります

意味があって同意を求めているのだから、自動的に無視なんてすべきではない、という意見もあるかとは思いますが、ほとんどのサイトでこのような警告には考えずに承認して先へ進んでいる人も多いのではないでしょうか。どうせ承認するのなら、最初から飛ばしてしまうこの拡張、仕事の効率化と言えなくもありません。

サイトごとに一度承認すればいいだけ、ではあるのですが、PCを新しくしたり、ブラウザを乗り換えたり、何かの不調で cookies を含んだ履歴を削除したり、いろんな理由で承認した記録がなくなってしまうこともあるでしょう。

この拡張が自動的に承認している、わけではなく、承認を尋ねるダイアログを見えなくしているため、本来の手順を迂回してアクセスしてるという見方もできますが、このような cookies 使用の同意を取ることにどれほど意味があるのか、疑問に思っている人も多そうです。

ソースコード

閲覧したウェブサイトの情報をアクセスする拡張機能なので、インストール時にはいろいろ権限を要求されます。念のためインストール前に Chrome 版のソースコードを眺めてみましたが、(今のバージョンでは)特に怪しいところは無さそうです。

サイト毎にcookie警告の表示方式は多岐に渡っていて、どうやって警告を抑制してるのかなと思ったのですが、ソースコードを見るとたいへんな力業だとわかりました。サイトごとに、警告に関する CSS セレクタ名などを持っていて、マッチするものを表示させなくしています。また、ページ遷移などがあるものについては、個別に対応コードを用意しています。つまり、拡張がすでに知っているサイトの cookies 警告を止めているわけです。

参考

EUはクッキーの読み書きでユーザの承諾を義務化–ヨーロッパのインターネット業界は墓場になるね | TechCrunch Japan

欧州「クッキー法」、対応が必要なクッキータイプ：あなたのサイトは大丈夫？ | DIGIDAY［日本版］

AutoMute - ブラウザの音声再生を全部デフォルトオフにできるChrome拡張

Wed, 04 Apr 2018 00:00:00 +0000

AutoMute は、Chrome ブラウザからとにかく音が出ないようにできるブラウザ拡張です。

インストール直後の設定は、あらゆるサイトでの音声がオフになっています。すべてのタブにミュートのマークが表示され、マークをクリックしたり、拡張アイコンのメニューから選択したりすることで、個別に再生を許可することもできます。

YouTube など、サイト側で用意しているミュート機能とは別のレイヤで止まっているため、場合によっては拡張でアンミュートして、動画側でのアンミュートして、としないと聴こえないこともあります。

音楽等が突然再生されたりすると非常に困る、といった職場で働いているような人たちは、保険のために入れるといいのかもしれませんね。絶対にどんな音も鳴らなくていい、ということなら、OSのドライバを止めるとかイヤホンジャックを埋めるとかもありですが、この拡張であれば、音がしても大丈夫なサイトだけ許可したり、どうしても音を聴かなければいけない時だけ設定を変えて聴いたりすることができます。

via LifeHacker via TheNextWeb

PDFで作られたブロック崩し

Tue, 05 Jul 2016 00:00:00 +0000

pdfファイルといえば様々な環境でなるべく同じに見えるようにレイアウトを固定した文書を配る時のフォーマットだと思いますが、そのpdf形式で作られたブロック崩しゲームが公開されました。

breakout.pdf (Chromeブラウザでのみ動作)

画面下の青い部分でマウスを動かすと、自機を左右に動かすことができます。

Omar Rizwanさんによるソースコードおよび解説によると、PDFは仕様上はFlashやら音声やら動画やらJavaScriptやら、いろんなものを内蔵できるようになっているのだそうです。

ただ、ほとんどのPDFビューワーでは、そういった本流でない部分の仕様は実装していません。しかし、Chromeブラウザ内蔵のpdfビューワーでは、pdfがサポートしているJavaScriptの仕様のうちのいくつかが実装されているそうです。pdfからJavaScriptを呼び出せるというブログを見たRizwanさんは、使えるAPIだけを使って、ブロック崩しゲームを実装してしまった、というわけです。

このChrome pdfビューワの実装においても、データベースに接続するとか、接続されたモニターを検出するとか、外部リソースにアクセスするとか、そういったほとんどの機能は「サポートしない」となっていて、pdfの内部で計算をすることはできても、外部とのやりとりをする手段の多くは使えないのだとか。

この限定されたAPIから、テキストの背景色を動的に変えることはできないけれど、その枠の大きさと枠のスタイルは変えられる、ということで、ブロックの表示・非表示を制御したそうです。

また、マウスの正確な位置を検出する手段はないけれど、PDF作成時に配置したフィールドへのマウスカーソルの出入りは検出できるということで、これを使ってマウスの場所を取得しているそうです。

フィールドも後で追加することはできず、PDFに最初から持たせておく必要があるそうで、自機、ブロック、ボール、得点、残機のそれぞれを、大量のフィールドとしてPDF上に配置するスクリプトを書き、それでゲーム画面のPDFを生成させているということ。

Chromeブラウザ上のpdfビューワは、もともとGoogleがFoxitから買い取ったpdfビューワーを基にしたものらしいということで、Foxitの時代にその顧客がこの小さなJavaScriptセットを使っていたのではないか、とRizwanさんは推測しています。

via TheNextWeb

Chromeブラウザのタブにアートを表示するGoogle公式の拡張 Google Art Project

Thu, 12 Mar 2015 00:00:00 +0000

グーグル社が世界の文化団体と協力して進めているGoogle Cultural Instituteの、アートのデジタル公開プロジェクトArt ProjectがリリースしたChromeブラウザ拡張は、Chromeブラウザで新しいタブを開く際に、ランダムなアートを表示するというもの

新しいタブを開くと、ページいっぱいに絵画が表示されます。拡張機能の設定で、開くたびに別のアートにするか、一日の間同じアートが表示されるようにするかを選択できます。

他の絵画が見たければ左下の丸い矢印で切り替え。右下のアイコンをクリックすると良くアクセスするサイトの一覧が出てきます。

拡張機能の設定で、デフォルトの新規タブ画面やアプリ一覧へのボタンを表示させることもできます。

新規タブを開いてもアドレスバーで検索するだけ、という人は、タブにキレイな画像が表示されてもそれほど邪魔でもなく、いい気分転換になるかもしれません。Google社は以前にも、Googleマップからの美しい地形をランダムに表示するChrome拡張機能Earth View from Google Mapsをリリースしています。

via Venture Veat

Chromeブラウザはどれだ? ホーム画面を使った挑戦

Fri, 19 Sep 2014 00:00:00 +0000

友人にパソコンを直してもらったら、直したついでにホーム画面にイタズラされた、という話。

http://imgur.com/LsyfST4

大量にChromeブラウザのアイコンがありますが、この中の一つだけが本当にChromeブラウザで、あとはクリックするとInternet Explorerが開くんだそうです。

via A friend returns a fixed computer with a terrifying challenge on the desktop background. | Chrome Game | Happy Place

ネイティブ広告/記事広告を検知して強調表示するブラウザ拡張AdDetector

Mon, 18 Aug 2014 00:00:00 +0000

「ネイティブ広告」というキーワードがネット広告関連の新しい流行語になりつつあるようです。

ネイティブ広告とは

ネイティブ広告は、本来の記事がある部分が記事の形式を取った広告となっている、というものです。従来のバナー広告など、記事本体部分とは別の場所に表示されたあきらかに広告とわかる広告と違い、記事として読まれることを狙った広告、ですね。

もともと「記事広告」という名前で新聞や週刊誌などでもずっと存在していたものと同じようにも思えるのですが、「ネイティブ広告は一方的な視点でなく公平に掛かれた記事で、内容の面白さや有用さを武器にソーシャルメディア等でバズらせるという点で(面白くない宣伝を記事のフリをして読ませるだけの)記事広告とは別のものだ」などという風にいう人たちもいるようです。たしかに「これがネイティブ広告だ!」みたいな成功事例ではそのような素晴らしいコンテンツもあるようですが。

ただし、コンテンツ的に素晴らしくても、広告であることを隠すことは良くないこととされていて、ネイティブ広告でもページのどこかには、それが広告だという何らかのしるしが入っていることが多いです。特にアメリカではこのあたり厳しいので。

ニューヨークタイムズのネイティブ広告は、ネイティブ広告の最近の大成功例として紹介されます。また、新興バイラルメディアの雄BuzzFeed などもネイティブ広告を使っています。

広告であることを隠そうとするメディア

しかし、本来記事を書く部分を広告として売っているメディア側は、どうも広告だということを大々的に示すのは好きではないようで、このようなネイティブ広告・記事広告でも、目立たない箇所に小さくスポンサー名を入れたり、カテゴリー名などほとんどの人が読まないところに「PR」と入れたり、最低限の表示だけして、読者に広告だとわからせないようにしているところが多いようです。お金を出している広告主もそういう隠す意向があるのかもしれません。

読者から見たら、スポンサーからお金を貰って書いているなら、そうだと知りたいところですよね。「記事で褒めているから買ったけど、あとで記事は広告だったと知った」、なんていう体験をするのは、多くの人にとって面白くはないのでは。

ブラウザ拡張で広告なら強調表示

そこで登場したAdDetectorは、ChromeブラウザおよびFirefoxブラウザ用の拡張機能で、大手メディアのネイティブ広告の告知部分をプログラムで検知して、ページの最上部に大きく「これはスポンサー○○の広告ですよ」と表示してくれるというツールです。

この拡張が入っていれば、漫然といろいろな記事を読んでいる間に、実は広告な記事が開かれても、すぐに気付くことができるというわけです。

AdDetector はオープンソースとしてGitHub上で公開されており、今は対応されていないメディアについての検知スクリプトを書いて取り込みのリクエストをすることも可能です。Forbesやハフィントンポストなどの超大手メディアも対応しているようで、すでに世の中にネイティブ広告や記事広告がかなり多く存在していることがわかります。

日本のネットメディアは、新聞や雑誌ほど「広告だということを示さなければならない」というルールがきっちりと決まっていないため、すみっこに小さく「PR」や「広告」と書いてあるだけでも、まだましな方という話もあります。このようなツールが普及したら、広告であることがわからないように記事広告を載せるメディアも増えたりして逆効果かもしれないので、上から決まるのでも業界の自主規制でもいいから、広告は広告と書く、というルールがきちんと決まるといいですね。

フェイスブックの使い過ぎをブロックしてくれるChrome拡張Facebook Nanny

Mon, 05 Nov 2012 00:00:00 +0000

Facebook Nannyは、ナニー(子守)の名前が示すように、あなたのフェイスブックの利用度合いを見張って、フェイスブックにはまり過ぎないように見張ってくれるというChromeのブラウザ拡張です。

この拡張をインストールしたChromeブラウザでは、

フェイスブックを開いた時、届いている通知1件につき1分間が与えられます。通知が無ければ15秒
上記の時間が過ぎたら、他の通知が来るまでフェイスブックはブロックされます。
メッセージ・プロフィールにはアクセスできるので、新たにメッセージを送ったり、新規に近況を書いたりはできます。

要は、目的がはっきりしている作業はできるけれども、自分に充てたわけでもないタイムラインをなんとなく眺める、という作業はできなくなるということですね。

時間が経つとこのように、「Akky、仕事しないといけないんじゃないの?」というメッセージが出てブロックされます。

仕事に集中するためのよくある対策として、hostsファイルを書き換えて特定のドメインをブロック、というのがありますが、この拡張であれば、仕事の連絡とか自分宛の呼びかけにはちゃんと対処できますし、1つの要件を1分で済ませなきゃ、ということで集中力も上がったりするかもしれません。

# 他のブラウザを使ってでもFacebookにアクセスしちゃえば、効果ないですが。

自分を律することができればこんなもの要らない、という厳しい意見もあるでしょうけど、いろいろな機能があるwebサービスで、必要性や重要度の高い機能だけアクセスできるようにする仕組み、というのは、ものによってはサービス自体が搭載していてもいいのかもしれないな、などと思いました。

フェイスブックやツイッターでの政治的なコメントを全部ネコ画像に置き換えるChromeブラウザ拡張Unpolitic.me

Mon, 29 Oct 2012 00:00:00 +0000

Facebookに流れてくる赤ちゃん画像を全部ネコ画像に差し替えるChrome拡張 Unbaby.me の作者が今回作ったのは、赤ん坊ではなく政治に関するコメントを見えなくするChrome拡張 Unpolitic.me

この拡張を入れた状態でFacebookを閲覧し、そこに政治関連のキーワードがあると、こんな風に猫の画像が表示されます。

前回の赤ちゃんブロックと同じアイデアではありますが。アメリカの大統領選が間近なので、さぞかしアメリカ人のFacebookやTwitterでは、やれオバマがとかロムニーがというコメントが飛び交っているんでしょうね。

ツイッター上ではこんな風になります。つぶやき元のユーザー名が"Politics Blocked"(政治はブロック)という名前になり、「代わりに動物の写真でも見ようよ」とリンク。

ブロックされた元の政治的なツイートをチェックしたければ、 @undo をクリックすると、元のツイートが表示されます。

Chrome拡張のオプション画面で、どういうキーワードを「政治的」とみなすかがカスタマイズできます。日本語でも動いたので、日本語のそういう単語を登録しておけば、全部ネコ画像に置き換わって表示されるでしょう。

もちろん、ネコじゃなくて犬がいい人は、犬の画像が出てくるRSSフィードを登録することで、差し替える画像を犬にできます。

つまり、「政治をネコに」と言っていますが、好きなキーワードをブロックし、好きな画像で差し替えられる汎用的なブラウザ拡張でもあるということです。

このChrome拡張、既に1万人以上がインストールしています。ソーシャルメディアで選挙や支持政党の話は見たくない、という人や、友達ではあるけど「この話題は聞きたくないなあ」という友人がいる方は試してみてはどうでしょうか。

via Google Chrome Extension Blocks Your Idiot Friends’ Political Rants From Your Facebook And Twitter Feed | Geekologie

Internet Explorer 9のコマーシャルをChromeユーザーが作ったらこうなる

Wed, 17 Oct 2012 00:00:00 +0000

数ヶ月前に放映されたInternet Explorer 9のコマーシャルは、いろんな所から「いや、そこまで凄くないだろ」というツッコミを受けるほどクールな出来だったようです。

先日テッククランチで紹介されていた「正直バージョン」は、最近かなりまともになってきたIEやWindowsへの揶揄が過ぎるように思います。

今回出てきたのは、「Internet ExplorerはChromeをダウンロードするための専用ブラウザだ」という視点に立ったパロディコマーシャル。Google Chrome Versionです。

前半はIE9でChromeをダウンロードしてインストールしている様子。後半はいくつかのChromeでしか動かないクールな拡張・webサービスという構成。

英語の有名ニュースサイトや有名ブログの絶賛の声を散りばめたオリジナルに倣い、このパロディでも推薦文が表示されるのですが、「IE9 is the best browser. - Said no one ever」(IE9は最高のブラウザだ - なんて誰も言ったことがない)なんていうのも入っていたり。

オリジナルはこちら

via The Best IE 9 Commercial Ever (Google Chrome Version)

出たばかりのChrome版Angry Birdsがさっそくハックされ、全レベルが遊べるように

Thu, 12 May 2011 00:00:00 +0000

Google I/Oで発表された、iPhoneやAndroidで人気のゲームAngry Birdsのウェブブラウザ版、HTML5で作られていてChromeブラウザでアプリ版とまったく変わらない感覚で遊べることに驚きましたが、もう中身を解析した人が出てきたようです。

要は、どの面をクリアしたかの情報が保存される場所がわかったということなのですが、ブラウザ版を実行した状態で、以下のコードをアドレスバーで実行すると、全部の面のロックが外れてしまいます。

javascript: var i = 0; while (i<=69) { localStorage.setItem('level_star_'+i,'3'); i++; } window.location.reload();

Google I/Oでは、Chromeブラウザ上でのアップストアも発表されました。ケータイやスマートフォンでやっているようなアプリ課金がHTML5ベースのwebサービスでもできるという嬉しいニュースでした。パソコン上のブラウザで動くゲームやコンテンツを作って売れる手段ができるのですから。

このブラウザ版Angry Birdsは、今のところ課金とか無い無料版ですけど、元々のiPhone版などは先のレベルに進みたい人に有料アイテムを売るのが収益源の一つなので、こんな風にソースから中の仕組みが見えてしまうと、そのような課金はやりにくくなるかもしれませんね。スマートフォンのアプリとは違って、ブラウザ上のページではソースが見放題なのは仕方がないことですけれど。