chrome.webviewTag

説明

webview タグを使用すると、ネットワーク経由でウェブのライブ コンテンツをアクティブに読み込み、Chrome アプリに埋め込むことができます。アプリでは、webview の外観の制御や、ウェブ コンテンツの操作、埋め込みウェブページでのナビゲーションの開始、ページ内で発生するエラーイベントへの反応などを行えます(使用方法をご覧ください)。

権限

webview

ClearDataOptions

clearData で消去するデータを決定するオプション。

プロパティ

  • 開始:

    数値(省略可)

    この日付以降に蓄積されたデータをクリアします。エポックからのミリ秒単位で表します(JavaScript Date オブジェクトの getTime メソッドでアクセスできる)。指定されていない場合、デフォルトの 0 になります(すべての閲覧データが削除されます)。

ClearDataTypeSet

データ型のセット。プロパティが欠落している場合は、false と解釈されます。

プロパティ

  • appcache

    ブール値(省略可)

    ウェブサイト使用します。

  • キャッシュ

    ブール値(省略可)

    Chrome 44 以降

    Chrome 43 以降。 ブラウザのキャッシュ。注: データを削除すると、キャッシュ全体が消去されます。指定した範囲に限定されません。

  • Cookie

    ブール値(省略可)

    パーティションの Cookie。

  • fileSystems

    ブール値(省略可)

    ウェブサイトされます。

  • indexedDB

    ブール値(省略可)

    ウェブサイトIndexedDB データ。

  • localStorage

    ブール値(省略可)

    ウェブサイトローカル ストレージのデータです。

  • persistentCookies

    ブール値(省略可)

    Chrome 58 以降

    パーティションの永続的な Cookie。

  • sessionCookies

    ブール値(省略可)

    Chrome 58 以降

    パーティションのセッション Cookie。

  • webSQL

    ブール値(省略可)

    ウェブサイトWebSQL データ。

ContentScriptDetails

Chrome 44 以降

挿入するコンテンツ スクリプトの詳細。詳しくは、コンテンツ スクリプトのドキュメントをご覧ください。

プロパティ

  • all_frames

    ブール値(省略可)

    all_framestrue の場合は、現在のページのすべてのフレームに JavaScript または CSS を挿入する必要があることを意味します。デフォルトでは、all_framesfalse であり、JavaScript または CSS はトップフレームにのみ挿入されます。

  • css

    InjectionItems オプション

    一致するページに挿入される CSS コードまたは CSS ファイルのリストです。これらは、ページの DOM が構築または表示される前に、表示される順序で挿入されます。

  • exclude_globs

    文字列 [] 省略可

    一致した後に適用され、この glob に一致する URL を除外します。@exclude Greasemonkey キーワードをエミュレートすることを目的としています。

  • exclude_matches

    文字列 [] 省略可

    このコンテンツ スクリプトが挿入されるページは除外されます。

  • include_globs

    文字列 [] 省略可

    一致した後に適用されます。この glob に一致する URL のみが含まれます。@include Greasemonkey キーワードをエミュレートすることを目的としています。

  • JS

    InjectionItems オプション

    一致するページに挿入される JavaScript コードまたは JavaScript ファイルのリスト。これらは出現する順序で挿入されます。

  • match_about_blank

    ブール値(省略可)

    about:blank と about:srcdoc にコンテンツ スクリプトを挿入するかどうか。コンテンツ スクリプトがページに挿入されるのは、継承 URL が一致フィールドで宣言されたパターンのいずれかと一致した場合のみです。継承 URL は、フレームまたはウィンドウを作成したドキュメントの URL です。サンドボックス化されたフレームにはコンテンツ スクリプトを挿入できません。

  • 一致

    string[]

    このコンテンツ スクリプトを挿入するページを指定します。

  • name

    文字列

    挿入するコンテンツ スクリプトの名前。

  • run_at

    RunAt (省略可)

    JavaScript または CSS がタブに挿入される最も早い方法。デフォルトは「document_idle」です。

ContentWindow

ゲスト ウィンドウへのメッセージ ハンドル。

プロパティ

  • postMessage

    void

    埋め込みコンテンツにターゲットのオリジンのページが表示されている限り、埋め込みウェブ コンテンツにメッセージを投稿します。このメソッドは、ページの読み込みが完了すると利用できます。contentload イベントをリッスンし、メソッドを呼び出します。

    ゲストは、受信したメッセージ イベントで event.source にメッセージを投稿することで、埋め込み元に返信を送ることができます。

    この API は、ウェブページ間の通信に使用する HTML5 postMessage API と同じです。埋め込みでは、message イベント リスナーを自身のフレームに追加することで、返信をリッスンできます。

    postMessage 関数は次のようになります。

    (message: any, targetOrigin: string) => {...}

    • メッセージ

      任意

      ゲストに送信するメッセージ オブジェクト。

    • targetOrigin

      文字列

      イベントをディスパッチするために必要なゲスト ウィンドウの起点を指定します。

ContextMenuCreateProperties

Chrome 44 以降

