WeChat 미니 프로그램의 복잡한 서식 있는 텍스트 구문 분석에 대한 자세한 설명

최근 WeChat 애플릿에서 사용할 웹페이지를 구문 분석하는 크롤러를 작성하고 있습니다. 텍스트와 이미지 분석 모두 이해하기 쉽고, 미니 프로그램에는 프레젠테이션을 위한 해당 텍스트와 이미지 태그도 있습니다. 테이블과 같은 더 복잡한 것들은 서버 측 구문 분석이든 미니 프로그램 렌더링이든 모든 상황을 다루기가 매우 힘들고 어렵습니다. 그래서 표에 해당하는 HTML 코드를 이미지로 변환하는 것이 해결 방법이 아닐까 생각했습니다.

여기에서는 PhantomJS를 가볍게 캡슐화하고 웹 페이지를 스크린샷으로 쉽게 저장할 수 있는 node-webshot 모듈을 사용합니다.

먼저 Node.js와 PhantomJS를 설치한 다음 새 js 파일을 만들고 node-webshot 모듈을 로드합니다.

const webshot = require('webshot');

옵션 정의:

const options = {   // 浏览器窗口
   screenSize: {
       width: 755,
      height: 25
   },  
  // 要截图的页面文档区域
   shotSize: {
       height: 'all'
   },
   // 网页类型
   siteType: 'html'
};

여기서 브라우저 창의 너비는 웹 페이지에 맞게 합리적으로 설정해야 하며, height는 매우 작은 값으로 설정할 수 있으며, 페이지 문서 영역의 높이는 모두로 설정되어야 하며, 너비는 기본적으로 창 너비로 설정되어 테이블이 가장 작은 크기로 완전히 스크린샷될 수 있습니다.

다음으로 html 문자열을 정의합니다.

let html = "target rich text html code, eg: <table>...</table>";

내부의 HTML 코드는 다음과 같아야 합니다. 개행 문자를 제거하고 큰따옴표를 작은따옴표로 바꾸려면

아아앙

이러한 방식으로 HTML 코드에서 로컬 이미지로의 변환이 실현되며, 이후에 Qiniu Cloud 등에 업로드할 수 있습니다. 서버사이드 파싱이든 미니 프로그램 프리젠테이션이든 어려움이 없습니다.

위 내용은 WeChat 미니 프로그램의 복잡한 서식 있는 텍스트 구문 분석에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!