web-dev-qa-db-ja.com

CasperJsでフォームに入力してログインする方法

以下は私が持っているログインフォームのhlmlです

<div class="login_area_user">

            <form method="post" action="https://www.tradus.com/login?dest_url=https://www.tradus.com/cart/select-address" id="user-login">
            <input type="hidden" value="1" name="form_submit">

                <h3 style="display:inline-block;">Already a Member</h3>

                <p id="login-main-center-right-descp">You can use tradus login id and password</p>

                <div class="login-row">
                    <label class="colorBlack">Email / Login*</label>
                    <input class="login-field" type="text" name="name" id="edit-namepopup">
                </div> <!-- [/login-row] -->

                <div class="login-row">
                    <label>Password</label>
                    <input class="login-field" type="password" id="edit-passpopup" name="pass">
                </div> <!-- [/login-row] -->

                <div class="login-row">            
                    <a class="forgotPassword" href="/forgot_password">Forgot your password?</a>
                    <!--input type="checkbox" name="remember" /><span>Remember me</span-->
                </div>

                <div class="login-row">
                    <input class="login-button" value="Login" type="submit">
                </div>

                <input type="hidden" name="op" value="Log in">

            </form>

        </div>

ログインに次のコードを使用しています：

this.fill('form#user-login', {
        'form_submit':    1,
        'name':    '[email protected]',
        'pass':   'pwd',
        'op':       'Log in'

    }, true);

しかし、私はそれが私のためにそのことをすることはしません。

javascriptphantomjsfillcasperjs
16
user2129794
casper.waitForSelector("form input[name='name']", function() {
    this.fillSelectors('form#user-login', {
        'input[name = name ]' : '[email protected]',
        'input[name = pass ]' : 'pwd'
    }, true);
});

単にこれを使用してください（ waitForSelector docs を参照）。まず、フォームが読み込まれるのを待ちます。次に、セレクターを使用してフォームに入力します。

19
Shikhar
casper.waitForSelector('form', function(){
    this.fill('form', {
    'name': '[email protected]', 
    'pass': 'pwd'}, true);
});

<!-- wait until a form tag disappears -->
casper.waitWhileSelector('form', function(){
    this.echo('selector is no more!');
});

casper.then(function(){
    this.echo(this.getTitle());
});
10
tadashigaki

他の誰かがこれを見つけた場合..私はこれらの回答のいくつかの組み合わせを使用しました-私のログインフォームもiframe内にあり、いくらか問題が追加されましたが、基本的に私が見た問題（Cookieベースのログイン）はキャスパーが次のステップに進んでいたということですサーバーが応答してCookieを設定する前。そのcookieを取得するのに十分な時間を確保するために、いくつかの.wait（）コールバックを追加しました。それは絶対確実ではないかもしれませんが、私はまだそれについて問題がありません

注意してください、クッキーは毎回設定する必要があります

casper.start(config.loginUrl, function() {

console.log("Checking login status @ " + config.loginUrl);

// set a wait condition to make sure the page is loaded (particularly iframe in my case) 
this.wait(5000,function(){

    // switch to iframe (won't be necessary for most)
    this.page.switchToChildFrame('login'); 

    // fill out the form 
    this.fillSelectors("form[name='loginForm']",{
        'input#txtUsername' : config.username,
        'input#txtPassword' : config.password
    });

    // click the login button 
    console.log("Logging In...")
    this.click('input.button.login');

    // ** give my crappy dev server 5 seconds to respond
    this.wait(5000,function(){
    console.log('Starting to spider ' + dataObj.start)

    // do yo dance  
    spider(dataObj.start);
    });
3
twill

うーん..それに続いて：

casper.then(function () {
    this.evaluate(function () {
        $('form#user-login').submit();
    });
});
1
ringular