プロパティ

  • ON

    ブール値(省略可)

    チェックボックスまたはラジオボタン アイテムの初期状態。選択した場合は true、選択されていない場合は false です。ラジオ アイテムの特定のグループでは、一度に 1 つのラジオ アイテムのみを選択できます。

  • コンテキスト

    [ContextType, ...ContextType[]] 省略可

    このメニュー項目が表示されるコンテキストのリスト。指定しない場合のデフォルトは ['page'] です。

  • documentUrlPatterns

    文字列 [] 省略可

    URL が指定したパターンのいずれかに一致するドキュメントのみに適用されるようにアイテムを制限できます。(これはフレームにも適用されます)。パターンの形式の詳細については、一致パターンをご覧ください。

  • 有効

    ブール値(省略可)

    このコンテキスト メニュー項目が有効か無効か。デフォルトは true です。

  • id

    文字列(省略可)

    このアイテムに割り当てる一意の ID。イベントページでは必須です。この拡張機能の別の ID と同じにすることはできません。

  • parentId

    string |数値(省略可)

    親メニュー項目の ID。これにより、そのアイテムは以前に追加されたアイテムの子になります。

  • targetUrlPatterns

    文字列 [] 省略可

    documentUrlPatterns に似ていますが、img/audio/video タグの src 属性とアンカータグの href に基づいてフィルタできます。

  • title

    文字列(省略可)

    アイテムに表示されるテキスト。type が「separator」である場合を除き、これは必須です。コンテキストが「selection」の場合、文字列内で %s を使用すると、選択したテキストを表示できます。たとえば、このパラメータの値が「Translate '%s'」の場合、宛先: Pig Latin」ユーザーが「cool」という単語を選択すると、その選択のコンテキスト メニュー項目は「Translate 'cool'」になります。To Pig Latin です

  • type

    ItemType省略可

    メニュー項目のタイプ。デフォルトは「normal」です指定しない場合は、次のようになります。

  • onclick

    void(省略可)

    メニュー項目がクリックされたときに呼び出される関数。

    onclick 関数は次のようになります。

    (info: OnClickData) => {...}

    • 情報

      クリックされたアイテムに関する情報とクリックが発生したコンテキスト。

ContextMenus

Chrome 44 以降

プロパティ

  • onShow

    Event<functionvoidvoid>

    この webview でコンテキスト メニューを表示する前に呼び出されます。event.preventDefault() を呼び出すことで、このコンテキスト メニューを無効にできます。

    onShow.addListener 関数は次のようになります。

    (callback: function) => {...}

    • callback

      関数

      callback パラメータは次のようになります。

      (event: object) => void

      • イベント

        オブジェクト

        • preventDefault

          void

          これを呼び出して、コンテキスト メニューが表示されないようにします。

          preventDefault 関数は次のようになります。

          () => {...}

  • create

    void

    新しいコンテキスト メニュー項目を作成します。作成中にエラーが発生した場合、作成コールバックが呼び出されるまではわかりません(詳細は runtime.lastError にあります)。

    create 関数は次のようになります。

    (createProperties: object, callback?: function) => {...}

    • createProperties

      オブジェクト

      アイテムの作成に使用されるプロパティ

    • callback

      関数(省略可)

      callback パラメータは次のようになります。

      () => void

    • 戻り値

      string |数値

      新しく作成されたアイテムの ID。

  • 削除

    void

    コンテキスト メニュー項目を削除します。

    remove 関数は次のようになります。

    (menuItemId: string | number, callback?: function) => {...}

    • menuItemId

      string |数値

      削除するコンテキスト メニュー項目の ID。

    • callback

      関数(省略可)

      callback パラメータは次のようになります。

      () => void

  • すべてを削除

    void

    この webview に追加されたコンテキスト メニュー項目をすべて削除します。

    removeAll 関数は次のようになります。

    (callback?: function) => {...}

    • callback

      関数(省略可)

      callback パラメータは次のようになります。

      () => void

  • update

    void

    以前に作成したコンテキスト メニュー項目を更新します。

    update 関数は次のようになります。

    (id: string | number, updateProperties: object, callback?: function) => {...}

    • id

      string |数値

      更新する商品アイテムの ID。

    • updateProperties

      オブジェクト

      更新するプロパティ。create 関数と同じ値を受け入れます。

    • callback

      関数(省略可)

      callback パラメータは次のようになります。

      () => void

ContextMenuUpdateProperties

Chrome 44 以降

プロパティ

  • ON

    ブール値(省略可)

    チェックボックスまたはラジオボタン アイテムの状態。選択された場合は true、選択されていない場合は false です。ラジオ アイテムの特定のグループでは、一度に 1 つのラジオ アイテムのみを選択できます。

  • コンテキスト

    [ContextType, ...ContextType[]] 省略可

    このメニュー項目が表示されるコンテキストのリスト。

  • documentUrlPatterns

    文字列 [] 省略可

    URL が指定したパターンのいずれかに一致するドキュメントのみに適用されるようにアイテムを制限できます。(これはフレームにも適用されます)。パターンの形式の詳細については、一致パターンをご覧ください。

  • 有効

    ブール値(省略可)

    このコンテキスト メニュー項目が有効か無効か。

  • parentId

    string |数値(省略可)

    親メニュー項目の ID。これにより、そのアイテムは以前に追加されたアイテムの子になります。注: アイテムを自身の子孫の子に変更することはできません。

  • targetUrlPatterns

    文字列 [] 省略可

    documentUrlPatterns に似ていますが、img/audio/video タグの src 属性とアンカータグの href に基づいてフィルタできます。

  • title

    文字列(省略可)

    アイテムに表示されるテキスト

  • type

    ItemType省略可

    メニュー項目のタイプ。

  • onclick

    void(省略可)

    メニュー項目がクリックされたときに呼び出される関数。

    onclick 関数は次のようになります。

    (info: OnClickData) => {...}

    • 情報

      クリックされたアイテムに関する情報とクリックが発生したコンテキスト。

