安装扩展:
(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
下载后操作很简单,直接把解压好的\bin\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 )
至此,字体已经安装完毕!
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
|
<?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?”,详情参考http://mengkang.net/87.html
putenv( "PHANTOMJS_EXECUTABLE=/usr/local/bin/phantomjs" );
$command = "phantomjs phantomjs.js {$url} {$filePath}" ;
@ exec ( $command );
exit ( $filePath );
}
?>
<!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: '?' ,
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>
|
1
2
3
4
5
6
7
8
9
10
|
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 ();
});
|
以上所述就是本文的全部内容了,希望大家能够喜欢。