Intégrations Web

Vue d'ensemble

Pour intégrer du contenu web (tiers) dans une BrowserWindow d'Electron vous disposez des trois options suivantes: soit les balises <iframe> ou <webview> soit en utilisant les WebContentsView. Chacune offre des fonctionnalités légèrement différentes et utile dans des situations différentes. Pour vous aider dans votre choix, ce guide explique les différences et les capacités de chaque option.

Iframes

Les Iframes se comportent dans Electron comme dans les navigateurs ordinaires. Un élément <iframe> de votre page peut afficher des pages web externes, à condition que leur Content Security Policy le permette. Afin de limiter les fonctionnalités d’un site dans une balise <iframe> , il est recommandé d’utiliser l’attribut sandbox et d’autoriser uniquement les fonctionnalités que vous souhaitez prendre en charge.

WebViews

info

We do not recommend you to use WebViews, as this tag undergoes dramatic architectural changes that may affect stability of your application. Consider switching to alternatives, like iframe and Electron's WebContentsView, or an architecture that avoids embedded content by design.

WebViews are based on Chromium's WebViews and are not explicitly supported by Electron. Nous ne garantissons pas que l'API WebView demeurera disponible dans les futures versions d'Electron. Pour utiliser les balises <webview> , vous devrez définir webviewTag à true dans les webPreferences de votre BrowserWindow.

WebView est un élément personnalisé (<webview>) qui ne fonctionnera qu'à l'intérieur d'Electron. Son implémentation est semblable à une "iframe hors processus". Cela signifie que toute la communication avec la <webview> est faite de manière asynchrone en utilisant IPC. L'élément <webview> possède de nombreuses méthodes et événements personnalisés, similaire à webContents, qui vous donnent un grand contrôle sur le contenu.

Comparé à une <iframe>, <webview> tend à être légèrement plus lent, mais offre un contrôle beaucoup plus important dans le chargement et la communication avec le contenu tiers ainsi que la gestion de divers événements.

WebContentsView

Les WebContentsViews ne font pas partie du DOM — et doivent au lieu de cela, être créés, contrôlées, positionnés et dimensionnés par votre processus principal. En utilisant les WebContentsView, vous pouvez combiner et supperposer plusieurs pages au sein d'une même BaseWindow.

Les WebContentsView offre un bien meilleur contrôle sur leur contenu, car elles implémentent les webContents de la même façon que les BrowserWindow. Cependant, comme les WebContentsViews ne sont pas des éléments propre au DOM, leur positionnement précis par rapport au contenu du DOM nécessite une coordination entre les processus Main et Renderer.