CRM WebClient UI 的浏览器打印实现

WebClient UI 上自带了一个打印按钮,按 Ctrl + P 后可以生成一个新的页面供打印。

如下图所示。可以看到这个页面里所有的超链接都已经被移除了。

这个页面的生成逻辑如下。
1. 按住 ctrl + p 之后,会触发 WebClient UI 框架的按键响应函数 thtmlbKeyDown。浏览器传入的事件处理对象里 ctrl 属性为 true,keycode 为 80(按键 p 对应的 code),意思就是 ctrl 和 p 同时按下。

这个响应函数 thtmlbKeyDown 被注册到整个 document 对象上,因此您在页面任何位置点击 ctrl+p 都能得到响应。

从右上角的调用栈能发现 crmFrwPrint 被调用。crmFrwPrint 会打开 print.do 这个控制器,位于 BSP 应用 bspwd_basics 里。

2. 打开 print.do 控制器的实现类 CL_BSPWD_BASICS_PRINT

这个控制器会打开 print.html 页面

3. 我们按了 ctrl+p 后生成的页面的内容就是在 print.html 里生成的。核心代码在函数 ppStartScripts 里,被 thtmlbRegisterOnLoad 注册到页面的 load 事件里,意思是 print.html 加载时就执行。


thtmlUtil.addEventHandler 就是 SAP 自己封装的事件注册函数,用于多浏览器的兼容支持。
最核心的两个函数:
CreateShield
生成一个 height 和 width 为 100%的 div,背景图片设置成 SAP 预定义好的 1x1.gif。

运行时显示如下:

loadPage
通过 window.opener 拿到发生了 ctrl+p 按键的原始页面,然后把其 th-l-wcsubheadercontainer 下面的所有元素的 html 直接复制到打印输出页面的 header 元素下面。
这样就实现了把原始页面的内容搬到了打印输出页面。

然后得到打印页面所有超链接标签,然后把这些标签的 href 和 onclick 都置为一个函数体为 return false 的函数,这样超链接就不再能点击。

Java
测试:


JavaScript
测试:

ABAP
测试:


SAP 云平台的帮助文档很多时候将 12-factor 应用和微服务架构的应用相提并论。

然而从 Allan Beck 和 John Mcteague 的 Cloud 成熟度模型概念里,12-factor 应用从成熟度上来说在微服务架构应用之上。

所谓 Twelve-factor 应用,详细定义在这个链接里, 点击每个标题的超链接能看到明细。

版权声明: 本文为 InfoQ 作者【Jerry Wang】的原创文章。
原文链接:【http://xie.infoq.cn/article/e47f29245cd4273345b75fcbf】。文章转载请联系作者。
评论