发送http头在表单提交CasperJS
Sending http headers in form submission CasperJS
我用CasperJS做了以下测试步骤:
this.fillSelectors("#registration-form", {
"#first-name": "Bob",
"#last-name": "Smith",
"#email-address": RANDOM_EMAIL,
"#password": PASSWORD,
"#password-confirm": PASSWORD
}, true);
我希望能够发送一个HTTP头与此。我似乎找不到一种不"手动"发布表单的方法,这不是我想要的那种测试。
有一个比下面这个更简单的方法。你可以访问PhantomJS的网页实例的casper.page.customHeaders
属性。
casper.then(function() {
casper.page.customHeaders = {
"CuStOm": "Header"
}; // set headers
this.fillSelectors("#registration-form", { /*...*/ }, true);
});
casper.then(function() {
casper.page.customHeaders = {}; // reset headers
});
问题是,这个方法将添加您的自定义头到每个请求,直到您再次禁用它。您可以尝试基于setTimeout
或直接在fillSelectors
之后重置标头。
您不能在浏览器中为表单提交设置标题。__utils__.sendAJAX
也不提供自定义头。
您需要使用XMLHttpRequest来发送请求。下面的函数替换表单的提交处理程序来发送Ajax调用,并等待:
casper.thenFormToXHR = function(formSelector, data, customHeaders){
this.thenEvaluate(function(formSelector, customHeaders){
// see https://stackoverflow.com/a/19838177/1816580
function submitForm(oFormElement) {
window.__requestDone = false;
var xhr = new XMLHttpRequest();
for(var header in customHeaders) {
xhr.setRequestHeader(header, customHeaders[header]);
}
xhr.onload = function(){
window.__requestDone = true;
};
xhr.open (oFormElement.method, oFormElement.action, true);
xhr.send (new FormData(oFormElement));
return false;
}
document.querySelector(formSelector).onsubmit = submitForm;
}, formSelector, customHeaders);
this.then(function(){
this.fillSelectors(formSelector, data, true);
});
this.waitFor(function check(){
return this.evaluate(function(){
return window.__requestDone;
});
});
};
你可以这样调用:
casper.thenFormToXHR("#registration-form", {
"#first-name": "Bob",
"#last-name": "Smith",
"#email-address": RANDOM_EMAIL,
"#password": PASSWORD,
"#password-confirm": PASSWORD
}, {
"X-Requested-With": "XMLHttpRequest" // here should be your custom headers
});
如果不需要等待XHR完成,可以减少代码:
casper.formToXHR = function(formSelector, data, customHeaders){
this.evaluate(function(formSelector, customHeaders){
// see https://stackoverflow.com/a/19838177/1816580
function submitForm(oFormElement) {
var xhr = new XMLHttpRequest();
for(var header in customHeaders) {
xhr.setRequestHeader(header, customHeaders[header]);
}
xhr.open (oFormElement.method, oFormElement.action, true);
xhr.send (new FormData(oFormElement));
return false;
}
document.querySelector(formSelector).onsubmit = submitForm;
}, formSelector, customHeaders);
this.fillSelectors(formSelector, data, true);
};
相关文章:
- HTML表单提交时未执行外部函数
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- 将图像上传ajax与表单提交ajax相结合
- Javascript无法处理表单提交
- 如何在我的情况下禁用表单提交
- 加载后的页面与ajax表单提交不起作用
- angularjs-控制器在表单提交时未调用
- 禁用带有字符白名单的表单提交
- 如何使用Google Analytics跟踪表单提交
- 使用javascript将表单提交到iframe目标中
- e.preventDefault在表单提交时被忽略
- AngularJS JQuery Ajax表单提交等效
- JavaScript表单提交帮助
- PHP表单提交和重定向
- 当所有输入文本字段都为空时,禁止表单提交,但当jquery中的任何字段不为空时允许提交
- setTimeOut AFTER jQuery表单提交
- 从函数中选择要触发表单提交的正确元素
- JavaScript表单提交没有't fire asp服务器端点击功能的提交按钮
- 表单提交问题,如何在我的URL末尾获得ID的值
- 发送http头在表单提交CasperJS