ContextType

Chrome 44 以降

メニューが表示されるさまざまなコンテキスト。「all」を指定する他のすべてのコンテキストの組み合わせと同じになります。

列挙型

"all"

"ページ"

"frame"

"selection"

"リンク"

編集可能

"image"

「動画」

"audio"

DialogController

dialog DOM イベントにアタッチされたインターフェース。

プロパティ

  • キャンセル

    void

    ダイアログを拒否する。confirm または prompt のダイアログで [キャンセル] をクリックするのと同じです。

    cancel 関数は次のようになります。

    () => {...}

  • OK

    void

    ダイアログを受け入れます。alertconfirm、または prompt ダイアログで [OK] をクリックするのと同じです。

    ok 関数は次のようになります。

    (response?: string) => {...}

    • レスポンス

      文字列(省略可)

      prompt ダイアログを受け入れるときにゲストに提供するレスポンス文字列。

DownloadPermissionRequest

download permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • requestMethod

    文字列

    ダウンロード リクエストに関連付けられた HTTP リクエスト タイプ(GET など)。

  • URL

    文字列

    リクエストされたダウンロード URL。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。allow が呼び出されない場合、これがデフォルトの動作です。

    deny 関数は次のようになります。

    () => {...}

FileSystemPermissionRequest

filesystem permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • URL

    文字列

    ローカル ファイル システムへのアクセスをリクエストするフレームの URL。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。

    deny 関数は次のようになります。

    () => {...}

FindCallbackResults

検索リクエストのすべての結果が含まれます。

プロパティ

  • activeMatchOrdinal

    数値

    現在の一致番号の順序番号。

  • キャンセル済み

    ブール値

    この検索リクエストがキャンセルされたかどうかを示します。

  • numberOfMatches

    数値

    ページで searchText が一致した回数。

  • selectionRect

    画面座標でアクティブな一致を囲む長方形を記述します。

FindOptions

検索リクエストのオプション。

プロパティ

  • 後ろ

    ブール値(省略可)

    一致を逆順に検索するためのフラグ。デフォルト値は false です。

  • matchCase

    ブール値(省略可)

    大文字と小文字を区別するフラグ。デフォルト値は false です。

FullscreenPermissionRequest

Chrome 43 以降

fullscreen permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • オリジン

    文字列

    全画面リクエストを開始した webview 内のフレームの起点。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。

    deny 関数は次のようになります。

    () => {...}

GeolocationPermissionRequest

geolocation permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • URL

    文字列

    位置情報データへのアクセスをリクエストするフレームの URL。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。allow が呼び出されない場合、これがデフォルトの動作です。

    deny 関数は次のようになります。

    () => {...}

HidPermissionRequest

Chrome 125 以降

hid permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • URL

    文字列

    HID API へのアクセスをリクエストするフレームの URL。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。allow が呼び出されない場合、これがデフォルトの動作です。

    deny 関数は次のようになります。

    () => {...}

InjectDetails

挿入するスクリプトまたは CSS の詳細。コードまたはファイル プロパティのどちらかを設定する必要がありますが、両方を同時に設定することはできません。

プロパティ

  • コード

    文字列(省略可)

    挿入する JavaScript または CSS コード。

    警告: code パラメータを使用する際は注意が必要です。使い方を誤ると、アプリがクロスサイト スクリプティング攻撃を受ける恐れがあります。

  • あなた宛てに表示されます。

    文字列(省略可)

    挿入する JavaScript または CSS ファイル。

InjectionItems

Chrome 44 以降

インジェクション アイテムのタイプ(コードまたはファイルのセット)。

プロパティ

  • コード

    文字列(省略可)

    一致するページに挿入される JavaScript コードまたは CSS。

  • ファイル

    文字列 [] 省略可

    一致するページに挿入される JavaScript ファイルまたは CSS ファイルのリスト。これらはこの配列に出現する順序で挿入されます。

LoadPluginPermissionRequest

loadplugin permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • identifier

    文字列

    プラグインの識別子文字列。

  • name

    文字列

    プラグインの表示名。

  • allow

    void

    権限のリクエストを許可します。これは、deny を呼び出さなかった場合のデフォルトの動作です。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。

    deny 関数は次のようになります。

    () => {...}

MediaPermissionRequest

media permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • URL

    文字列

    ユーザーのメディアへのアクセスをリクエストするフレームの URL。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。allow が呼び出されない場合、これがデフォルトの動作です。

    deny 関数は次のようになります。

    () => {...}

NewWindow

newwindow DOM イベントにアタッチされたインターフェース。

プロパティ

  • アタッチする

    void

    リクエストされたターゲット ページを既存の webview 要素に追加します。

    attach 関数は次のようになります。

    (webview: object) => {...}

    • WebView

      オブジェクト

      ターゲット ページを付加する webview 要素です。

  • 破棄

    void

    新しいウィンドウ リクエストをキャンセルします。

    discard 関数は次のようになります。

    () => {...}

PointerLockPermissionRequest

pointerLock permissionrequest DOM イベントを伴う request オブジェクトの型。

プロパティ

  • lastUnlockedBySelf

    ブール値

    リクエストしているフレームが、ポインタロックを保持する最新のクライアントであったかどうか。

  • URL

    文字列

    ポインタのロックをリクエストしているフレームの URL。

  • userGesture

    ブール値

    ユーザー入力操作の結果としてポインタのロックがリクエストされたかどうか。

  • allow

    void

    権限のリクエストを許可します。

    allow 関数は次のようになります。

    () => {...}

  • 拒否

    void

    権限のリクエストを拒否する。allow が呼び出されない場合、これがデフォルトの動作です。

    deny 関数は次のようになります。

    () => {...}

