PhantomJs를 사용하여 Java에서 HTML 이미지 출력 기능을 완성하는 방법

I. 배경

미니 프로그램에서 사진을 생성하고 모멘트에 공유하는 방법은 무엇인가요? 현재로서는 프론트엔드에 대한 좋은 해결책이 없는 것 같습니다. 그래서 백엔드에서만 지원될 수 있습니다. 그러면 어떻게 재생할 수 있습니까?

그림 생성은 비교적 간단합니다.

간단한 장면은 jdk에서 직접 지원할 수 있습니다. 일반적으로 말하면 너무 복잡한 논리는 없습니다.

전에 awt를 사용하여 그림 합성 논리를 작성했습니다: 그림 합성

Universal, 복잡한 템플릿

은 단순한 것이라면 직접 지원할 수 있지만, 더 복잡한 경우 백엔드에서 지원한다면 의심할 여지 없이 역겨운 일이 될 것입니다. 또한 github에서 HTML을 렌더링하기 위한 일부 오픈 소스 라이브러리도 검색해 보았습니다. 잘못된 자세 때문인지는 모르겠지만 결과는 만족스럽습니다

이제 복잡한 템플릿을 지원하는 방법은 무엇인가요?

이 기사의 가이드는 html 렌더링을 구현하는 것입니다. PDF 생성, 그림 생성 및 DOM 구문 분석을 지원합니다. 다음으로 phantomjs를 결합하여 웹 페이지를 이미지로 렌더링하는 서비스를 구축하는 방법을 보여 드리겠습니다.

II. 전제조건 준비

1. phantom.js 설치

# 1. 下载
## mac 系统
wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-macosx.zip
## linux 系统
wget https://bitbucket.org/ariya/phantomjs/downloads/phantomjs-2.1.1-linux-x86_64.tar.bz2
## windows 系统
## 就不要玩了，没啥意思
# 2. 解压
sudo su 
tar -jxvf phantomjs-2.1.1-linux-x86_64.tar.bz2
# 如果解压报错，则安装下面的
# yum -y install bzip2
# 3. 安装
## 简单点，移动到bin目录下
cp phantomjs-2.1.1-linux-x86_64/bin/phantomjs /usr/local/bin
# 4. 验证是否ok
phantomjs --version
# 输出版本号，则表示ok

2. 종속성 추가를 위한 Java 종속성 구성

maven 구성

<!--phantomjs -->
<dependency>
  <groupid>org.seleniumhq.selenium</groupid>
  <artifactid>selenium-java</artifactid>
  <version>2.53.1</version>
</dependency>
<dependency>
  <groupid>com.github.detro</groupid>
  <artifactid>ghostdriver</artifactid>
  <version>2.1.0</version>
</dependency>
<repositories>
  <repository>
    <id>jitpack.io</id>
    <url>https://jitpack.io</url>
  </repository>
</repositories>

Start

주로 phantomjs를 호출하여 html 렌더링 이미지를 구현하는 로직은 다음과 같습니다.

public class Html2ImageByJsWrapper {
  private static PhantomJSDriver webDriver = getPhantomJs();
  private static PhantomJSDriver getPhantomJs() {
    //设置必要参数
    DesiredCapabilities dcaps = new DesiredCapabilities();
    //ssl证书支持
    dcaps.setCapability("acceptSslCerts", true);
    //截屏支持
    dcaps.setCapability("takesScreenshot", true);
    //css搜索支持
    dcaps.setCapability("cssSelectorsEnabled", true);
    //js支持
    dcaps.setJavascriptEnabled(true);
    //驱动支持（第二参数表明的是你的phantomjs引擎所在的路径，which/whereis phantomjs可以查看）
    // fixme 这里写了执行， 可以考虑判断系统是否有安装，并获取对应的路径 or 开放出来指定路径
    dcaps.setCapability(PhantomJSDriverService.PHANTOMJS_EXECUTABLE_PATH_PROPERTY, "/usr/local/bin/phantomjs");
    //创建无界面浏览器对象
    return new PhantomJSDriver(dcaps);
  }
  public static BufferedImage renderHtml2Image(String url) throws IOException {
    webDriver.get(url);
    File file = webDriver.getScreenshotAs(OutputType.FILE);
    return ImageIO.read(file);
  }
}

테스트 사례

public class Base64Util {
  public static String encode(BufferedImage bufferedImage, String imgType) throws IOException {
    ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
    ImageIO.write(bufferedImage, imgType, outputStream);
    return encode(outputStream);
  }
  public static String encode(ByteArrayOutputStream outputStream) {
    return Base64.getEncoder().encodeToString(outputStream.toByteArray());
  }
}
@Test
public void testRender() throws IOException {
  BufferedImage img = null;
  for (int i = 0; i  생성된 사진은 게시되지 않습니다. 관심이 있으시면 제 웹사이트에 직접 가서 실제 테스트를 해보세요<p></p><p>III.Network 실제 테스트<strong></strong></p>간단한 웹 애플리케이션이 배포되었습니다. HTML 출력 이미지 기능을 지원하는 알리바바 클라우드 서버, 거지 버전을 구입하고 멋진 프런트 엔드 템플릿을 사용했기 때문에 천천히 열렸습니다.<p></p>작동 데모:<p></p><p><img src="https://img.php.cn/upload/article/000/465/014/168385291276280.gif" alt="PhantomJs를 사용하여 Java에서 HTML 이미지 출력 기능을 완성하는 방법"></p>

위 내용은 PhantomJs를 사용하여 Java에서 HTML 이미지 출력 기능을 완성하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!