From f666cb3641c147c04a2eea3d08588a16260c54f1 Mon Sep 17 00:00:00 2001
From: snowtafir <fengxuehuayue@gmail.com>
Date: Mon, 9 Sep 2024 23:23:17 +0800
Subject: [PATCH] optimize: render

---
 CHANGELOG.md                  |  1 +
 package.json                  | 16 ++++++++--------
 src/utils/image.tsx           | 22 ++++++++++------------
 src/utils/puppeteer.render.ts | 11 +++++++----
 4 files changed, 26 insertions(+), 24 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index ac350ff..c6957fe 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,5 @@
 # 2.0.3
+* 优化截图、静态资源引入方式
 * 优化获取完整文章动态
 * fix addBiliSub
 * 优化提示信息
diff --git a/package.json b/package.json
index 0b32e1c..d805eb9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "yz-yuki-plugin",
-  "version": "2.0.3-5",
+  "version": "2.0.3-6",
   "description": "优纪插件，yunzaijs 关于 微博推送、B站推送 等功能的拓展插件",
   "author": "snowtafir",
   "type": "module",
@@ -30,13 +30,13 @@
     "md5": "^2.3.0",
     "moment": "^2.30.1",
     "node-fetch": "^3.3.2",
-    "puppeteer": "^22.15.0",
+    "puppeteer": "^23.3.0",
     "qrcode": "^1.5.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-puppeteer": "^1.0.3",
+    "react-puppeteer": "^1.0.7-rc.0",
     "redis": "^4.7.0",
-    "yaml": "^2.5.0",
+    "yaml": "^2.5.1",
     "yarn": "^1.19.1"
   },
   "devDependencies": {
@@ -72,11 +72,11 @@
     "node-fetch": "^3.3.2",
     "nodemon": "^3.1.4",
     "prettier": "^3.3.3",
-    "puppeteer": "^22.15.0",
+    "puppeteer": "^23.3.0",
     "qrcode": "^1.5.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-puppeteer": "1.0.3",
+    "react-puppeteer": "^1.0.7-rc.0",
     "redis": "^4.7.0",
     "rollup": "^4.20.0",
     "rollup-plugin-auto-external": "^2.0.0",
@@ -87,8 +87,8 @@
     "ts-node": "^10.9.2",
     "tsx": "^4.19.0",
     "typescript": "^5.5.4",
-    "yunzai": "^1.1.3",
-    "yunzai-mys": "^1.0.5"
+    "yunzai": "^1.1.4",
+    "yunzai-mys": "^1.0.6"
   },
   "files": [
     "public",
diff --git a/src/utils/image.tsx b/src/utils/image.tsx
index 5a50ed0..04a16ed 100644
--- a/src/utils/image.tsx
+++ b/src/utils/image.tsx
@@ -1,23 +1,21 @@
 import React from 'react';
-import { Puppeteer, Picture, Component, ComponentCreateOpsionType } from 'react-puppeteer';
+import { Picture, ComponentCreateOpsionType } from 'react-puppeteer';
 import { YukiPuppeteerRender, ScreenshotOptions } from '@/utils/puppeteer.render';
 import * as ReactPages from '@/components/index'
 
-// 初始化 组件渲染对象
-const com = new Component()
-
-const yukiPuppeteerRender = new YukiPuppeteerRender();
-
 export class Image extends Picture {
+  private yukiPuppeteerRender: YukiPuppeteerRender;
   /**
-   * 初始化运行Puppeteer
+   * 整合截图方法
    */
   constructor() {
     // 继承实例
     super()
-    // start
-    this.Pup = new Puppeteer()
-    this.Pup.start()
+    // 组件渲染对象
+    this.Com;
+    // start puppeteer
+    this.Pup.start();
+    this.yukiPuppeteerRender = new YukiPuppeteerRender(this.Pup);
   }
 
   /**
@@ -36,8 +34,8 @@ export class Image extends Picture {
     ComponentCreateOpsion?: ComponentCreateOpsionType,
   ): Promise<false | { img: Buffer[]; }> {
     const Page = ReactPages[page]
-    return yukiPuppeteerRender.yukiScreenshot(
-      com.compile({
+    return this.yukiPuppeteerRender.yukiScreenshot(
+      this.Com.compile({
         join_dir: page,
         html_name: `${uid}.html`,
         html_body: <Page {...props} />,
diff --git a/src/utils/puppeteer.render.ts b/src/utils/puppeteer.render.ts
index 7d98fd1..e17768a 100644
--- a/src/utils/puppeteer.render.ts
+++ b/src/utils/puppeteer.render.ts
@@ -22,8 +22,11 @@ export type ScreenshotOptions = {
   saveHtmlfile?: boolean
 }
 
-export class YukiPuppeteerRender extends Puppeteer {
-
+export class YukiPuppeteerRender {
+  private puppeteerInstance: Puppeteer;
+  constructor(puppeteerInstance: Puppeteer) {
+    this.puppeteerInstance = puppeteerInstance;
+  }
   /**
    * 截图并返回buffer
    * @param htmlPath 绝对路径
@@ -40,12 +43,12 @@ export class YukiPuppeteerRender extends Puppeteer {
    * @returns {false | {img: buffer[]}}
    */
   async yukiScreenshot(htmlPath: string, Options?: ScreenshotOptions): Promise<false | { img: Buffer[]; }> {
-    if (!(await this.isStart())) return false
+    if (!(await this.puppeteerInstance.isStart())) return false
     let name = Options?.modelName ?? 'yuki-plugin';
     let pageHeight = Options?.pageSplitHeight ?? 8000; // 分割图片高度，默认 8000
 
     try {
-      const page = await this.browser?.newPage().catch(err => {
+      const page = await this.puppeteerInstance.browser?.newPage().catch(err => {
         logger.error(err)
       })
       if (!page) return false