SelectionRect

画面座標で長方形を記述します。

包含セマンティクスは配列に似ています。つまり、座標 (left, top) は長方形の内部に含まれているとみなされますが、座標 (left + width, top) は内部に含まれていません。

プロパティ

  • height

    数値

    長方形の高さ。

  • 数値

    画面の左端から長方形の左端までの距離。

  • 数値

    画面の上端から長方形の上端までの距離。

  • 数値

    長方形の幅。

WebRequestEventInterface

Chrome 44 以降

ゲストページの webRequest イベントへのアクセスを可能にするインターフェース。webRequest のライフサイクルと関連概念について詳しくは、chrome.webRequest 拡張機能 API をご覧ください。注: chrome.webRequest.onActionIgnored イベントは WebView ではサポートされていません。

拡張機能の webRequest API と使用方法の違いを説明するために、*://www.evil.com/* に一致する URL に対するゲスト リクエストをブロックする次のサンプルコードについて考えてみましょう。

webview.request.onBeforeRequest.addListener(
  function(details) { return {cancel: true}; },
  {urls: ["*://www.evil.com/*"]},
  ["blocking"]);

また、このインターフェースは onRequest イベントと onMessage イベントによる宣言型 webRequest ルールをサポートしています。API の詳細については、declarativeWebRequest をご覧ください。

宣言型の WebView の webRequest の条件とアクションは、chrome.webViewRequest.* からインスタンス化する必要があります。次のサンプルコードは、WebView myWebview"example.com" へのすべてのリクエストを宣言的にブロックします。

var rule = {
  conditions: [
    new chrome.webViewRequest.RequestMatcher({ url: { hostSuffix: 'example.com' } })
  ],
  actions: [ new chrome.webViewRequest.CancelRequest() ]
};
myWebview.request.onRequest.addRules([rule]);

ZoomMode

Chrome 43 以降

webview でのズームの処理方法を定義します。

列挙型

"per-origin"
ズームの変更は、ズームしたページの原点に維持されます。つまり、同じパーティション内の、同じ原点に移動する他のすべての WebView もズームされます。さらに、per-origin ズームの変更は原点で保存されます。つまり、同じ原点の他のページに移動するときに、すべて同じズーム倍率にズームされます。

"per-view"
ズームの変更はこの WebView でのみ有効で、他の WebView でのズームの変更は、この WebView のズームには影響しません。また、ナビゲーション時に per-view のズーム変更がリセットされます。WebView を操作すると、常に(パーティションのスコープ範囲内)オリジンごとのズーム倍率でページが読み込まれます。

"disabled"
WebView のすべてのズームを無効にします。コンテンツはデフォルトのズームレベルに戻り、試行したズーム変更はすべて無視されます。

プロパティ

contentWindow

ゲストページにメッセージを投稿するために使用できるオブジェクト参照。

タイプ

contextMenus

Chrome 44 以降

Chrome の ContextMenus API に似ていますが、ブラウザではなく webview に適用されます。webview.contextMenus API を使用して、webview のコンテキスト メニューにアイテムを追加します。画像、ハイパーリンク、ページなど、コンテキスト メニューの追加を適用するオブジェクトの種類を選択できます。

タイプ

request

ゲストページの webRequest イベントへのアクセスを可能にするインターフェース。

メソッド

addContentScripts()

Chrome 44 以降
chrome.webviewTag.addContentScripts(
  contentScriptList: [ContentScriptDetails, ...ContentScriptDetails[]],
)

webview にコンテンツ スクリプトの挿入ルールを追加します。1 つ以上のルールに一致するページに webview が移動すると、関連するスクリプトが挿入されます。ルールをプログラマティックに追加したり、既存のルールを更新したりできます。

次の例では、2 つのルール「myRule」を webview に追加しています。「別のルール」があります。

webview.addContentScripts([
  {
    name: 'myRule',
    matches: ['http://www.foo.com/*'],
    css: { files: ['mystyles.css'] },
    js: { files: ['jquery.js', 'myscript.js'] },
    run_at: 'document_start'
  },
  {
    name: 'anotherRule',
    matches: ['http://www.bar.com/*'],
    js: { code: "document.body.style.backgroundColor = 'red';" },
    run_at: 'document_end'
  }]);
 ...

// Navigates webview.
webview.src = 'http://www.foo.com';

スクリプトの挿入が必要になるまで、addContentScripts の呼び出しを延期できます。

次の例は、既存のルールを上書きする方法を示しています。

webview.addContentScripts([{
    name: 'rule',
    matches: ['http://www.foo.com/*'],
    js: { files: ['scriptA.js'] },
    run_at: 'document_start'}]);

// Do something.
webview.src = 'http://www.foo.com/*';
 ...
// Overwrite 'rule' defined before.
webview.addContentScripts([{
    name: 'rule',
    matches: ['http://www.bar.com/*'],
    js: { files: ['scriptB.js'] },
    run_at: 'document_end'}]);

webview がオリジン(foo.com など)にナビゲーションされ、webview.addContentScripts を呼び出して「myRule」を追加している場合は、次のナビゲーションでスクリプトが挿入されるまで待つ必要があります。即時のインジェクションが必要な場合、executeScript が適切な処理を行います。

