const electron
=
require
(
"electron"
)
const app
=
electron.app
const BrowserWindow
=
electron.BrowserWindow
const globalShortcut
=
electron.globalShortcut
// 声明要打开的窗口
let
mainWindow
=
null
app.on
(
"ready"
,
(
)
=
>
{
mainWindow
=
new BrowserWindow
(
{
width:800,
height:800,
webPreferences:
{
nodeIntegration:true, //开启node接口
contextIsolation:false,
webSecurity: false,
}
)
;
// 打开新窗口 BrosweWindow 初始化
require
(
'@electron/remote/main'
)
.initialize
(
)
;
require
(
"@electron/remote/main"
)
.enable
(
mainWindow.webContents
)
;
// 打开调试工具
mainWindow.webContents.openDevTools
(
)
;
// mainWindow.loadFile
(
"index.html"
)
;
mainWindow.loadFile
(
"./html/index3.html"
)
;
// 在浏览器打开网页
// 嵌入网页
// BrowserView 主线程模块,在主进程中使用
let
view
=
new BrowserView
(
)
mainWindow.setBrowserView
(
view
)
;
view.setBounds
(
{
y:120,
width:400,
height:400
view.setBackgroundColor
(
"#F5F5F5"
)
;
// 当所有窗口被关闭了,退出。
app.on
(
'window-all-closed'
,
function
(
)
{
if
(
process.platform
!=
'darwin'
)
{
app.quit
(
)
;
}
)
;
index.html
代码如下(示例):
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>内嵌网页</title>
</head>
<webview id="foo" src="https://www.github.com/" style="display:inline-flex; width:640px; height:480px"></webview>
</body>
</html>
electron嵌入网页文章目录electron嵌入网页一、创建项目1. 创建mian.js2. 创建页面 html二、验证代码1. 运行项目一、创建项目1. 创建mian.js代码如下(示例):// main.jsconst electron = require("electron")const app = electron.appconst BrowserWindow = electron.BrowserWindowconst globalShortcut = electr
本仓库主要是介绍学些 electron中遇到的一些问题,并提出解决办法,与其他仓库不同的是,这里是以实践为主,并配有详细的注释代码,版本说明
目录结构说明(应用场景篇)
lesson-1 初学electron-起步篇-暂未补充
主要讲打印
主要讲主进程与渲染进程通讯
调用动态库示例
electron预览pdf文件的方式
electron打包,源码隐藏、自动更新,覆盖安装, 应用自启动, electron-vue框架升级
electron 禁用按键,快捷键
lesson-8 没想好写什么
检测当前网络环境是在线还是离线
lesson-10 electron结合rem实现多种屏幕应用的适配实战
lesson-11 electron实现注册,登录效果;实现从第三方页面跳回当前的electron应用
lesson-12 electron实现粘贴、复制、剪切,监控剪切板变化,
这是H5的一个新标签,可以在网页中,内联一个全新的网页,而在electron中,他也是管用的,使用方式与在普通网页中相差无几
webView
把webView当做是一个容器一般,将外来网页放在容器中显示,但是要是使用,需要在主进程当中,创建窗口时,使用webViewTag设置为true
const mainWindow = new B
文章目录iframe输入网址
iframe
electron的窗口控件,实际上就是一个html解析工具,也就是说,通过electron可以用最短的代码,写一个浏览器,甚至可以查看浏览器中网页源代码,如下图中点击View->Toggle Developer Tools
代码只需要一个main.js
const {app, BrowserWindow} = require('electron')
function createWindow () {
const mainWindow = new B
文章目录例子如何让一个网页充满整个窗口
const { app, BrowserWindow, BrowserView, globalShortcut } = require('electron')
const path = require('path')
var mainWindow = null // 声明要打开的主窗口
const { Menu } = require('electron')
app.on('ready', () => {
// 设置窗口的高度和宽度
mainWi