webFrame

現在のウェブページのレンダリングをカスタマイズします。

プロセス: レンダラー

ElectronモジュールのwebFrameエクスポートは、現在のフレームを表すWebFrameクラスのインスタンスです。 サブフレームは、特定のプロパティとメソッド（例：webFrame.firstChild）によって取得できます。

現在のページを200％にズームする例。

const { webFrame } = require('electron')

webFrame.setZoomFactor(2)

メソッド

WebFrameクラスには、次のインスタンスメソッドがあります。

webFrame.setZoomFactor(factor)

• factor 倍精度浮動小数点数 - ズーム係数。デフォルトは1.0です。

ズーム係数を指定された係数に変更します。 ズーム係数はズーム率を100で割った値なので、300％= 3.0です。

係数は0.0より大きい必要があります。

webFrame.getZoomFactor()

戻り値 number - 現在のズーム係数。

webFrame.setZoomLevel(level)

• level 数値 - ズームレベル。

ズームレベルを指定されたレベルに変更します。元のサイズは0で、それより上または下の各増分は、それぞれ元のサイズの300％と50％のデフォルト制限まで20％大きくまたは小さくズームすることを表します。

**注**: Chromiumレベルのズームポリシーは同一オリジンです。つまり、特定のドメインのズームレベルは、同じドメインを持つウィンドウのすべてのインスタンスに伝播します。 ウィンドウのURLを区別すると、ウィンドウごとにズームが機能するようになります。

webFrame.getZoomLevel()

戻り値 number - 現在のズームレベル。

webFrame.setVisualZoomLevelLimits(minimumLevel, maximumLevel)

• minimumLevel 数値
• maximumLevel 数値

ピンチトゥズームの最大レベルと最小レベルを設定します。

**注**: ビジュアルズームはElectronではデフォルトで無効になっています。 再度有効にするには、次を呼び出します

webFrame.setVisualZoomLevelLimits(1, 3)

**注**: ビジュアルズームは、ピンチトゥズームの動作にのみ適用されます。 Cmd +/-/0ズームショートカットは、アプリケーションメニューの「zoomIn」、「zoomOut」、および「resetZoom」MenuItemロールによって制御されます。 ショートカットを無効にするには、メニューを手動で定義し、定義からズームロールを省略します。

webFrame.setSpellCheckProvider(language, provider)

• language 文字列
• provider オブジェクト
  • spellCheck 関数
    • words string[]
    • callback 関数
      • misspeltWords string[]

入力フィールドとテキストエリアのスペルチェックのプロバイダーを設定します。

このメソッドを使用する場合は、ウィンドウを構築するときに組み込みのスペルチェッカーを無効にする必要があります。

const mainWindow = new BrowserWindow({
  webPreferences: {
    spellcheck: false
  }
})

providerは、スペルチェックのために個々の単語の配列を受け入れるspellCheckメソッドを持つオブジェクトである必要があります。 spellCheck関数は非同期で実行され、完了するとスペルミスの単語の配列を使用してcallback関数を呼び出します。

node-spellcheckerをプロバイダーとして使用例

const { webFrame } = require('electron')
const spellChecker = require('spellchecker')
webFrame.setSpellCheckProvider('en-US', {
  spellCheck (words, callback) {
    setTimeout(() => {
      const misspelled = words.filter(x => spellchecker.isMisspelled(x))
      callback(misspelled)
    }, 0)
  }
})

webFrame.insertCSS(css[, options])

• css 文字列
• options オブジェクト (オプション)
  • cssOrigin 文字列 (オプション) - 'user'または'author'を指定できます。挿入されたスタイルシートのカスケードオリジンを設定します。 デフォルトは 'author'です。

戻り値 string - 後でwebFrame.removeInsertedCSS(key)を介してCSSを削除するために使用できる、挿入されたCSSのキー。

現在のウェブページにCSSを挿入し、挿入されたスタイルシートの一意のキーを返します。

webFrame.removeInsertedCSS(key)

• key 文字列

現在のウェブページから挿入されたCSSを削除します。スタイルシートは、webFrame.insertCSS(css)から返されるキーによって識別されます。

webFrame.insertText(text)

• text 文字列

フォーカスされている要素にtextを挿入します。

webFrame.executeJavaScript(code[, userGesture, callback])

• code 文字列
• userGesture 真偽値 (オプション) - デフォルトはfalseです。
• callback 関数 (オプション) - スクリプトが実行された後に呼び出されます。 フレームが中断されている場合（モーダルアラートが表示されている場合など）を除き、実行は同期され、メソッドが戻る前にコールバックが呼び出されます。 このメソッドの古いバージョンとの互換性のために、エラーパラメータは2番目です。
  • result 任意
  • error エラー

戻り値 Promise<any> - 実行されたコードの結果で解決されるか、実行がスローされた場合、または拒否されたPromiseになった場合に拒否されるPromise。

ページでcodeを評価します。

ブラウザウィンドウでは、requestFullScreenなどの一部のHTML APIは、ユーザーのジェスチャによってのみ呼び出すことができます。 userGestureをtrueに設定すると、この制限が解除されます。

webFrame.executeJavaScriptInIsolatedWorld(worldId, scripts[, userGesture, callback])

• worldId 整数 - javascriptを実行するワールドのID。0はデフォルトのメインワールド（コンテンツが実行される場所）、999はElectronのcontextIsolation機能で使用されるワールドです。 1..536870911の範囲の値を受け入れます。
• scripts WebSource[]
• userGesture 真偽値 (オプション) - デフォルトはfalseです。
• callback 関数 (オプション) - スクリプトが実行された後に呼び出されます。 フレームが中断されている場合（モーダルアラートが表示されている場合など）を除き、実行は同期され、メソッドが戻る前にコールバックが呼び出されます。 このメソッドの古いバージョンとの互換性のために、エラーパラメータは2番目です。
  • result 任意
  • error エラー