ゲストプロセスがクラッシュしたり、強制終了されたりした場合や、webview の親が変更された場合でも、ルールは保持されます。

詳しくは、コンテンツ スクリプトのドキュメントをご覧ください。

パラメータ

back()

chrome.webviewTag.back(
  callback?: function,
)

可能であれば、履歴エントリを 1 つ遡って移動します。go(-1) と同じです。

パラメータ

  • callback

    関数(省略可)

    Chrome 44 以降

    callback パラメータは次のようになります。

    (success: boolean) => void

    • success

      ブール値

      ナビゲーションが成功したかどうかを示します。

canGoBack()

chrome.webviewTag.canGoBack()

履歴内をさかのぼって移動できるかどうかを示します。この関数の状態は、各 loadcommit の前にキャッシュされ、更新されるため、loadcommit 上で呼び出すのが最適です。

戻り値

  • ブール値

canGoForward()

chrome.webviewTag.canGoForward()

履歴内を移動できるかどうかを表します。この関数の状態は、各 loadcommit の前にキャッシュされ、更新されるため、loadcommit 上で呼び出すのが最適です。

戻り値

  • ブール値

captureVisibleRegion()

Chrome 50 以降
chrome.webviewTag.captureVisibleRegion(
  options?: ImageDetails,
  callback: function,
)

WebView の可視領域を取得します。

パラメータ

  • オプション

    ImageDetails 省略可

  • callback

    関数

    callback パラメータは次のようになります。

    (dataUrl: string) => void

    • dataUrl

      文字列

      キャプチャしたタブの表示領域の画像をエンコードしたデータ URL。'src' に割り当てることができる。プロパティを使用して、表示用の HTML 画像要素のプロパティを指定します。

clearData()

chrome.webviewTag.clearData(
  options: ClearDataOptions,
  types: ClearDataTypeSet,
  callback?: function,
)

webview パーティションの閲覧データを削除します。

パラメータ

  • オプション

    消去するデータを決定するオプション。

  • タイプ

    消去するデータの種類。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    () => void

executeScript()

chrome.webviewTag.executeScript(
  details: InjectDetails,
  callback?: function,
)

ゲストページに JavaScript コードを挿入します。

次のサンプルコードでは、スクリプト挿入を使用して、ゲストページの背景色を赤に設定しています。

webview.executeScript({ code: "document.body.style.backgroundColor = 'red'" });

パラメータ

  • 詳細

    実行するスクリプトの詳細。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    (result?: any[]) => void

    • 件の結果

      any[] 省略可

      挿入されたすべてのフレーム内のスクリプトの結果。

find()

chrome.webviewTag.find(
  searchText: string,
  options?: FindOptions,
  callback?: function,
)

ページ内検索リクエストを開始します。

パラメータ

  • searchText

    文字列

    ページ内で検索する文字列。

  • オプション

    FindOptions オプション

    検索リクエストのオプション。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    (results?: FindCallbackResults) => void

    • 結果

      FindCallbackResults オプション

      検索リクエストのすべての結果が含まれます。results は、コールバック関数の本文で使用しない場合は省略できます。たとえば、検索リクエストが完了したタイミングを識別するためにコールバックのみを使用する場合などです。

forward()

chrome.webviewTag.forward(
  callback?: function,
)

可能であれば、1 つ前の履歴エントリに移動します。go(1) と同じです。

パラメータ

  • callback

    関数(省略可)

    Chrome 44 以降

    callback パラメータは次のようになります。

    (success: boolean) => void

    • success

      ブール値

      ナビゲーションが成功したかどうかを示します。

getAudioState()

Chrome 62 以降
chrome.webviewTag.getAudioState(
  callback: function,
)

オーディオの状態をクエリします。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (audible: boolean) => void

    • Audible

      ブール値

getProcessId()

chrome.webviewTag.getProcessId()

ゲストウェブページの現在のプロセスに関する Chrome の内部プロセス ID を返します。これにより、埋め込み者はプロセスを終了することで影響を受けるゲストの数を知ることができます。2 つのゲストは同じアプリに属し、同じストレージ パーティション ID を持つ場合にのみ、プロセスを共有します。この呼び出しは同期的であり、エンべディングがキャッシュした現在のプロセス ID の概念を返します。プロセス ID は、オペレーティング システムのプロセス ID とは異なります。

戻り値

  • 数値

getUserAgent()

chrome.webviewTag.getUserAgent()

ゲストページのリクエスト用に webview で使用されるユーザー エージェント文字列を返します。

戻り値

  • 文字列

getZoom()

chrome.webviewTag.getZoom(
  callback: function,
)

現在のズーム倍率を取得します。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (zoomFactor: number) => void

    • zoomFactor

      数値

      現在のズーム倍率。

getZoomMode()

Chrome 43 以降
chrome.webviewTag.getZoomMode(
  callback: function,
)

現在のズームモードを取得します。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (ZoomMode: ZoomMode) => void

    • ZoomMode

      webview の現在のズームモード。

go()

chrome.webviewTag.go(
  relativeIndex: number,
  callback?: function,
)

現在のナビゲーションに関連する履歴インデックスを使用して、履歴エントリに移動します。リクエストされたナビゲーションが不可能な場合、このメソッドは効力がありません。

