错误代码：尝试使用 Casperjs 捕获网页时出现 402
Error Code: 402 when trying to capture Web Page with Casperjs
我无法正确捕获我使用 Casperjs 登录的网页。我得到一张网页图片，其中只有一个带 "Not Implemented" 的 H1 标签。这是下面的脚本：
var casper = require('casper').create({
pageSettings: {
loadImages: false,//The script is much faster when this field is set to false
loadPlugins: false,
userAgent: 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.157 Safari/537.36',
customHeaders:{
'Authorization':'Basic '+btoa('someusername:somepassword')
}
}
});
casper.on("resource.error", function(resourceError){
console.log('Unable to load resource (#' + resourceError.id + 'URL:' + resourceError.url + ')');
console.log('Error code: ' + resourceError.errorCode + '. Description: ' + resourceError.errorString);
});
//First step is to open SkySpark Login
casper.start().thenOpen("http://192.168.9.150:89/user/login", function() {
console.log("SkySpark website opened");
});
//Second step is to click to the Sign-in button
casper.then(function(){
this.evaluate(function(){
document.getElementById("nav-tools").children[0].click();
});
});
//Now we have to populate username and password, and submit the form
casper.then(function(){
console.log("Login using username and password");
this.evaluate(function(){
document.getElementById("username").value="someusername";
document.getElementById("password").value="somepassword";
document.getElementById("loginForm").submit();
});
});
//Wait to be redirected to the Home page, and then make a screenshot
casper.then(function(){
console.log("Make a screenshot and save it as SkySparkTens.png");
this.capture('SkySparkTens.png');
});
//prints HTML to the console
casper.then(function(){
this.wait(5000, function() {
console.log(this.getHTML() );
});
});
casper.run();
这是我返回的控制台响应：
D:\temp\CasperLogin>casperjs logCasper.js
SkySpark 网站开通
使用用户名和密码登录
无法加载资源 (#4URL:http://192.168.9.150:89/user/login)
错误代码：402。说明：下载错误 http://192.168.9.150:89/user/log
在 - 服务器回复：未实现
截图并保存为SkySparkTens.png
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>501 Not Implemented</title>
</head>
<body>
<h1>Not Implemented</h1>
</body>
</html>
这是我尝试访问的站点的登录页面上显示的表单。
<script type='text/javascript'>
userModLogin.passwordRequired = false;
userModLogin.authUri = "/user/auth";
userModLogin.redirectUri = '/ui/';
userModLogin.localeLogin = 'Login';
userModLogin.localeLoggingIn = 'Logging in';
userModLogin.localeBadCres = 'Invalid username or password';
userModLogin.autoFocusId = 'username';
window.onload = function() { userModLogin.init(false); }
</script>
</head>
<body>
<form id='loginForm' method='post' action='/user/login'>
<p class='logo'>
<img src='/brand/logo.svg' title='SkySpark' alt='SkySpark' /> </p>
<p id='err'>
Invalid username or password</p>
<p>
<label for='username'>
Username:</label>
<input type='text' id='username' name='username'placeholder='Username' /></p>
<p>
<label for='password'>Password:</label>
<input type='password' id='password' name='password' size='25' autocomplete='off' placeholder='Password' /></p>
<p>
<label for='mobile'>
<input type='checkbox' id='mobile' value='mobile' /> Mobile</label>
</p>
<p>
<input type='submit' id='loginButton' value='Login' onclick='return userModLogin.loginAuth();' /></p>
</form>
</body>
我的脚本终于可以正常工作了，我还使脚本比我发布的原始脚本更加动态。
我意识到有两个问题导致我的脚本无法运行。第一个问题是捕获在创建 pdf 之前没有等待页面完全加载。下面这一行获取 URL 并等待它加载。这确保了稍后脚本中的屏幕截图会创建一个完全加载页面的 pdf。
this.waitForUrl(casper.cli.get("report"), function() {
casper.back();
});
我还通过下面这一行将超时时间从 5 秒增加到 25 秒，以确保加载数据量大的报告而不会超时。
casper.options.waitTimeout = 25000;
第二个问题是我试图从中创建 PDF 的网页使用了一个名为 Domkit 的 Fantom pod。 Domkit 无法在 Phantomjs 虚拟浏览器中正确加载。我通过从我试图用 Casperjs 捕获的网页的 UI 中删除 domkit 解决了这个问题。
下面是完整的脚本
/*
note: all parameters should be formatted like so on the command line: -- parameter=value
note: all paramters must be separated by a space from each other: -- paramter1=value1 parameter2=value2
Parameter 1: --filename (required, Whatever name given here will be the name of the file)
Parameter 2: --username (required, This needs to be the users SkySpark username)
Parameter 3: --password (required, This needs to be the users SkySPark password)
Parameter 4: --report (required, url needed to get to the desired report in SkySpark)
Parameter 4: --directory (optional will default to the io directory if null. This is the path needed to
get to the desired place to store file. All \ must be entered as /)
Parameter 5: --fileType (optional will default to PDF if null, fileType needed to render the file as desired type(pdf,png,jpeg,jpg),
only png and pdf are supported)
*/
var casper = require('casper').create({
// verbose: true,
// logLevel: 'debug',
pageSettings: {
loadImages: true,//The script is much faster when this field is set to false
loadPlugins: false,
userAgent: 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.157 Safari/537.36'
}
});
//First step is to open the report in SkySpark.
casper.start().thenOpen(casper.cli.get("report"), function() {
console.log("SkySpark website opened");
});
//Changes the timeout from 5 seconds to 25 seconds
casper.options.waitTimeout = 25000;
//Now we have to populate username and password, and submit the form
casper.then(function(username, password){
console.log("Login using username and password");
//take user name and password from variables and creates varaible to pass into the evaluate
var uName = casper.cli.get("username");
var pWord = casper.cli.get("password")
/*function that will be executed in the DOM context (you can also call it the page context).
You can pass some primitives as arguments to this function and return one primitive back.
Keep in mind that this function that you pass to evaluate must be self contained. It cannot use
variables or functions that are defined outside of this function.
*/
this.evaluate(function(username, password){
//SkySpark
document.getElementById("username").value = username;
document.getElementById("password").value = password;
document.getElementById("loginButton").click();
}, uName, pWord);
//This waits for the report to load completely before continueing
this.waitForUrl(casper.cli.get("report"), function() {
casper.back();
});
});
//Gets the path from the parameters, if user puts null as parameter the paramter will be set to the io directory in SkySpark
var directory;
if(casper.cli.get("directory") == null || casper.cli.get("directory").length <= 1){
directory = 'D:\SkySpark\skyspark-3.0.9\var\proj\development\io\';
}else{
directory = casper.cli.get("directory");
}
//fileType determines what the captured file will be.
var fileType;
if(casper.cli.get("fileType") == "png"){
fileType = '.png';
}else if(casper.cli.get("fileType") == "jpg" || casper.cli.get("fileType") =="jpeg" ){
fileType = '.jpeg';
}else{
fileType = '.pdf';
}
//Wait to be redirected to the Home page, and then make a screenshot
casper.then(function(){
console.log("Make a screenshot and save it as Sky Home Page");
this.capture(directory + casper.cli.get("filename") + fileType);
console.log(directory + casper.cli.get("filename") + fileType);
this.echo(this.getCurrentUrl());
});
casper.run();
我无法正确捕获我使用 Casperjs 登录的网页。我得到一张网页图片，其中只有一个带 "Not Implemented" 的 H1 标签。这是下面的脚本：
var casper = require('casper').create({
pageSettings: {
loadImages: false,//The script is much faster when this field is set to false
loadPlugins: false,
userAgent: 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.157 Safari/537.36',
customHeaders:{
'Authorization':'Basic '+btoa('someusername:somepassword')
}
}
});
casper.on("resource.error", function(resourceError){
console.log('Unable to load resource (#' + resourceError.id + 'URL:' + resourceError.url + ')');
console.log('Error code: ' + resourceError.errorCode + '. Description: ' + resourceError.errorString);
});
//First step is to open SkySpark Login
casper.start().thenOpen("http://192.168.9.150:89/user/login", function() {
console.log("SkySpark website opened");
});
//Second step is to click to the Sign-in button
casper.then(function(){
this.evaluate(function(){
document.getElementById("nav-tools").children[0].click();
});
});
//Now we have to populate username and password, and submit the form
casper.then(function(){
console.log("Login using username and password");
this.evaluate(function(){
document.getElementById("username").value="someusername";
document.getElementById("password").value="somepassword";
document.getElementById("loginForm").submit();
});
});
//Wait to be redirected to the Home page, and then make a screenshot
casper.then(function(){
console.log("Make a screenshot and save it as SkySparkTens.png");
this.capture('SkySparkTens.png');
});
//prints HTML to the console
casper.then(function(){
this.wait(5000, function() {
console.log(this.getHTML() );
});
});
casper.run();
这是我返回的控制台响应：
D:\temp\CasperLogin>casperjs logCasper.js
SkySpark 网站开通
使用用户名和密码登录
无法加载资源 (#4URL:http://192.168.9.150:89/user/login) 错误代码：402。说明：下载错误 http://192.168.9.150:89/user/log 在 - 服务器回复：未实现
截图并保存为SkySparkTens.png
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>501 Not Implemented</title>
</head>
<body>
<h1>Not Implemented</h1>
</body>
</html>
这是我尝试访问的站点的登录页面上显示的表单。
<script type='text/javascript'>
userModLogin.passwordRequired = false;
userModLogin.authUri = "/user/auth";
userModLogin.redirectUri = '/ui/';
userModLogin.localeLogin = 'Login';
userModLogin.localeLoggingIn = 'Logging in';
userModLogin.localeBadCres = 'Invalid username or password';
userModLogin.autoFocusId = 'username';
window.onload = function() { userModLogin.init(false); }
</script>
</head>
<body>
<form id='loginForm' method='post' action='/user/login'>
<p class='logo'>
<img src='/brand/logo.svg' title='SkySpark' alt='SkySpark' /> </p>
<p id='err'>
Invalid username or password</p>
<p>
<label for='username'>
Username:</label>
<input type='text' id='username' name='username'placeholder='Username' /></p>
<p>
<label for='password'>Password:</label>
<input type='password' id='password' name='password' size='25' autocomplete='off' placeholder='Password' /></p>
<p>
<label for='mobile'>
<input type='checkbox' id='mobile' value='mobile' /> Mobile</label>
</p>
<p>
<input type='submit' id='loginButton' value='Login' onclick='return userModLogin.loginAuth();' /></p>
</form>
</body>
我的脚本终于可以正常工作了，我还使脚本比我发布的原始脚本更加动态。
我意识到有两个问题导致我的脚本无法运行。第一个问题是捕获在创建 pdf 之前没有等待页面完全加载。下面这一行获取 URL 并等待它加载。这确保了稍后脚本中的屏幕截图会创建一个完全加载页面的 pdf。
this.waitForUrl(casper.cli.get("report"), function() {
casper.back();
});
我还通过下面这一行将超时时间从 5 秒增加到 25 秒，以确保加载数据量大的报告而不会超时。
casper.options.waitTimeout = 25000;
第二个问题是我试图从中创建 PDF 的网页使用了一个名为 Domkit 的 Fantom pod。 Domkit 无法在 Phantomjs 虚拟浏览器中正确加载。我通过从我试图用 Casperjs 捕获的网页的 UI 中删除 domkit 解决了这个问题。
下面是完整的脚本
/*
note: all parameters should be formatted like so on the command line: -- parameter=value
note: all paramters must be separated by a space from each other: -- paramter1=value1 parameter2=value2
Parameter 1: --filename (required, Whatever name given here will be the name of the file)
Parameter 2: --username (required, This needs to be the users SkySpark username)
Parameter 3: --password (required, This needs to be the users SkySPark password)
Parameter 4: --report (required, url needed to get to the desired report in SkySpark)
Parameter 4: --directory (optional will default to the io directory if null. This is the path needed to
get to the desired place to store file. All \ must be entered as /)
Parameter 5: --fileType (optional will default to PDF if null, fileType needed to render the file as desired type(pdf,png,jpeg,jpg),
only png and pdf are supported)
*/
var casper = require('casper').create({
// verbose: true,
// logLevel: 'debug',
pageSettings: {
loadImages: true,//The script is much faster when this field is set to false
loadPlugins: false,
userAgent: 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/44.0.2403.157 Safari/537.36'
}
});
//First step is to open the report in SkySpark.
casper.start().thenOpen(casper.cli.get("report"), function() {
console.log("SkySpark website opened");
});
//Changes the timeout from 5 seconds to 25 seconds
casper.options.waitTimeout = 25000;
//Now we have to populate username and password, and submit the form
casper.then(function(username, password){
console.log("Login using username and password");
//take user name and password from variables and creates varaible to pass into the evaluate
var uName = casper.cli.get("username");
var pWord = casper.cli.get("password")
/*function that will be executed in the DOM context (you can also call it the page context).
You can pass some primitives as arguments to this function and return one primitive back.
Keep in mind that this function that you pass to evaluate must be self contained. It cannot use
variables or functions that are defined outside of this function.
*/
this.evaluate(function(username, password){
//SkySpark
document.getElementById("username").value = username;
document.getElementById("password").value = password;
document.getElementById("loginButton").click();
}, uName, pWord);
//This waits for the report to load completely before continueing
this.waitForUrl(casper.cli.get("report"), function() {
casper.back();
});
});
//Gets the path from the parameters, if user puts null as parameter the paramter will be set to the io directory in SkySpark
var directory;
if(casper.cli.get("directory") == null || casper.cli.get("directory").length <= 1){
directory = 'D:\SkySpark\skyspark-3.0.9\var\proj\development\io\';
}else{
directory = casper.cli.get("directory");
}
//fileType determines what the captured file will be.
var fileType;
if(casper.cli.get("fileType") == "png"){
fileType = '.png';
}else if(casper.cli.get("fileType") == "jpg" || casper.cli.get("fileType") =="jpeg" ){
fileType = '.jpeg';
}else{
fileType = '.pdf';
}
//Wait to be redirected to the Home page, and then make a screenshot
casper.then(function(){
console.log("Make a screenshot and save it as Sky Home Page");
this.capture(directory + casper.cli.get("filename") + fileType);
console.log(directory + casper.cli.get("filename") + fileType);
this.echo(this.getCurrentUrl());
});
casper.run();