在很多实际业务中,我们都会遇到这样一个问题:
系统已经是 Web 的,但客户却希望有一个“桌面应用”。
比如:
-
工厂标签打印系统
-
仓库管理系统
-
内部 ERP / OA
-
收银、前台系统
用户不想:
-
打开浏览器
-
输入网址
-
处理各种兼容问题
他们只想:
👉 双击一个图标,直接打开系统
这时候,一个非常实用的方案就是:
👉 把网页打包成 Windows 桌面应用
一、常见方案的问题
很多人第一反应是用 Electron,但在实际项目中会遇到几个问题:
1️⃣ 体积过大
一个简单网页,打包出来:
👉 200MB 起步
2️⃣ 启动慢
Electron 本质是:
👉 启动一个 Chromium 浏览器
3️⃣ 对 Windows 原生支持弱
对于:
-
安装体验
-
快捷方式
-
系统集成
👉 不够“像一个 Windows 软件”
二、更适合的方案:WPF + WebView2
这也是我这个项目 “知窗(zing-desktop)” 采用的方案。
一句话总结:
👉 用原生 Windows 窗口,承载 Web 页面
技术组合:
-
WPF(桌面 UI)
-
WebView2(Edge 内核)
三、知窗(zing-desktop)是做什么的?
它本质是一个:
👉 网页 → Windows 应用 的打包工具
核心能力:
✅ 1. 一键打包
.\package.ps1 -Runtime win-x64 -Url "https://your-site.com"
直接生成:
-
安装包(zip)
-
可执行应用
✅ 2. 启动即打开网页
应用启动后:
👉 自动加载你指定的 URL
无需浏览器参与
✅ 3. 单例运行
-
重复打开不会多开窗口
-
会自动唤起已有实例
👉 这点对业务系统非常重要
✅ 4. 标准 Windows 安装体验
支持:
-
安装到用户目录
-
创建桌面图标
-
开始菜单入口
👉 用户体验接近“真正软件”
四、核心实现原理(简单但关键)
整个流程其实很清晰:
Step 1:WPF 创建窗口
var window = new MainWindow();
window.Show();
Step 2:WebView2 加载页面
webView.Source = new Uri(url);
Step 3:读取配置
{
"url": "https://example.com"
}
支持打包时注入:
-Url "https://xxx"
Step 4:打包发布
通过 PowerShell:
package.ps1
完成:
-
编译
-
打包
-
生成安装脚本
五、使用方式(最关键部分)
1️⃣ 打包一个系统
powershell -NoProfile -ExecutionPolicy Bypass `
-File .\package.ps1 `
-Runtime win-x64 `
-Url "https://example.com/leke/lekeProductList"
2️⃣ 分发给用户
发送:
Desktop_Setup.zip
3️⃣ 用户安装
双击:
install.cmd
完成:
-
安装应用
-
创建桌面图标
4️⃣ 用户使用
👉 双击桌面图标
👉 直接进入系统
编辑