博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Casperjs中fill提交表单遇到的问题
阅读量:4131 次
发布时间:2019-05-25

本文共 1952 字,大约阅读时间需要 6 分钟。

Casperjs中fill的作用是填充表单值,并可以提交(可选),API:,这里不详述它的用法。

今天遇到一个问题,在此记录一下。问题是这样的:我一个可以正常提交form的casperjs脚本,在windows可以正常工作,之前在一台centos的linux服务器上也可以正常工作,今天在一台ubuntu12.04的服务器上却不行,尝试过各种办法(降低casperjs/phantomjs版本等)都不行。调用fill方法后,打出warning消息:[warning] [remote] unable to submit form。为了查找原因,我都去翻看了它上的源码,想知道是哪块儿出了问题,找到以下代码块儿:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// Form submission?
if
(submit) {
    
this
.evaluate(
function
_evaluate(selector) {
        
var
form = __utils__.findOne(selector);
        
var
method = (form.getAttribute(
'method'
) || "GET").toUpperCase();
        
var
action = form.getAttribute(
'action'
) || "unknown";
        
__utils__.log(
'submitting form to '
+ action + 
', HTTP '
+ method, 
'info'
);
        
var
event = document.createEvent(
'Event'
);
        
event.initEvent(
'submit'
true
true
);
        
if
(!form.dispatchEvent(event)) {
            
__utils__.log(
'unable to submit form'
'warning'
);
            
return
;
        
}
        
if
(
typeof
form.submit === "
function
") {
            
form.submit();
        
else
{
            
// 
            
form.submit.click();
        
}
    
}, selector);
}

看下来似乎是没有办法dispatchEvent “submit”的event。但是此时我的心情是“朕知道了,但朕也无能为力”……

考虑到这应该是兼容性的问题,不能也不好做什么大改动。但又必须让它正常工作。所以尝试寻找其它等同效果的办法。现在的问题是提交,而casperjs的api中除了这个fill方法没有提交直接的submit方法。这该怎么办法呢?接下来,我从casperjs的 api示例代码中得到启发。调用evaluate进入页面然后调用原生js的submit方法提交表单。怀着试一下心态运行了一下,各环境都能正常工作!

所以,为了兼容性,Casperjs中这样的写法:

1
2
3
4
5
6
7
8
9
this
.fill(
'form#contact-form'
, {
'subject'
:    
'I am watching you'
,
'content'
:    
'So be careful.'
,
'civility'
:   
'Mr'
,
'name'
:       
'Chuck Norris'
,
'email'
:      
'chuck@norris.com'
,
'cc'
:         
true
,
'attachment'
'/Users/chuck/roundhousekick.doc'
}, 
true
);

应该写成下面这样比较好:

1
2
3
4
5
6
7
8
9
10
11
12
this
.fill(
'form#contact-form'
, {
    
'subject'
:    
'I am watching you'
,
    
'content'
:    
'So be careful.'
,
    
'civility'
:   
'Mr'
,
    
'name'
:       
'Chuck Norris'
,
    
'email'
:      
'chuck@norris.com'
,
    
'cc'
:         
true
,
    
'attachment'
'/Users/chuck/roundhousekick.doc'
}, 
false
);
this
.evaluate(
function
(){
    
document.querySelector(
'form#contact-form'
).submit();
});

转载地址:http://ynbvi.baihongyu.com/

你可能感兴趣的文章
element ui 弹窗在IE11中关闭时闪现问题修复
查看>>
vue 遍历对象并动态绑定在下拉列表中
查看>>
Vue动态生成el-checkbox点击无法选中的解决方法
查看>>
python __future__
查看>>
MySQL Tricks1
查看>>
python 变量作用域问题(经典坑)
查看>>
pytorch
查看>>
pytorch(三)
查看>>
ubuntu相关
查看>>
C++ 调用json
查看>>
nano中设置脚本开机自启动
查看>>
动态库调动态库
查看>>
Kubernetes集群搭建之CNI-Flanneld部署篇
查看>>
k8s web终端连接工具
查看>>
手绘VS码绘(一):静态图绘制(码绘使用P5.js)
查看>>
手绘VS码绘(二):动态图绘制(码绘使用Processing)
查看>>
基于P5.js的“绘画系统”
查看>>
《达芬奇的人生密码》观后感
查看>>
论文翻译:《一个包容性设计的具体例子:聋人导向可访问性》
查看>>
基于“分形”编写的交互应用
查看>>