パラメータ

  • relativeIndex

    数値

    webview の移動先の相対履歴インデックス。たとえば、値 2 を指定すると、可能であれば 2 つの履歴エントリに移動します。値 -3 は、3 つ前のエントリに移動します。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    (success: boolean) => void

    • success

      ブール値

      ナビゲーションが成功したかどうかを示します。

insertCSS()

chrome.webviewTag.insertCSS(
  details: InjectDetails,
  callback?: function,
)

CSS をゲストページに挿入します。

パラメータ

  • 詳細

    挿入する CSS の詳細。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    () => void

isAudioMuted()

Chrome 62 以降
chrome.webviewTag.isAudioMuted(
  callback: function,
)

音声がミュートされているかどうかを問い合わせます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (muted: boolean) => void

    • ミュート中

      ブール値

isSpatialNavigationEnabled()

Chrome 71 以降
chrome.webviewTag.isSpatialNavigationEnabled(
  callback: function,
)

WebView で空間ナビゲーションが有効かどうかをクエリします。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (enabled: boolean) => void

    • 有効

      ブール値

isUserAgentOverridden()

chrome.webviewTag.isUserAgentOverridden()

webview のユーザー エージェント文字列が webviewTag.setUserAgentOverride によってオーバーライドされているかどうかを示します。

loadDataWithBaseUrl()

chrome.webviewTag.loadDataWithBaseUrl(
  dataUrl: string,
  baseUrl: string,
  virtualUrl?: string,
)

相対リンクに使用される指定されたベース URL を持つデータ URL を読み込みます。必要に応じて、データの URL の代わりに仮想 URL を指定して、ユーザーに表示することができます。

パラメータ

  • dataUrl

    文字列

    読み込むデータの URL。

  • baseUrl

    文字列

    相対リンクに使用されるベース URL。

  • virtualUrl

    文字列(省略可)

    ユーザーに表示される URL(アドレスバー内)。

print()

chrome.webviewTag.print()

webview の内容を出力します。これは、webview 自体からスクリプトによる出力関数を呼び出すことと同等です。

reload()

chrome.webviewTag.reload()

現在のトップレベル ページを再読み込みします。

removeContentScripts()

Chrome 44 以降
chrome.webviewTag.removeContentScripts(
  scriptNameList?: string[],
)

webview からコンテンツ スクリプトを削除します。

次の例では、「myRule」という先ほど追加されたファイルです

webview.removeContentScripts(['myRule']);

次の呼び出しを行うと、すべてのルールを削除できます。

webview.removeContentScripts();

パラメータ

  • scriptNameList

    文字列 [] 省略可

    削除されるコンテンツ スクリプトの名前のリスト。リストが空の場合、webview に追加されたすべてのコンテンツ スクリプトが削除されます。

setAudioMuted()

Chrome 62 以降
chrome.webviewTag.setAudioMuted(
  mute: boolean,
)

WebView の音声ミュート状態を設定します。

パラメータ

  • ミュート

    ブール値

    ミュート音声の値

setSpatialNavigationEnabled()

Chrome 71 以降
chrome.webviewTag.setSpatialNavigationEnabled(
  enabled: boolean,
)

WebView の空間ナビゲーション状態を設定します。

パラメータ

  • 有効

    ブール値

    空間ナビゲーションの状態の値。

setUserAgentOverride()

chrome.webviewTag.setUserAgentOverride(
  userAgent: string,
)

ゲストページのリクエスト用に webview で使用されるユーザー エージェント文字列をオーバーライドします。オーバーライドすると、このオーバーライドが適用されるゲストページ リクエストの場合、User-Agent Client Hints のヘッダー値と navigator.userAgentData から返される値は空になります。

パラメータ

  • userAgent

    文字列

    使用するユーザー エージェント文字列。

setZoom()

chrome.webviewTag.setZoom(
  zoomFactor: number,
  callback?: function,
)

ページのズーム倍率を変更します。この変更の範囲と永続性は、WebView の現在のズームモードによって決まります(webviewTag.ZoomMode を参照)。

パラメータ

  • zoomFactor

    数値

    新しいズーム倍率です。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    () => void

setZoomMode()

Chrome 43 以降
chrome.webviewTag.setZoomMode(
  ZoomMode: ZoomMode,
  callback?: function,
)

webview のズームモードを設定します。

パラメータ

  • ZoomMode

    webview でのズームの処理方法を定義します。

  • callback

    関数(省略可)

    callback パラメータは次のようになります。

    () => void

stop()

chrome.webviewTag.stop()

進行中の場合は、現在の webview ナビゲーションの読み込みを停止します。

stopFinding()

chrome.webviewTag.stopFinding(
  action?: "clear"
 | "keep"
 | "activate"
,
)

現在の検索セッションを終了(ハイライト表示をすべてクリア)し、進行中のすべての検索リクエストをキャンセルします。

パラメータ

  • アクション

    "クリア"
     |"keep"
     |"activate"
     省略可

    検索セッションが終了した後のアクティブな一致の処理方法を指定します。clear は、アクティブな一致のハイライト表示をクリアします。keep ではアクティブな一致がハイライト表示されたままになります。activate はアクティブな一致がハイライト表示されたままで、ユーザーがその一致でクリックしたときをシミュレートします。デフォルトのアクションは keep です。

terminate()

chrome.webviewTag.terminate()

ゲストウェブページのレンダラ プロセスを強制的に強制終了します。同じプロセスを共有している場合、現在のアプリの複数の webview タグに影響する可能性がありますが、他のアプリの webview タグには影響しません。

イベント

close

chrome.webviewTag.close.addListener(
  callback: function,
)

