Home  >  Article  >  Backend Development  >  基于linnux+phantomjs实现生成图片格式的网页快照_php实例

基于linnux+phantomjs实现生成图片格式的网页快照_php实例

WBOY
WBOYOriginal
2016-05-16 20:17:281360browse

安装扩展:
  (1)下面是我在linux上的安装过程,如果没有安装git请先yum install git
    安装casperjs

复制代码 代码如下:

    cd /
    git clone git://github.com/n1k0/casperjs.git
    cd casperjs
    ln -sf /casperjs/bin/casperjs /usr/local/bin/casperjs  //可以忽略 实际执行中php是执行 /casperjs/bin/casperjs

 
    (2)安装phantomjs,下载地址:http://phantomjs.org/download.html
       下载后操作很简单,直接把解压好的in\phantomjs移动到usr\local\bin\phantomjs就可以了。
       测试phantomjs --version 有结果不报错,说明安装OK
 
    (3)安装字体
      1. 首先获得一套“微软雅黑”字体库(Google一下一大把),包含两个文件msyh.ttf(普通)、msyhbd.ttf(加粗);
      2. 在/usr/share/fonts目录下建立一个子目录,例如win,命令如下:

复制代码 代码如下:

# mkdir /usr/share/fonts/win

      3. 将msyh.ttf和msyhbd.ttf复制到该目录下,例如这两个文件放在/root/Desktop下,使用命令:

复制代码 代码如下:

 # cd /root/Desktop
 # cp msyh.ttf msyhbd.ttf  /usr/share/fonts/win/

      4. 建立字体索引信息,更新字体缓存:

复制代码 代码如下:

   # cd /usr/share/fonts/win
          # mkfontscale  (如果提示 mkfontscale: command not found,需自行安装 # yum install mkfontscale )
          # mkfontdir
          # fc-cache    (如果提示 fc-cache: command not found,则需要安装# yum install fontconfig )

   至此,字体已经安装完毕!

<&#63;php 
  if (isset($_GET['url'])) 
  { 
    set_time_limit(0); 
  
    $url = trim($_GET['url']); 
    $filePath = md5($url).'.png'; 
    if (is_file($filePath)) 
    { 
      exit($filePath); 
    } 
 
    //如果不加这句就会报错“Fatal: [Errno 2] No such file or directory; did you install phantomjs&#63;”,详情参考http://mengkang.net/87.html
    putenv("PHANTOMJS_EXECUTABLE=/usr/local/bin/phantomjs");
    $command = "phantomjs phantomjs.js {$url} {$filePath}"; 
    @exec($command); 
  
    exit($filePath); 
  } 
&#63;> 
  
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
<meta name="keywords" content="" /> 
<meta name="description" content="" /> 
<title>快照生成</title> 
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script> 
<style> 
* {margin: 0; padding: 0; } form {padding: 20px; } div {margin: 20px 0 0; } input {width: 200px; padding: 4px 2px; } #placeholder {display: none; } 
</style>
</head> 
  
<body> 
  <form action="" id="form"> 
    <input type="text" id="url" /> 
    <button type="submit">生成快照</button> 
  
    <div> 
      <img src="" alt="" id="placeholder" /> 
    </div> 
  </form> 
  <script> 
  $(function(){ 
    $('#form').submit(function(){ 
      if (typeof($(this).data('generate')) !== 'undefined' && $(this).data('generate') === true) 
      { 
        alert('正在生成网站快照,请耐心等待...'); 
        return false; 
      } 
  
      $(this).data('generate', true); 
      $('button').text('正在生成快照...').attr('disabled', true); 
  
      $.ajax({ 
        type: 'GET', 
        url: '&#63;', 
        data: 'url=' + $('#url').val(), 
        success: function(data){ 
          $('#placeholder').attr('src', data).show(); 
          $('#form').data('generate', false); 
          $('button').text('生成快照').attr('disabled', false); 
        } 
      }); 
  
      return false; 
    }); 
  }); 
  </script> 
</body> 
</html>

var page = require('webpage').create(); 
var args = require('system').args; 
 
var url = args[1]; 
var filename = args[2]; 
 
page.open(url, function () { 
  page.render(filename); 
  phantom.exit(); 
});

以上所述就是本文的全部内容了,希望大家能够喜欢。

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn