在Python中使用CasperJS获取JS渲染生成的HTML内容的教程
作者：Ihavegotyou
字体：[ ] 类型：转载 时间：
这篇文章主要介绍了在Python中使用CasperJS获取JS渲染生成的HTML内容的教程,需要先用JavaScript创建一个接口文件,需要的朋友可以参考下
文章摘要：其实这里casperjs与python没有直接关系,主要依赖casperjs调用phantomjs webkit获取html文件内容。长期以来，抓取 客户端javascript渲染生成的html页面 都极为 困难, Java里面有 HtmlUnit, 而Python里，我们可以使用独立的跨平台的。
&&& 创建site.js(接口文件，输入:url，输出:html file)&&
//USAGE: E:\toolkit\n1k0-casperjs-e3a77d0\bin&python casperjs site.js --url=http://spys.ru/free-proxy-list/IE/ --outputfile='temp.html'
var fs = require('fs');
var casper = require('casper').create({
pageSettings: {
loadImages: false,
loadPlugins: false,
userAgent: 'Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0. Safari/537.36 LBBROWSER'
logLevel: "debug",//日志等级
verbose: true
// 记录日志到控制台
var url = casper.cli.raw.get('url');
var outputfile = casper.cli.raw.get('outputfile');
//请求页面
casper.start(url, function () {
fs.write(outputfile, this.getHTML(), 'w');
casper.run();
&&& python 代码, checkout_proxy.py&&&&&&
import json
import sys
#import requests
#import requests.utils, pickle
from bs4 import BeautifulSoup
import os.path,os
import threading
#from multiprocessing import Process, Manager
from datetime import datetime
import traceback
import logging
import re,random
import subprocess
import shutil
import platform
output_file = os.path.join(os.path.dirname(os.path.realpath(__file__)),'proxy.txt')
global_log = 'http_proxy' + datetime.now().strftime('%Y-%m-%d') + '.log'
if not os.path.exists(os.path.join(os.path.dirname(os.path.realpath(__file__)),'logs')):
os.mkdir(os.path.join(os.path.dirname(os.path.realpath(__file__)),'logs'))
global_log = os.path.join(os.path.dirname(os.path.realpath(__file__)),'logs',global_log)
logging.basicConfig(level=logging.DEBUG,format='[%(asctime)s] [%(levelname)s] [%(module)s] [%(funcName)s] [%(lineno)d] %(message)s',filename=global_log,filemode='a')
log = logging.getLogger(__name__)
#manager = Manager()
#PROXY_LIST = manager.list()
mutex = threading.Lock()
PROXY_LIST = []
def isWindows():
if "Windows" in str(platform.uname()):
return True
return False
def getTagsByAttrs(tagName,pageContent,attrName,attrRegValue):
soup = BeautifulSoup(pageContent)
return soup.find_all(tagName, { attrName : re.compile(attrRegValue) })
def getTagsByAttrsExt(tagName,filename,attrName,attrRegValue):
if os.path.isfile(filename):
f = open(filename,'r')
soup = BeautifulSoup(f)
return soup.find_all(tagName, { attrName : re.compile(attrRegValue) })
return None
class Site1Thread(threading.Thread):
def __init__(self,outputFilePath):
threading.Thread.__init__(self)
self.outputFilePath = outputFilePath
self.fileName = str(random.randint(100,1000)) + ".html"
self.setName('Site1Thread')
def run(self):
site1_file = os.path.join(os.path.dirname(os.path.realpath(__file__)),'site.js')
site2_file = os.path.join(self.outputFilePath,'site.js')
if not os.path.isfile(site2_file) and os.path.isfile(site1_file):
shutil.copy(site1_file,site2_file)
#proc = subprocess.Popen(["bash","-c", "cd %s && ./casperjs site.js --url=http://spys.ru/free-proxy-list/IE/ --outputfile=%s" % (self.outputFilePath,self.fileName) ],stdout=subprocess.PIPE)
if isWindows():
proc = subprocess.Popen(["cmd","/c", "%s/casperjs site.js --url=http://spys.ru/free-proxy-list/IE/ --outputfile=%s" % (self.outputFilePath,self.fileName) ],stdout=subprocess.PIPE)
proc = subprocess.Popen(["bash","-c", "cd %s && ./casperjs site.js --url=http://spys.ru/free-proxy-list/IE/ --outputfile=%s" % (self.outputFilePath,self.fileName) ],stdout=subprocess.PIPE)
municate()[0]
htmlFileName = ''
#因为输出路径在windows不确定，所以这里加了所有可能的路径判断
if os.path.isfile(self.fileName):
htmlFileName = self.fileName
elif os.path.isfile(os.path.join(self.outputFilePath,self.fileName)):
htmlFileName = os.path.join(self.outputFilePath,self.fileName)
elif os.path.isfile(os.path.join(os.path.dirname(os.path.realpath(__file__)),self.fileName)):
htmlFileName = os.path.join(os.path.dirname(os.path.realpath(__file__)),self.fileName)
if (not os.path.isfile(htmlFileName)):
print 'Failed to get html content from http://spys.ru/free-proxy-list/IE/'
sys.exit(3)
mutex.acquire()
PROXYList= getTagsByAttrsExt('font',htmlFileName,'class','spy14$')
for proxy in PROXYList:
tdContent = proxy.renderContents()
lineElems = re.split('[&&]',tdContent)
pile(r'\d+').search(lineElems[-1]) pile('(\d+\.\d+\.\d+)').search(lineElems[0]):
print lineElems[0],lineElems[-1]
PROXY_LIST.append("%s:%s" % (lineElems[0],lineElems[-1]))
mutex.release()
if os.path.isfile(htmlFileName):
os.remove(htmlFileName)
if __name__ == '__main__':
if(len(sys.argv)) & 2:
print "Usage:%s [casperjs path]" % (sys.argv[0])
sys.exit(1)
if not os.path.exists(sys.argv[1]):
print "casperjs path: %s does not exist!" % (sys.argv[1])
sys.exit(2)
if os.path.isfile(output_file):
f = open(output_file)
lines = f.readlines()
for line in lines:
PROXY_LIST.append(line.strip())
thread1 = Site1Thread(sys.argv[1])
thread1.start()
thread1.join()
f = open(output_file,'w')
for proxy in set(PROXY_LIST):
f.write(proxy+"\n")
print "Done!"
except SystemExit:
errMsg = traceback.format_exc()
print errMsg
log.error(errMsg)
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具如何利用百度地图JSAPI画带箭头的线？
&百度地图JSAPI提供两种绘制多折线的方式，一种是已知多折线经纬度坐标串通过AddOverlay接口进行添加；另一种是通过在地图上鼠标单击进行绘制（鼠标绘制工具条库）。目前这两种方式只能绘制多折线，并不能同时绘制线的箭头，以下介绍如何在线的拐点同时绘制箭头，以供参考。最终效果如下：
& & 1. 绘制箭头方法：
& & 上图中，线段AB是通过JSAPI画线方式添加的，只要绘制出CBD就可以实现箭头效果。为了灵活绘制箭头，需要用户自定义箭头的长度(r)和角度(angle)。
& & 实现步骤如下：
& & &变量定义：pixelStart： 线的一端屏幕坐标，pixelEnd：线的箭头端屏幕坐标；r：选取多长距离绘制箭头（单位像素，并不是CB对应的箭头的长度，而是红色线段对应的距离）；angle：箭头线（CB或者DB）与AB的夹角。
& & &1) 首先要将AB两点的经纬度坐标转换成屏幕坐标。
& & &2) 然后根据AB两点屏幕坐标以及r长度，计算绿色小绿点的屏幕坐标pixelTem。
& & &3) 然后根据B点、小绿点的屏幕坐标及angle角度，计算出C,D两点的屏幕坐标。
& & &4) 利用map的坐标转换方法，将C,D两点的屏幕坐标转成经纬度表示的坐标。
& & &5) 利用画线方法，绘制CBD多折线。
& & & 备注：思路很简单，主要是计算小绿点、C,D的屏幕坐标麻烦。楼主计算这些点的公式均来自与初中数学公式，就不再赘述直接上代码了。
& & &完整代码如下：
&!DOCTYPE html& &
&meta http-equiv=&Content-Type& content=&text/ charset=utf-8& /& &
&style type=&text/css&& &
body, html,#allmap {width: 100%;height: 100%;overflow:margin:0;} &
#l-map{height:100%;width:78%;float:border-right:2px solid #} &
#r-result{height:100%;width:20%;float:} &
&/style& &
&script type=&text/javascript& src=&http://api./api?v=1.4&&&/script& &
&title&折线&/title& &
&div id=&allmap&&&/div& &
&script type=&text/javascript&& &
var map = new BMap.Map(&allmap&); &
var point = new BMap.Point(116.404, 39.915); &
map.centerAndZoom(point, 15); &
map.addControl(new BMap.NavigationControl()); &
map.enableScrollWheelZoom(); &
var polyline = new BMap.Polyline([ &
& //new BMap.Point(116.399, 39.910), &
& new BMap.Point(116.405, 39.920), &
& new BMap.Point(116.425,39.91936), &
& new BMap.Point(116.415,39.93936), &
// new BMap.Point(116.415,39.92936), &
], {strokeColor:&blue&, strokeWeight:3, strokeOpacity:0.5}); &
map.addOverlay(polyline); &
addArrow(polyline,10,Math.PI/7); &
function addArrow(polyline,length,angleValue){ //绘制箭头的函数 &
var linePoint=polyline.getPath();//线的坐标串 &
var arrowCount=linePoint. &
for(var i =1;i&arrowCi++){ //在拐点处绘制箭头 &
var pixelStart=map.pointToPixel(linePoint[i-1]); &
var pixelEnd=map.pointToPixel(linePoint[i]); &
var angle=angleV//箭头和主线的夹角 &
var r= // r/Math.sin(angle)代表箭头长度 &
var delta=0; //主线斜率，垂直时无斜率 &
var param=0; //代码简洁考虑 &
var pixelTemX,pixelTemY;//临时点坐标 &
var pixelX,pixelY,pixelX1,pixelY1;//箭头两个点 &
if(pixelEnd.x-pixelStart.x==0){ //斜率不存在是时 &
& & pixelTemX=pixelEnd.x; &
& & if(pixelEnd.y&pixelStart.y) &
& & pixelTemY=pixelEnd.y-r; &
& & else &
& & pixelTemY=pixelEnd.y+r; &
& & } & &&
& & //已知直角三角形两个点坐标及其中一个角，求另外一个点坐标算法 &
& & pixelX=pixelTemX-r*Math.tan(angle); &&
& & pixelX1=pixelTemX+r*Math.tan(angle); &
& & pixelY=pixelY1=pixelTemY; &
else &//斜率存在时 &
& & delta=(pixelEnd.y-pixelStart.y)/(pixelEnd.x-pixelStart.x); &
& & param=Math.sqrt(delta*delta+1); &
& & if((pixelEnd.x-pixelStart.x)&0) //第二、三象限 &
& & pixelTemX=pixelEnd.x+ r/ &
& & pixelTemY=pixelEnd.y+delta*r/ &
& & else//第一、四象限 &
& & pixelTemX=pixelEnd.x- r/ &
& & pixelTemY=pixelEnd.y-delta*r/ &
& & //已知直角三角形两个点坐标及其中一个角，求另外一个点坐标算法 &
& & pixelX=pixelTemX+ Math.tan(angle)*r*delta/ &
& & pixelY=pixelTemY-Math.tan(angle)*r/ &
& & pixelX1=pixelTemX- Math.tan(angle)*r*delta/ &
& & pixelY1=pixelTemY+Math.tan(angle)*r/ &
var pointArrow=map.pixelToPoint(new BMap.Pixel(pixelX,pixelY)); &
var pointArrow1=map.pixelToPoint(new BMap.Pixel(pixelX1,pixelY1)); &
var Arrow = new BMap.Polyline([ &
& & pointArrow, &
&linePoint[i], &
& & pointArrow1 &
], {strokeColor:&blue&, strokeWeight:3, strokeOpacity:0.5}); &
map.addOverlay(Arrow); &
&/script& &Echarts python 如何画地图？ - 知乎5被浏览1217分享邀请回答option = {
'map': 'china',
需要做的修改大致是在option.py文件中加入一个class Geo(Base)class Geo(Base):
def __init__(self, config):
self.config = config
def json(self):
"""JSON format data."""
return self.config
然后再在__init__.py里引入Geo，并且修改use函数和json函数from .option import Axis, Legend, Series, Tooltip, Toolbox, VisualMap, Geo
def use(self, obj):
if isinstance(obj, Axis):
if obj.position in ('bottom', 'top'):
self.x_axis.append(obj)
self.y_axis.append(obj)
return self
if isinstance(obj, Legend):
self.legend = obj
elif isinstance(obj, Tooltip):
self.tooltip = obj
elif isinstance(obj, Series):
self.series.append(obj)
elif isinstance(obj, Toolbox):
self.toolbox = obj
elif isinstance(obj, VisualMap):
self.visualMap = obj
elif isinstance(obj, Geo):
self.geo = obj
return self
def json(self):
"""JSON format data."""
'title': self.title,
'series': list(map(dict, self.series)),
if self.axis:
json['xAxis'] = list(map(dict, self.x_axis)) or [{}]
json['yAxis'] = list(map(dict, self.y_axis)) or [{}]
if hasattr(self, 'legend'):
json['legend'] = self.legend.json
if hasattr(self, 'tooltip'):
json['tooltip'] = self.tooltip.json
if hasattr(self, 'toolbox'):
json['toolbox'] = self.toolbox.json
if hasattr(self, 'visualMap'):
json['visualMap'] = self.visualMap.json
if hasattr(self, 'geo'):
json['geo'] = self.geo.json
json.update(self.kwargs)
return json
最后，在plot.j2里引入相应的map&!DOCTYPE html&
&meta charset="utf-8"&
&title&ECharts&/title&
&!-- 引入 echarts.js --&
&script src="/ajax/libs/echarts/3.1.10/echarts.min.js"&&/script&
&!-- 引入 china.js --&
&script type="text/javascript" src="/gallery/vendors/echarts/map/js/china.js"&&/script&
&!-- 为ECharts准备一个具备大小（宽高）的Dom --&
&div id="main" style="width: 100 height: 100"&&/div&
&script type="text/javascript"&
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {{ opt }};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
然后就可以这么使用了：import json
from echarts import Geo, Echart
chart = Echart('CHINA', axis=False) # 不使用axis选项
chart.use(Geo({'map':'china'}))
chart.plot()
要我说……还不如直接用js呢。。。29 条评论分享收藏感谢收起9524人阅读
d3.js（1）
d3.js是一个比较强的数据可视化js工具。利用它画了一幅中国地图，如下图所示：
源码如下：
&!DOCTYPE html&
&script type=&text/javascript& src=&d3.js&&&/script&
&script type=&text/javascript& src=&d3.csv.js&&&/script&
&script type=&text/javascript& src=&d3.geo.js&&&/script&
&script type=&text/javascript& src=&d3.geom.js&&&/script&
&div id='map'&&/div&
&script type=&text/javascript&&
var w = 1280,
var projection = d3.geo.azimuthal()//
//mercator()
//.mode(&equidistant&)
//.origin([-98, 38])
//.scale(1400)
//.translate([640, 360]);
.mode(&equidistant&)
.origin([107, 32])///???
.scale(1000)
.translate([w/2, h/2]);
var path = d3.geo.path()
.projection(projection);
var svg = d3.select(&#map&).insert(&svg:svg&)
//.append('svg')//
.attr(&width&, w)
.attr(&height&, h);
var states = svg.append(&svg:g&)
.attr(&id&, &states&);
var circles = svg.append(&svg:g&)
.attr(&id&, &circles&);
var texts = svg.append(&svg:g&)
.attr(&id&, &texts&);
var cells = svg.append(&svg:g&)
.attr(&id&, &cells&);
d3.json(&china.json&, function(collection) {
states.selectAll(&path&)
.data(collection.features)
.enter().append(&svg:path&)
.attr(&d&, path)
.attr('fill','#ddd')
.attr('stroke','#222')
.attr('stroke-width','1px')
var positions=[];
d3.csv('china-cities.csv',function(c){
circles.selectAll(&circle&)
.enter().append(&svg:circle&)
.attr(&cx&, function(d,i){return projection([d.lon,d.lat])[0];})
.attr(&cy&,function(d,i){return projection([d.lon,d.lat])[1];})
.attr(&r&, 3)
.attr('fill','red');
texts.selectAll(&text&)
.enter().append(&svg:text&)
.text(function(d){return d.})
.attr(&x&, function(d){
var local=projection([d.lon,d.lat]);
if(d.lon=='113.5575191')//处理澳门
return (local[0]-30);
else return local[0];})
.attr(&y&,function(d){
var local=projection([d.lon,d.lat]);
if(d.lat=='39.1439299') return (local[1]+10);//处理天津
else return local[1];
.attr('fill','#000')
.attr('font-size','14px')
china-cities.csv中国城市经纬度csv文件 &http://download.csdn.net/detail/svap1/7868247
中国地图json格式 &&http://download.csdn.net/detail/svap1/7821315
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：92366次
积分：1532
积分：1532
排名：千里之外
原创：52篇
转载：27篇
评论：20条
(2)(1)(2)(3)(1)(1)(1)(2)(1)(1)(1)(1)(6)(1)(1)(4)(3)(1)(15)(1)(5)(4)(11)(11)