page2pdf_server 1.0.2 → 1.1.0

package/src/utils/pdfgen.ts

@@ -5,9 +5,13 @@ import CDP from "chrome-remote-interface";
 import _ from "lodash";
 // @ts-ignore
 import config from "config";
-import CONFIG from "@/configEnv";
-import { ConfigRoot, FileTransform, MyPaperSize } from "@/types/request/config";
-import { filePathToUrl } from "@/utils/url";
+import CONFIG from "../configEnv";
+import {
+  ConfigRoot,
+  FileTransform,
+  MyPaperSize,
+} from "../types/request/config";
+import { filePathToUrl } from "../utils/url";
 
 //自定义纸张系列的：
 const paperSZs = config.get("size") as MyPaperSize[];
@@ -78,6 +82,7 @@ interface IRenderPdfOptions {
   landscape?: boolean;
   includeBackground?: boolean;
   windowSize?: boolean;
+  //纸张  英寸为单位的。  限制打印输出的用
   paperWidth?: number;
   paperHeight?: number;
   pageRanges?: string;
@@ -92,6 +97,7 @@ interface IRenderPdfOptions {
   marginBottom?: number;
   marginLeft?: number;
   marginRight?: number;
+  //有些 要打印 背景图片的需要？
   printBackground?: boolean;
 }
 
@@ -124,6 +130,7 @@ export class RenderPDF {
    * 奇数页还是偶数页的，双面打印对页码位置可能会调整位置的，而单独一个URL生成pdf时刻有可能没法就一定能够正确打印页码文字的是定位位置啊。抛弃支持：纯静态html横竖方向混合的场景,独立转换抽取部分纸张到过渡的pdf或拆解组合来做。
    * 还是考虑：保留第一阶段页眉页脚的打印能力，但是仅仅针对：特殊url：file[url:{ 只能是独立的页码编码和页码合计数独自计数，不涉及到其它的URL的 }]，双面打印：页码只能放在中间位置为好，页码必须从第一页开始编码的，而且这种情况目标是不采用叠加页眉页脚两次pdf方案(一次性，不提取出CSS纸张方向)。
    * 最终采用引入reverseRanges参数设置部分纸张反转纸张方向，需要配置某某页并和CSS打印第一阶段生成的pdf能够吻合纸张方向的话，就能确保页眉页脚叠加正常位置。这里步骤就免于处理页眉页脚的生成了。
+   * CDP【Target】才是开启URL的。浏览器初始化； Page是打印输出的。
    * */
   async renderPdf(task: ConfigRoot<FileTransform>, tsobj: FileTransform) {
     let options = {} as IRenderPdfOptions;
@@ -139,6 +146,7 @@ export class RenderPDF {
     const { CDPclient, targetId } = await this.newTabOrPage(
       this.getCDPhostPort(),
       url,
+      tsobj.brwidth,
     );
     // await RenderPDF.newTabOrPage(this.getCDPhostPort(), url);
     // const client = await CDP({ host: this.host, port: this.port });
@@ -343,7 +351,9 @@ export class RenderPDF {
     // renderer.killChrome();
   }
 
-  /**关键的： 某一个url的转换步骤 */
+  /**关键的： 某一个url的转换步骤
+   * @param tsobj 每一个独立URL生成 FileTransform 配置的
+   * */
   async generateSinglePdf(
     tsobj: FileTransform,
     task: ConfigRoot<FileTransform>,
@@ -512,7 +522,9 @@ export class RenderPDF {
     return ret;
   }
 
-  /**汇总步骤入口: 前提 :前面已经生成独立的多个pdf */
+  /**汇总步骤入口: 前提 :前面已经生成独立的多个pdf
+   * 另外 还有await renderer.newTabOrPage(/ renderer.yemeiyejiaoPageGen( 是用于生成页眉页脚的每一页都有独立临时pdf。
+   * */
   static async MergeAllPdfs(
     task: ConfigRoot<FileTransform>,
     options: IRenderPdfOptions,
@@ -737,12 +749,12 @@ export class RenderPDF {
       headerTemplate0 = headerTemplate0?.replace("-NOT_DISPLAY-", "");
       headerTemplate0 = headerTemplate0
         ?.replace(
-          "${pageNumber}",
+          "~pageNumber~",
           tsobj.roman && pageNumber > 0 && pageNumber < 13
             ? ROMA_NUMS[pageNumber]
             : "" + pageNumber,
         )
-        .replace("${totalPages}", "" + totalPages);
+        .replace("~totalPages~", "" + totalPages);
     }
     options.headerTemplate = headerTemplate0;
     let footerTemplate0;
@@ -769,12 +781,12 @@ export class RenderPDF {
       footerTemplate0 = footerTemplate0?.replace("-NOT_DISPLAY-", "");
       footerTemplate0 = footerTemplate0
         ?.replace(
-          "${pageNumber}",
+          "~pageNumber~",
           tsobj.roman && pageNumber > 0 && pageNumber < 13
             ? ROMA_NUMS[pageNumber]
             : "" + pageNumber,
         )
-        .replace("${totalPages}", "" + totalPages);
+        .replace("~totalPages~", "" + totalPages);
     }
     options.footerTemplate = footerTemplate0;
 
@@ -792,16 +804,17 @@ export class RenderPDF {
     return null;
   }
 
-  /**直接嵌入用户打开的浏览器的模式下，独立的开启新的浏览器窗口需要：
-   * 问题：刚用createTarget立刻获取targetId(frameId)没法正常工作，
-   * 这里await CDP(options)必须做两次!!：没法避免，否则干扰用户窗口，要么新Tab没有实际准备好的。
-   * */
-  async newTabOrPage(options: CDPbeginParam, url: string) {
+  async newTabPageInner(options: CDPbeginParam, url: string, brwidth?: number) {
     const client1 = await CDP(options); // await CDP({ host: options.host, port: options.port });
-    const { Target } = client1;
+    const { Target, Browser } = client1;
+    //页眉页脚也会开动新的Tab; 没尝试出来：用这个入口就可控制浏览器窗口的宽度的办法。
     await Target.createTarget({
       url: url,
       background: true,
+      width: 719, //无效：(headless chrome only)不算无头模式的，有展示交互式窗口啊。
+      newWindow: true,
+      // enableBeginFrameControl: true,
+      forTab: true,
     });
     //前端编码之escape、encodeURI对的, 和 encodeURIComponent
     const { targetInfos } = await Target.getTargets();
@@ -809,12 +822,49 @@ export class RenderPDF {
       //"type": "webview", iframe, background_page, ...
       return tab.type === "page" && tab.url === url;
     });
-    client1.close(); //原先每次关闭的：
+    //targetId就是目标窗口的实例。
     if (!target.targetId) throw new Error("没开启窗口:" + url);
+    if (brwidth) {
+      //需要约束浏览器 来避免打印页数不正常的，web页面的动态布局导致的，打印结果太少太多页数。
+      const { windowId, bounds } = await Browser.getWindowForTarget({
+        targetId: target.targetId,
+      });
+      const objectWidth = brwidth;
+      const newbounds = {
+        ...bounds,
+        width: objectWidth,
+        windowState: "normal",
+      };
+      await Browser.setWindowBounds({ windowId, bounds: newbounds });
+      const { bounds: realBound } = await Browser.getWindowBounds({ windowId });
+      const newRealWidth = realBound?.width;
+      if (objectWidth !== newRealWidth)
+        throw new Error("开窗口宽度不适当:" + newRealWidth);
+    }
+    client1.close(); //原先每次关闭的：
     const client = await CDP(options);
+
     //这些用例简易网页：frameId实际等同targetId；因没有嵌套<iframe />标签的。
     return { CDPclient: client, targetId: target.targetId };
   }
+  /**直接嵌入用户打开的浏览器的模式下，独立的开启新的浏览器窗口需要：
+   * 问题：刚用createTarget立刻获取targetId(frameId)没法正常工作，
+   * 这里await CDP(options)必须做两次!!：没法避免，否则干扰用户窗口，要么新Tab没有实际准备好的。
+   * 另外入口是：页眉页脚是使用纯粹 静态的 yemeiyejiaoHtml 来生成的每一页的独立页眉页脚pdf再合并的，不需要考虑浏览器宽度大小会影响到（不是动态布局的内容）。
+   * */
+  async newTabOrPage(options: CDPbeginParam, url: string, brwidth?: number) {
+    //多尝试一次， 浏览器宽度设置可能不能一次性成功的。
+    for (let i = 0; i < 2; i++) {
+      try {
+        const result = await this.newTabPageInner(options, url, brwidth);
+        return result;
+      } catch (e) {
+        // @ts-ignore
+        if (!e.message.startsWith("开窗口宽度不适当:")) console.error(e);
+      }
+    }
+    throw new Error("开启窗口尝试2次失败:" + url);
+  }
   /**假如不是当前刚刚操作的Tab的话？：
    * */
   async closeTabOrPage(client: any, target: string) {

package/src//346/265/213/350/257/225.txt

@@ -1,4 +1,4 @@
-工程目录：page2pdf-server/执行 npm publish 发布到npm
+工具包需要发布，工程目录：page2pdf-server/执行 npm publish 发布到npm
 后端没有单步调试模式太不好了，原本直接start就能单步调试，后来不行了，jest来解决：
 __test__/./generatePdf.test.ts问题：jest用Run模式正常，可是若Debug模式单步调试的，.post(`/api/pdf`).send就会提前中止！原因xxxController容不下多个接口函数？
 /?有断点运行卡着的并且xxxController类里有两个函数的？提前中止啊；非得拆分两个文件。
@@ -171,6 +171,8 @@ headerTemplate = `<div style="position: relative; width:100%; text-align:center;
       <div style="position: absolute; width:100%; text-align: center; bottom: 5px;"><span class=title></div>
         <div style="position: absolute; text-align: right; bottom: 5px;right: 20px;">version: 1.0</div>
       </div>`;
+
+默认标题 '<div style=\\"position: absolute; width:100%; text-align: center; bottom: 5px;\\"><span id=\\"titlespan\\" class=title></div>',
 使用chrome, 不能以root账号直接使用   https://www.cnblogs.com/kk1893/p/14985512.html
 let browserOptions = { args: ['--no-sandbox', '--disable-setuid-sandbox'] };
 物理打印机系统对话框设置：可能能配置装订线宽度和页码输出的{套中套}可分拆却就不能文件合并。
@@ -241,4 +243,26 @@ package.json:: start 又能使用单步调试模式运行了，奇怪，为何
 }
 BD1CE5AD1D724197A177AC4E50DDB4A6
 
-去掉bcrypt包 @mapbox/node-pre-gyp node-gyp 依賴python啊
+去掉bcrypt包 @mapbox/node-pre-gyp node-gyp 依賴python啊
+useMeasure(dynctRef0)?.height 所获得尺寸实际针对屏幕的，在打印机场景该取值还是来自屏幕的，并非纸张打印语义的尺寸；没法测量打印时刻的div高度？。
+
+新电脑，不是管理员账户跑的开发环境，POST http://localhost:9389/api/pdf 出现error: Error: connect ECONNREFUSED 127.0.0.1:9872
+只好另外管理员用户启动浏览器窗口。当前打印服务器的为何却要调用管理员账户启动的浏览器？不能直接用当前用户启动浏览器，非要windows管理员窗口的。
+奇怪浏览器手动去打印必须勾选页眉页脚才正常，没选的表格最右边会不见了，但是打印服务器不受此困扰，两者看似能确保页数一致性的。
+去掉了： 没法在生产版本中用，没包报错
+  "devDependencies": {
+      "@types/module-alias": "^2.0.1",
+      "module-alias": "^2.2.3",
+  }
+不是module-alias的问题，而是node_modules在生产目录底下也不能缺少啊！直接拷贝也行！  https://blog.csdn.net/qq_35624642/article/details/128960311
+windows用户若非管理员账户的：桌面上的Chrome快捷方式右键点属性在“兼容性”设置中：必须勾选“管理员身份运行”！否则端口remote-debugging-port没开启。
+【浏览器有BUG】
+预览打印的，若没有勾选页眉页脚的话可能导致表格输出的右边边框被裁剪看不见表格右边线了，就只能勾选页眉页脚，但是我这个打印转换服务器没有这个毛病。
+但问题是：勾不勾选页眉页脚会不会影响到了实际打印输出的页数啊？目前还未发现这个影响存在的。
+如何限制打印时刻浏览器宽的：
+入口代码：src/utils/pdfgen.ts 的 async renderPdf(task: ConfigRoot<FileTransform>, tsobj: FileTransform) 浏览器打印主入口：
+【CDP文档】  https://chromedevtools.github.io/devtools-protocol/tot/Target/
+首先必须手动开启chrome浏览器；而且这个浏览器窗体宽度直接影响打印输出！可能会漏打，动态div测量调整布局问题。影响到浏览器其它用途体验。
+yarn又失败： 无法访问上 https://registry.npmjs.org/
+问题：有些URL网页，一直在等待加载好，死等打印命令没结果，估计CDP依据页面的网络消息决定加载结束与否的。
+端口已经被占用，启动不能访问预定端口的：查进程 netstat -ano | findstr :9872        #找出 LISTENING  10972 =进程ID；杀掉

package/test//346/211/223/345/215/260/346/234/215/345/212/241.http

@@ -0,0 +1,17 @@
+POST http://localhost:9389/api/pdf
+Accept: application/json
+Content-Type: application/json; charset=utf-8
+
+{
+  "merge": true,
+  "name": "asjsak啊实打实2",
+  "lay": {
+  },
+  "files": [
+    {
+      "url": "http://192.168.1.102:3765/originalView/CR-JJ/ver/1/-3kfCWcBRx66P8YA7EOkXFJlcG9ydA/printAll",
+      "out": "横页脚的VS2"
+    }
+  ]
+}
+###

package/tsconfig.json

@@ -1,41 +1,41 @@
-{
-  "compilerOptions": {
-    /* Basic Options */
-    "incremental": true,
-    "target": "ESNext",
-    "module": "commonjs",
-    "outDir": "dist",
-    "pretty": true,
-    "removeComments": true,
-
-    /* Strict Type-Checking Options */
-    "strict": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "strictFunctionTypes": true,
-    "strictBindCallApply": true,
-    "strictPropertyInitialization": true,
-    "noImplicitThis": false,
-    "alwaysStrict": true,
-
-    /* Additional Checks */
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true,
-
-    /* Module Resolution Options */
-    "moduleResolution": "node",
-    "esModuleInterop": true,
-    "resolveJsonModule": true,
-    "sourceMap": true,
-    "forceConsistentCasingInFileNames": true,
-    "types": ["jest", "node"],
-    "baseUrl": "src",
-    "paths": {
-        "@/*": ["./*"]
-    },
-  },
-  "include": ["src/**/*", "**/__tests__/**/*"],
-  "exclude": ["node_modules"]
-}
+{
+  "compilerOptions": {
+    /* Basic Options */
+    "incremental": true,
+    "target": "ESNext",
+    "module": "commonjs",
+    "outDir": "dist",
+    "pretty": true,
+    "removeComments": true,
+
+    /* Strict Type-Checking Options */
+    "strict": true,
+    "noImplicitAny": true,
+    "strictNullChecks": true,
+    "strictFunctionTypes": true,
+    "strictBindCallApply": true,
+    "strictPropertyInitialization": true,
+    "noImplicitThis": false,
+    "alwaysStrict": true,
+
+    /* Additional Checks */
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+
+    /* Module Resolution Options */
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "resolveJsonModule": true,
+    "sourceMap": true,
+    "forceConsistentCasingInFileNames": true,
+    "types": ["jest", "node"],
+    "baseUrl": "src",
+    "paths": {
+        "@/*": ["./*"]
+    },
+  },
+  "include": ["src/**/*", "**/__tests__/**/*"],
+  "exclude": ["node_modules"]
+}

package/tslint.json

@@ -1,22 +1,22 @@
-{
-  "defaultSeverity": "error",
-  "extends": ["tslint:recommended"],
-  "jsRules": {
-    "object-literal-sort-keys": false
-  },
-  "rules": {
-    "ordered-imports": false,
-    "object-literal-sort-keys": false,
-    "quotemark": [true, "single"],
-    "trailing-comma": [
-      true,
-      {
-        "multiline": "never",
-        "singleline": "never"
-      }
-    ],
-    "arrow-parens": [true, "ban-single-arg-parens"],
-    "interface-name": [true, "never-prefix"]
-  },
-  "rulesDirectory": []
-}
+{
+  "defaultSeverity": "error",
+  "extends": ["tslint:recommended"],
+  "jsRules": {
+    "object-literal-sort-keys": false
+  },
+  "rules": {
+    "ordered-imports": false,
+    "object-literal-sort-keys": false,
+    "quotemark": [true, "single"],
+    "trailing-comma": [
+      true,
+      {
+        "multiline": "never",
+        "singleline": "never"
+      }
+    ],
+    "arrow-parens": [true, "ban-single-arg-parens"],
+    "interface-name": [true, "never-prefix"]
+  },
+  "rulesDirectory": []
+}

package/.idea/codeStyles/Project.xml

@@ -1,58 +0,0 @@
-<component name="ProjectCodeStyleConfiguration">
-  <code_scheme name="Project" version="173">
-    <HTMLCodeStyleSettings>
-      <option name="HTML_SPACE_INSIDE_EMPTY_TAG" value="true" />
-      <option name="HTML_ENFORCE_QUOTES" value="true" />
-    </HTMLCodeStyleSettings>
-    <JSCodeStyleSettings version="0">
-      <option name="FORCE_SEMICOLON_STYLE" value="true" />
-      <option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
-      <option name="FORCE_QUOTE_STYlE" value="true" />
-      <option name="ENFORCE_TRAILING_COMMA" value="Remove" />
-      <option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
-      <option name="SPACES_WITHIN_IMPORTS" value="true" />
-    </JSCodeStyleSettings>
-    <TypeScriptCodeStyleSettings version="0">
-      <option name="FORCE_SEMICOLON_STYLE" value="true" />
-      <option name="SPACE_BEFORE_FUNCTION_LEFT_PARENTH" value="false" />
-      <option name="FORCE_QUOTE_STYlE" value="true" />
-      <option name="ENFORCE_TRAILING_COMMA" value="Remove" />
-      <option name="SPACES_WITHIN_OBJECT_LITERAL_BRACES" value="true" />
-      <option name="SPACES_WITHIN_IMPORTS" value="true" />
-    </TypeScriptCodeStyleSettings>
-    <VueCodeStyleSettings>
-      <option name="INTERPOLATION_NEW_LINE_AFTER_START_DELIMITER" value="false" />
-      <option name="INTERPOLATION_NEW_LINE_BEFORE_END_DELIMITER" value="false" />
-    </VueCodeStyleSettings>
-    <codeStyleSettings language="HTML">
-      <option name="SOFT_MARGINS" value="80" />
-      <indentOptions>
-        <option name="INDENT_SIZE" value="2" />
-        <option name="CONTINUATION_INDENT_SIZE" value="2" />
-        <option name="TAB_SIZE" value="2" />
-      </indentOptions>
-    </codeStyleSettings>
-    <codeStyleSettings language="JavaScript">
-      <option name="SOFT_MARGINS" value="80" />
-      <indentOptions>
-        <option name="INDENT_SIZE" value="2" />
-        <option name="CONTINUATION_INDENT_SIZE" value="2" />
-        <option name="TAB_SIZE" value="2" />
-      </indentOptions>
-    </codeStyleSettings>
-    <codeStyleSettings language="TypeScript">
-      <option name="SOFT_MARGINS" value="80" />
-      <indentOptions>
-        <option name="INDENT_SIZE" value="2" />
-        <option name="CONTINUATION_INDENT_SIZE" value="2" />
-        <option name="TAB_SIZE" value="2" />
-      </indentOptions>
-    </codeStyleSettings>
-    <codeStyleSettings language="Vue">
-      <option name="SOFT_MARGINS" value="80" />
-      <indentOptions>
-        <option name="CONTINUATION_INDENT_SIZE" value="2" />
-      </indentOptions>
-    </codeStyleSettings>
-  </code_scheme>
-</component>

package/.idea/codeStyles/codeStyleConfig.xml

@@ -1,5 +0,0 @@
-<component name="ProjectCodeStyleConfiguration">
-  <state>
-    <option name="USE_PER_PROJECT_SETTINGS" value="true" />
-  </state>
-</component>

package/.idea/encodings.xml

@@ -1,7 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="Encoding">
-    <file url="file://$PROJECT_DIR$/eslintrc.json" charset="GBK" />
-    <file url="file://$PROJECT_DIR$/src/testCSS.html" charset="GBK" />
-  </component>
-</project>

package/.idea/inspectionProfiles/Project_Default.xml

@@ -1,7 +0,0 @@
-<component name="InspectionProjectProfileManager">
-  <profile version="1.0">
-    <option name="myName" value="Project Default" />
-    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
-    <inspection_tool class="TsLint" enabled="true" level="WARNING" enabled_by_default="true" />
-  </profile>
-</component>

package/.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/tenstack-starter-main.iml" filepath="$PROJECT_DIR$/.idea/tenstack-starter-main.iml" />
-    </modules>
-  </component>
-</project>

package/.idea/page2pdf-server.iml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

package/.idea/tenstack-starter-main.iml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

package/.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="" vcs="Git" />
-  </component>
-</project>