ゲスト ウィンドウが自身を閉じようとしたときに呼び出されます。

次のサンプルコードは、ゲストが自身を閉じようとしたときに、webviewabout:blank に移動します。

webview.addEventListener('close', function() {
  webview.src = 'about:blank';
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    () => void

consolemessage

chrome.webviewTag.consolemessage.addListener(
  callback: function,
)

ゲスト ウィンドウがコンソール メッセージをログに記録するときに呼び出されます。

次のサンプルコードは、ログレベルやその他のプロパティに関係なく、すべてのログ メッセージを埋め込みユーザーのコンソールに転送します。

webview.addEventListener('consolemessage', function(e) {
  console.log('Guest page logged a message: ', e.message);
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (level: number, message: string, line: number, sourceId: string) => void

    • level

      数値

    • メッセージ

      文字列

    • 数値

    • sourceId

      文字列

contentload

chrome.webviewTag.contentload.addListener(
  callback: function,
)

ゲスト ウィンドウが load イベントを発生させたとき(新しいドキュメントが読み込まれたとき)に呼び出されます。これには、現在のドキュメント内のページ ナビゲーションや非同期リソースの読み込みは含まれません

次のサンプルコードは、ページの読み込み後にゲストの body 要素のデフォルトのフォントサイズを変更します。

webview.addEventListener('contentload', function() {
  webview.executeScript({ code: 'document.body.style.fontSize = "42px"' });
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    () => void

dialog

chrome.webviewTag.dialog.addListener(
  callback: function,
)

ゲスト ウィンドウが window.alertwindow.confirm、または window.prompt を介してモーダル ダイアログを開こうとすると呼び出されます。

このイベントを処理すると、各イベント リスナーが返されるか、dialog オブジェクトにアクセスできなくなる(preventDefault() が呼び出された場合)まで、ゲストプロセスがブロックされます。

デフォルトの動作では、ダイアログはキャンセルされます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (messageType: "alert" 
     | "confirm"
     | "prompt"
    , messageText: string, dialog: DialogController) => void

    • messageType

      「アラート」
       |"確定"
       |「prompt」

    • messageText

      文字列

    • ダイアログ

exit

chrome.webviewTag.exit.addListener(
  callback: function,
)

ゲストウェブ コンテンツをレンダリングするプロセスが終了したときに呼び出されます。

次のサンプルコードは、ゲストページがクラッシュするたびに終了メッセージを表示します。

webview.addEventListener('exit', function(e) {
  if (e.reason === 'crash') {
    webview.src = 'data:text/plain,Goodbye, world!';
  }
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (processID: number, reason: "normal" 
     | "abnormal"
     | "crash"
     | "kill"
    ) => void

    • processID

      数値

    • reason

      "normal"
       |"abnormal"
       |"crash"
       |「kill」

findupdate

chrome.webviewTag.findupdate.addListener(
  callback: function,
)

アクティブな検索リクエストに対して新しい検索結果が利用可能になったときに呼び出されます。一致が見つかった場合、1 回の検索リクエストで複数回発生することがあります。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (searchText: string, numberOfMatches: number, activeMatchOrdinal: number, selectionRect: SelectionRect, canceled: boolean, finalUpdate: string) => void

    • searchText

      文字列

    • numberOfMatches

      数値

    • activeMatchOrdinal

      数値

    • selectionRect
    • キャンセル済み

      ブール値

    • finalUpdate

      文字列

loadabort

chrome.webviewTag.loadabort.addListener(
  callback: function,
)

トップレベルの読み込みが commit せずに中止されたときに呼び出されます。イベントがデフォルトでブロックされていない限り、エラー メッセージがコンソールに出力されます。

注: リソースの読み込みが中断されると、最後の loadstop イベント(存在する場合)以降に commit された読み込みがすべて中止された場合でも、最終的に loadabort イベントの後に loadstop イベントが発生します。

注: 概要の URL または JavaScript の URL の読み込みが中断されると、loadabort が起動し、その後 webview が「about:blank」に移動します。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (url: string, isTopLevel: boolean, code: number, reason: "ERR_ABORTED" 
     | "ERR_INVALID_URL"
     | "ERR_DISALLOWED_URL_SCHEME"
     | "ERR_BLOCKED_BY_CLIENT"
     | "ERR_ADDRESS_UNREACHABLE"
     | "ERR_EMPTY_RESPONSE"
     | "ERR_FILE_NOT_FOUND"
     | "ERR_UNKNOWN_URL_SCHEME"
    ) => void

    • URL

      文字列

    • isTopLevel

      ブール値

    • コード

      数値

    • reason

      「ERR_ABORTED」
       |&quot;ERR_INVALID_URL&quot;
       |&quot;ERR_DISALLOWED_URL_SCHEME&quot;
       |&quot;ERR_BLOCKED_BY_CLIENT&quot;
       |「ERR_ADDRESS_UNREACHABLE」
       |&quot;ERR_EMPTY_RESPONSE&quot;
       |&quot;ERR_FILE_NOT_FOUND&quot;
       |&quot;ERR_UNKNOWN_URL_SCHEME&quot;

loadcommit

chrome.webviewTag.loadcommit.addListener(
  callback: function,
)

読み込みが commit されると呼び出されます。これには、現在のドキュメント内のナビゲーションとサブフレームのドキュメント レベルの読み込みが含まれますが、非同期のリソース読み込みは含まれません

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (url: string, isTopLevel: boolean) => void

    • URL

      文字列

    • isTopLevel

      ブール値

loadredirect

chrome.webviewTag.loadredirect.addListener(
  callback: function,
)

トップレベルの読み込みリクエストが別の URL にリダイレクトされたときに呼び出されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (oldUrl: string, newUrl: string, isTopLevel: boolean) => void

    • oldUrl

      文字列

    • newUrl

      文字列

    • isTopLevel

      ブール値

loadstart

chrome.webviewTag.loadstart.addListener(
  callback: function,
)

読み込みが開始されると呼び出されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (url: string, isTopLevel: boolean) => void

    • URL

      文字列

    • isTopLevel

      ブール値

loadstop

chrome.webviewTag.loadstop.addListener(
  callback: function,
)

ゲストページでのフレームレベルの読み込み(すべてのサブフレームを含む)が完了すると呼び出されます。これには、現在のドキュメント内のナビゲーションとサブフレームのドキュメント レベルの読み込みが含まれますが、非同期のリソース読み込みは含まれません。このイベントは、ドキュメント レベルの読み込み回数が 1 回(またはそれ以上)から 0 に遷移するたびに発生します。たとえば、読み込みがすでに完了しているページ(つまり、loadstop がすでに 1 回呼び出されている)は、ページを読み込む新しい iframe を作成し、iframe ページの読み込みが完了すると 2 つ目の loadstop が呼び出されます。このパターンは、広告を読み込むページでよく発生します。

注:commit された読み込みが中止されると、最後の loadstop イベント(ある場合)以降の commit 済み読み込みがすべて中止された場合でも、最終的に loadabort イベントに続いて loadstop イベントが発生します。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    () => void

newwindow

chrome.webviewTag.newwindow.addListener(
  callback: function,
)

ゲストページが新しいブラウザ ウィンドウを開こうとしたときに呼び出されます。

次のサンプルコードは、リクエストされた新しいウィンドウごとに、エンべディングで新しい webview を作成してナビゲーションします。

webview.addEventListener('newwindow', function(e) {
  var newWebview = document.createElement('webview');
  document.body.appendChild(newWebview);
  e.window.attach(newWebview);
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (window: NewWindow, targetUrl: string, initialWidth: number, initialHeight: number, name: string, windowOpenDisposition: "ignore" 
     | "save_to_disk"
     | "current_tab"
     | "new_background_tab"
     | "new_foreground_tab"
     | "new_window"
     | "new_popup"
    ) => void

    • targetUrl

      文字列

    • initialWidth

      数値

    • initialHeight

      数値

    • name

      文字列

    • windowOpenDisposition

      「無視」
       |"save_to_disk"
       |"current_tab"
       |&quot;new_background_tab&quot;
       |"new_foreground_tab"
       |"new_window"
       |"new_popup"

permissionrequest

chrome.webviewTag.permissionrequest.addListener(
  callback: function,
)

ゲストページが埋め込み機能から特別な権限をリクエストする必要がある場合に呼び出されます。

次のサンプルコードは、ゲストページに webkitGetUserMedia API へのアクセス権を付与します。なお、このコード例を使用するアプリ自体で、マニフェスト権限 audioCapture または videoCapture を指定する必要があります。

webview.addEventListener('permissionrequest', function(e) {
  if (e.permission === 'media') {
    e.request.allow();
  }
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (permission: "media" 
     | "geolocation"
     | "pointerLock"
     | "download"
     | "loadplugin"
     | "filesystem"
     | "fullscreen"
     | "hid"
    , request: object) => void

    • 権限

      「メディア」
       |"位置情報"
       |"pointerLock"
       |"ダウンロード"
       |"loadplugin"
       |"filesystem"
       |"全画面"
       |"hid"

    • request

      オブジェクト

responsive

chrome.webviewTag.responsive.addListener(
  callback: function,
)

ゲストウェブ コンテンツをレンダリングするプロセスが応答しなくなり、応答するようになったときに呼び出されます。

次のサンプルコードでは、webview 要素がレスポンシブになるか、応答しなくなると、その要素がフェードインまたはフェードアウトします。

webview.style.webkitTransition = 'opacity 250ms';
webview.addEventListener('unresponsive', function() {
  webview.style.opacity = '0.5';
});
webview.addEventListener('responsive', function() {
  webview.style.opacity = '1';
});

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (processID: number) => void

    • processID

      数値

sizechanged

chrome.webviewTag.sizechanged.addListener(
  callback: function,
)

埋め込みウェブ コンテンツが autosize によってサイズ変更されたときに呼び出されます。autosize が有効になっている場合にのみ呼び出されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (oldWidth: number, oldHeight: number, newWidth: number, newHeight: number) => void

    • oldWidth

      数値

    • oldHeight

      数値

    • newWidth

      数値

    • newHeight

      数値

unresponsive

chrome.webviewTag.unresponsive.addListener(
  callback: function,
)

ゲストウェブ コンテンツをレンダリングするプロセスが応答しなくなったときに呼び出されます。ゲストが再び応答を開始すると、このイベントは一致するレスポンシブ イベントとともに 1 回生成されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (processID: number) => void

    • processID

      数値

zoomchange

chrome.webviewTag.zoomchange.addListener(
  callback: function,
)

ページのズームが変更されたときに呼び出されます。

パラメータ

  • callback

    関数

    callback パラメータは次のようになります。

    (oldZoomFactor: number, newZoomFactor: number) => void

    • oldZoomFactor

      数値

    • newZoomFactor

      数値