Build with Chrome Learn how Chrome works, participate in origin trials, and build with Chrome everywhere.
2007-06-29 カテゴリ: Client Side タグ: JavaScript トラックバック Tips ロールオーバー|CSS HappyLife ↑のサイトのコメント欄では少々舌足らずになってしまったので若干の補足を。 JavaScriptはCやJavaに文法が似ているように見えて、実は特有のリテラルが多いから、JavaScriptに不慣れな人にとってはわけがわからないコードになったりする。このエントリーでは、コード読む上で必要になりそうなリテラルを少し解説。 正規表現リテラル 一つ目が正規表現リテラル。JavaScriptには正規表現型(厳密には正規表現オブジェクト)が存在する。 var re = /abcde/i; ↑の記法は↓に等しい。 var re = new RegExp('abcde', 'i'); このオブジェクトは、match()やreplace()の引数として
2014-08-02 追記 content script内だけで完結する(background.jsとの通信が発生しない)シンプルなコンテキストメニューをお探しならこちらのエントリが参考になると思います→Chromeアプリで長押しコンテキストメニュー 上の画像のようなコンテキストメニューをChrome拡張機能で実現する方法をご紹介します。 まずはプロジェクト構成から。 プロジェクト構成manifest.json main.js 128.png Chrome拡張機能(Extensions)の典型的なファイル構成ですね。 基本的に必要なのは manifest.json と js本体 の2つだけ。 ちなみに 128.png はアイコン画像です。 manifest.json { "name": "My Context Menu Extension", "description": "Sample
FileSystem API FileSystem APIとはWebアプリケーションでユーザのローカルにデータの保存、読込ができるAPIです。 ただし残念なことに対応してるブラウザが多くはありません。 今回はChrome※1を使っていますが、Chomeもブラウザのバージョンが上がるごとに仕様が少しずつ変わっていたりしています。APIのメソッドにもベンダプレフィックスがついていることからまだ実験的な段階といえます。 それでも可能性が色々あるAPIですので、今回取り上げてみました。 ※1 chromeのはバージョン31を使用しています。 保存方法について FileSystem APIには「TEMPORARY」「PERSISTENT」の形式が2種類があります。 TEMPORARYで保存したファイルは空き容量が必要になった時などブラウザの判断でファイルを削除することができるので一時的に保存すること
以前、Chrome拡張機能でFileSystemAPIを使う記事を書きました。 Chrome拡張機能でFileSystemAPIを使ってみた - メモ的な思考的な それを使って個人的な拡張機能を作っていたのですが、ふと先日気づいたところ、動作していないことが分かりました。 そこで、現在のChrome24に対応できるようにしてみたときのメモを残します。 お世話になったサイト ManifestFileのバージョン2対応や、APIの切替、拡張機能のデバッグなどで以下のサイトが参考になりました。ありがとうございました。 http://blog.maripo.org/2012/08/iinya-migration/ 現在開いているタブの一覧を取得・表示するGoogle Chromeプラグインを作ってみた - Life Refactoring Google Chrome Extensionを作ってみた
ブラウザからDOMを解析してローカルファイルへ保存する方法がないかを調査したときのメモ。 2013/01/19 追記 2013/01/19時点のChrome 24.0.1312.52 m において、以下の情報は古い上、ソースコードは動作しません。 続編的なものは以下の記事となります。 Chrome24 + Manifest v2 にて、Chrome拡張機能 + FileSystemAPI を使ってみた - メモ的な思考的な 2013/01/19 追記 ここまで ブラウザごとのローカルファイル保存方法 ブラウザ別の実際のコードは、以下のサイトが詳しい。 あらびき日記 - JavaScriptからローカルファイルを作成する方法まとめ HTML5を押さえておきたいと思っていた矢先、ChromeではHTML5のFileAPI:Writerを使っているとのことなので、Chromeを選択。 なお、Ch
生成元横断XMLHttpRequest 通常のウェブページは XMLHttpRequest オブジェクトを使ってリモートホストとの通信を行う。しかしそこには 同一生成元ポリシー という制限が存在する。拡張機能では、そのような制限は設けていない。拡張機能は最初に生成元横断のパーミッションを要求しておくことで、異なる生成元のサーバとも通信することが出来る。 拡張機能の生成元 実行されている各拡張機能は、それぞれ分割された生成元に存在している。特別に特権を要求しなくても、XMLHttpRequestを使って自身のインストールフォルダからのリソース取得を行うことが出来る。例えば、拡張機能が config.json というJSONで記述された設定ファイルを config_resources というフォルダに持っている場合、次のように取得することが出来る。 var xhr = new XMLHttpR
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. Learn moreSee full compatibilityReport feedback XMLHttpRequest (XHR) オブジェクトは、サーバーと対話するために使用されます。ページ全体を更新する必要なしに、データを受け取ることができます。これでユーザーの作業を中断させることなく、ウェブページの一部を更新することができます。 EventTarget XMLHttpRequestEventTarget XMLHttpRequest XMLHttpRequest という名前ではあるものの、 XML だけでな
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015. Learn moreSee full compatibilityReport feedback W3C の XMLHttpRequest 仕様書では、もともと XML の解釈しか対応していなかった XMLHttpRequest に HTML の解釈を追加しています。この機能によって、ウェブアプリは XMLHttpRequest を使って HTML を解釈済の DOM として取得することができます。 一般的な XMLHttpRequest の使い方についての概要は、 XMLHttpRequest の利用をお読みください。
メッセージ コンテント・スクリプトは拡張機能ではなくウェブページのコンテキスト上で実行されるため、拡張機能側との通信手段が必要になることがしばしば発生する。例えばRSSリーダーを拡張機能で作ろうとした場合、コンテント・スクリプトはページがRSSを提供しているか確認し、ページの有無によってアイコンの表示を変えるためにバックグラウンドページに通知する。 このような拡張機能とコンテント・スクリプトの通信は、メッセージ機能により実現される。両者はお互いにメッセージを送信し、同じチャンネルで応答することも出来る。メッセージにはJSONを用いる。APIには一度だけメッセージを送るシンプルなものも、永続的に接続する複雑なものも用意されている。この機能を使えば、IDを指定することで他の拡張機能と通信することも可能になる。 単発通信 拡張機能の他の部分に単発の通信を送りたい(そして場合によっては応答を受け取
« Mac OS Xアプリで独自URIスキームを使う方法 「みんな何かの作り手だ~Makerからメーカー、クラウドファンディングまで~」開催! » Google Chrome拡張機能「いいニャ」をManifest Version 2に対応させた際の作業メモ Google Chrome拡張機能のマニフェストのバージョンアップが推奨されており、今はバージョン1からバージョン2への移行期間となっている。 私も、現在Chrome Web Storeで公開している拡張機能「いいニャ」と「CustomBlocker」をマニフェストバージョン1から2にマイグレーションする作業をしなければいけなくなった。まずは規模の小さい「いいニャ」から作業を行った。 これからマイグレーションする開発者の参考になるかもしれないので、manifest.jsonの変更点と、簡単な解説を書く。 manifest.jso
The Tabs API not only offers features for manipulating and managing tabs, but can also detect the language of the tab, take a screenshot, and communicate with a tab's content scripts. Permissions Most features don't require any permissions to use. For example: creating a new tab, reloading a tab, navigating to another URL, etc. There are three permissions developers should be aware of when working
A good idea. Also helps get round the problem of my pinned tabs being dropped when I have more than one chrome window open. I added my pinned tabs to a book mark folder. When I opened the bookmark group, it reopened all of them as pinned, neat! Translation: "Details" :- Extension to save the state of the pinned tabs. Right-click on the tab and pin as usual, when you open it again it will open as a
唐突にGoogle Chromeのエクステンション(拡張機能)が作ってみたくなりました。 作り方を調べたときの過程をメモしておきます。 参考サイト エクステンションの作り方を解説しているサイトはこちら。 http://code.google.com/chrome/extensions/index.html 一番簡単なチュートリアルを写経してみます。 Tutorial: Getting Started (Hello, World!) http://code.google.com/chrome/extensions/getstarted.html ちなみに、試したときのChromeのバージョンは「4.1.249.1064」です。 チュートリアル まず、作成する拡張機能の設定ファイルやhtmlを保存するフォルダを作成します。 今回は、「C:\chrome_extensions\tutorial」
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く