WeChat 애플릿 구문 분석 웹 콘텐츠의 예에 대한 자세한 설명

이 기사에서는 주로 WeChat 애플릿 파싱 웹 페이지 콘텐츠에 대한 자세한 설명과 예를 소개합니다. 여기서는 크롤러를 사용하여 복잡한 웹 페이지를 크롤링하는 경우 문제를 정리하고 여기에서 해결합니다.

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'
};

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

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

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

내부의 HTML 코드는 줄 바꿈을 제거하고 큰따옴표를 작은따옴표로 바꿔야 합니다.

마지막으로 스크린샷:

webshot(html, 'demo.png', options, (err) => {
  if (err)
    console.log(`Webshot error: ${err.message}`);
});

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

읽어주셔서 감사합니다. 모두에게 도움이 되었으면 좋겠습니다. 이 사이트를 응원해주셔서 감사합니다!

위 내용은 WeChat 애플릿 구문 분석 웹 콘텐츠의 예에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!