web前端开发(C++ 后端 + HTML 前端?BxScript 完美集成 WebView2,混合开发新选择)

web前端开发(C++ 后端 + HTML 前端?BxScript 完美集成 WebView2,混合开发新选择)
C++ 后端 + HTML 前端?BxScript 完美集成 WebView2,混合开发新选择

在前面的文章中,我们展示了 BxScript 如何用区区 760KB 的超小体积,结合极简的 JS 语法写出纯正的原生 Win32 桌面程序。

很多朋友看后直呼过瘾,但也提出了一个极其现实的问题:“原生控件虽然轻量、极速,但如果老板非要我画一个酷炫的 ECharts 数据大屏,或者带各种现代化 CSS 动画的复杂界面,原生 Win32 根本扛不住啊!”

确实,论画界面的效率和丰富度,HTML + CSS + 前端生态说是天下第一,没人敢称第二。这也是为什么 Electron 哪怕动辄 150MB、吃内存如喝水,依然大行其道的原因。

那么,有没有一种两全其美的方案?既能享受 Web 前端生态的绚丽,又能保持 BxScript 760KB 的极致轻量与原生操作系统的上帝权限?

答案是肯定的。今天,我们就用 BxScript 彻底打通“任督二脉”——完美集成 WebView2

借力打力:为什么是 WebView2?

现在的 Windows 10/11 系统,底层早就内置了基于 Chromium 内核的 Edge WebView2 运行时。
BxScript 的高明之处在于:我不自己打包浏览器内核,我直接白嫖系统的!

通过 BxScript 的 win.webview() 模块,你可以直接在原生窗体内嵌一个现代化的 Chromium 浏览器。你的程序本体依然只有 760KB,但你却瞬间拥有了渲染任意复杂 Web 页面的能力!

更可怕的是,BxScript 提供了强大的 JS 与 C++ 双向绑定机制 (bind),这让原本被困在浏览器沙箱里的 Web 前端,瞬间拥有了操作系统的底层权限!

关于跨平台

webview使用来自github:https://github.com/webview/webview,该库具有小巧、跨平台等特性,理论上,各位大佬可以自己下载编译;关于各个平台该库使用底层如下

Platform

Technologies

web前端开发(C++ 后端 + HTML 前端?BxScript 完美集成 WebView2,混合开发新选择)

Linux

GTK, WebKitGTK

macOS

Cocoa, WebKit

Windows

Windows API, WebView2

实战 Demo:用 HTML 按钮调用系统命令

废话不多说,我们直接写一个“混合开发”的 Demo:前端用做一个漂亮的透明Demo,特别注明,该段HTML来自于aardio演示代码。

import std.Win as win;let wb = win.webview().size(350, 800).transparent().debug(true).html("

BxScript 透明窗口

你能看到背后的桌面吗?

").bind("move", function(){ wb.doCap();}).bind("BxScriptExit", function(){ wb.doExit();}).bind("min", function () { wb.doMin();}).doTray("C:\\Users\\Administrator\\Desktop\\logo.ico", "测试气泡");win.loop();


html来自aardio演示代码

核心黑科技拆解:

这段代码虽然短,但信息量极大:

  1. .html(...):我们直接把一整段 HTML+CSS 喂给了 WebView2 控件。在实际开发中,你完全可以把 Vue、React 打包后的 index.html 读进来。
  2. wb.bind("min", function(){...}):这是最核心的灵魂!BxScript 在底层 C++ 层面拦截了 WebView2 的 IPC 通信。你在前端代码里直接调用 window.min(),实际上是触发了 BxScript 引擎的函数!
  3. 上帝权限:前端网页本来是不能读写本地文件、不能执行 CMD 命令的,但通过 bind 桥接,你的 Web 前端现在可以借助 BxScript 做到任何事——操作注册表、遍历本地文件、控制鼠标键盘操作等。

总结:告别臃肿,拥抱极简混合开发

看到这里你就会明白,BxScript 提供的不仅仅是一个解释器,而是一套极度精简的桌面应用开发哲学

复杂的 UI 交互交给 HTML/CSS(系统 WebView2 渲染),底层的系统交互、文件读写、多线程处理交给 BxScript(纯 C++17 原生驱动)。

最终,你打包发给客户的 .exe,依然是那个令人惊叹的 760KB,双击即开,丝滑无比!彻底向 Electron 那动辄几百兆的“体积焦虑”说拜拜!

了解更多与源码获取

BxScript 目前已经全面开源!用 JS 语法 + 760KB 体积玩转原生与 Web 混合开发,欢迎去仓库获取源码,随手点个 Star ⭐ 支持一下!

  • GitHub 国际站:https://github.com/BurNingQ/BxScript
  • Gitee 国内站:https://gitee.com/javaup/BxScript

下期预告

除了画界面,BxScript 还能干什么?如果你每天都需要重复性地填表、点击系统里的某个按钮,该怎么办?
明天(Day 4),我将带来大家最喜闻乐见的实战篇:《办公摸鱼神器!用 BxScript 10行代码实现鼠标键盘自动化》,手把手教你写一个极简 RPA(机器人流程自动化)脚本。敬请期待!


⚠️ 免责声明:
本项目仅供技术研究,严禁用于灰产等非法用途。

文章版权声明:除非注明,否则均为边学边练网络文章,版权归原作者所有