戻り値 Promise<any> - 実行されたコードの結果で解決されるか、実行を開始できなかった場合に拒否されるPromise。

executeJavaScriptと同様に機能しますが、隔離されたコンテキストでscriptsを評価します。

スクリプトの実行に失敗した場合、返されたpromiseは拒否されず、resultはundefinedになります。これは、Chromiumが隔離されたワールドのエラーを外部のワールドにディスパッチしないためです。

webFrame.setIsolatedWorldInfo(worldId, info)

• worldId 整数 - javascriptを実行するワールドのID。0はデフォルトのワールド、999はElectronsのcontextIsolation機能で使用されるワールドです。 Chrome拡張機能は、[1 << 20, 1 << 29)の範囲のIDを予約しています。 ここに任意の整数を指定できます。
• info オブジェクト
  • securityOrigin 文字列 (オプション) - 隔離されたワールドのセキュリティオリジン。
  • csp 文字列 (オプション) - 隔離されたワールドのコンテンツセキュリティポリシー。
  • name 文字列 (オプション) - 隔離されたワールドの名前。 devtoolsで役立ちます。

隔離されたワールドのセキュリティオリジン、コンテンツセキュリティポリシー、および名前を設定します。注：cspが指定されている場合は、securityOriginも指定する必要があります。

webFrame.getResourceUsage()

戻り値 Object

• images MemoryUsageDetails
• scripts MemoryUsageDetails
• cssStyleSheets MemoryUsageDetails
• xslStyleSheets MemoryUsageDetails
• fonts MemoryUsageDetails
• other MemoryUsageDetails

Blinkの内部メモリキャッシュの使用状況情報を記述するオブジェクトを返します。

const { webFrame } = require('electron')
console.log(webFrame.getResourceUsage())

これは、次のように生成されます

{
  images: {
    count: 22,
    size: 2549,
    liveSize: 2542
  },
  cssStyleSheets: { /* same with "images" */ },
  xslStyleSheets: { /* same with "images" */ },
  fonts: { /* same with "images" */ },
  other: { /* same with "images" */ }
}

webFrame.clearCache()

使用されなくなったメモリ（以前のナビゲーションからの画像など）を解放しようとします。

このメソッドをむやみに呼び出すと、Electronがこれらの空になったキャッシュを補充する必要があるため、Electronの速度が低下する可能性があります。アプリでイベントが発生し、ページのメモリ使用量が実際に少なくなっていると考えられる場合にのみ呼び出す必要があります（つまり、非常に重いページからほとんど空のページに移動し、そこに留まることを意図している場合）。

webFrame.getFrameForSelector(selector)

• selector 文字列 - フレーム要素のCSSセレクター。

戻り値 WebFrame - selectorによって選択されたwebFrameのドキュメント内のフレーム要素。selectorがフレームを選択しない場合、またはフレームが現在のレンダラープロセスにない場合は、nullが返されます。

webFrame.findFrameByName(name)

• name 文字列

戻り値 WebFrame - 指定されたnameを持つwebFrameの子。該当するフレームがない場合、またはフレームが現在のレンダラープロセスにない場合は、nullが返されます。

webFrame.findFrameByRoutingId(routingId)

• routingId 整数 - 現在のレンダラープロセスにおける一意のフレームIDを表す整数。ルーティングIDはWebFrameインスタンス (webFrame.routingId) から取得でき、フレーム固有のWebContentsナビゲーションイベント (例: did-frame-navigate) によっても渡されます。

戻り値 WebFrame - 指定されたroutingIdを持つフレーム。見つからない場合はnull。

webFrame.isWordMisspelled(word)

• word 文字列 - スペルチェック対象の単語。

戻り値 boolean - 組み込みのスペルチェッカーによると単語のスペルが間違っている場合はtrue、そうでない場合はfalse。辞書が読み込まれていない場合は、常にfalseを返します。

webFrame.getWordSuggestions(word)

• word 文字列 - スペルミスのある単語。

戻り値 string[] - 指定された単語に対する候補語のリスト。単語のスペルが正しい場合、結果は空になります。

プロパティ

webFrame.top 読み取り専用

webFrameが属するフレーム階層の最上位フレームを表すWebFrame | null。最上位フレームが現在のレンダラープロセスにない場合は、プロパティはnullになります。

webFrame.opener 読み取り専用

webFrameを開いたフレームを表すWebFrame | null。オープナーがない場合、またはオープナーが現在のレンダラープロセスにない場合は、プロパティはnullになります。

webFrame.parent 読み取り専用

webFrameの親フレームを表すWebFrame | null。webFrameが最上位フレームである場合、または親が現在のレンダラープロセスにない場合は、プロパティはnullになります。

webFrame.firstChild 読み取り専用

webFrameの最初の子フレームを表すWebFrame | null。webFrameに子がない場合、または最初の子が現在のレンダラープロセスにない場合は、プロパティはnullになります。

webFrame.nextSibling 読み取り専用

次の兄弟フレームを表すWebFrame | null。webFrameが親の最後のフレームである場合、または次の兄弟が現在のレンダラープロセスにない場合は、プロパティはnullになります。

webFrame.routingId 読み取り専用

現在のレンダラープロセスにおける一意のフレームIDを表す整数。同じ基になるフレームを参照する異なるWebFrameインスタンスは、同じroutingIdを持ちます。