关于web桌面应用的集成解决方案

背景

毫无疑问,面对一个新的项目需求,我们首先想到的就是web。
确实,web太方便了,基于浏览器对OS的适配,我们可以很快速的实现某个需求的页面UI,而无需考虑OS的兼容差异。
再经过jq、bootstrap、vue等框架(库)的加持,web简直太酷了!

但浏览器(主要是V8)在成全web起飞的同时,由于安全沙箱的先天限制,web应用只能在浏览器的授信范畴内活动,而无法与OS直接通信。
当需要web应用访问本地的摄像头、读卡器、扫码枪、打印机等智能硬件时,总是会显得无能为力。

因此,在开发超市收银、业务大厅、IC卡管理等系统时,我们还是需要传统桌面应用与OS直接通信的那种能力。

模式

按照我们的习惯,还是在web中实现主要的页面UI及业务逻辑,而在需要与OS通信的部分,可以借助于桌面应用来跟OS的API打交道,并将最终结果返回给web。
这样一来,就可以打破浏览器安全沙箱的限制,将web的能力无限延申从而达到与本地OS相互通信的目的。

方案

在上面的图片中,web页面是借助桌面应用来与操作系统进行通信。
我们知道桌面应用和操作系统之间的通信是很简单的,不管是C++、C#或者JAVA都拥有这个能力,主要问题还是web与桌面应用之间的通信方式。

在远古时代,常用的办法有ActiveX、Java Applet和Flash等方式,主要是在web页面中嵌入dll或swf插件,通过这些插件来实现web本身无法做到的事情。
遗憾的是在现代浏览器中,这几种方式都逐渐不被支持,尤其从Chrome45版本以后,原来的NPAPI方式已被淘汰,新的PPAPI方式需要一定的门槛,对普通的web开发人员来说难度不小。

所以,就有很多人想到了另外一种方式,编写一个桌面应用,并在其中添加一个webview控件,就可以模拟成一个简化版的浏览器环境,然后通过js来实现双方的通信。
这种方式实现起来很方便,各种开发语言中都有webview控件,同时还实现了web应用的桌面驻留,使它看起来更像一个桌面应用。

选型

实现web桌面化的技术方案中,目前主流的有以下两种:

  1. Electron:源于Github,是一个使用JavaScript, HTML和CSS等Web技术创建原生程序的框架,文档比较全面,社区也很活跃,发展到目前已经很成熟了;
  2. Cef系列:主要是CefSharp,是面向winForm或wpf环境下,对嵌入式Chromium框架的封装,通过C++/CLI的方式来调用CEF类库,目前的版本更新很频繁,优点是上手简单,跟Chrome的兼容非常好。

以上两种技术方案都有大量的使用者,一般的技术问题都能从搜索引擎找到答案。

尝试

我本人通过对CefSharp的简单封装,实现了一个叫 EDesk 的玩应,主要进度如下:

  1. 屏蔽右键菜单
  2. 自定义首页
  3. Form标题跟随Web标题自动更新
  4. 重写新窗口(target=_blank)
  5. 重写弹窗(alert/confirm)
  6. 快捷键:F5刷新页面
  7. 快捷键:Ctrl + F5强制刷新页面
  8. 快捷键:F11全屏/恢复
  9. 快捷键:F12打开控制台
  10. 自定义UserAgent:EDesk/1.0.0
  11. 增加JS对象注入:EDesk
  12. 增加JS对象自动绑定函数:EDeskReady
  13. 摄像头操作API

下一步计划实现身份证阅读器的操作API,便于在web中实现对身份证的读取、检测以及读取身份证照片的功能。

目前该项目已在gitee上开源,地址:https://gitee.com/itez/edesk

欢迎感兴趣的朋友一起交流。

版权声明: 本文为博主 网无忌 原创文章,欢迎转载,但请务必标注原文链接。

本文链接: https://www.cnblogs.com/netWild/p/edesk.html

原文地址:https://www.cnblogs.com/netWild/p/edesk.html