How to login into a website with CasperJS?

Question

How can I login with CasperJS by submitting a form. I searched google and haven't found any good examples about it.

Stack Overflow example with cookies: https://github.com/cirosantilli/stack-overflow-vote-fraud-script/blob/1477d09ae365c2997ded514539898efd55171091/vote.js Cookies question: http://stackoverflow.com/questions/15907800/how-to-persist-cookies-between-different-casperjs-processes — Ciro Santilli OurBigBook.com, Dec 25 '15 at 01:06

score 52 · Accepted Answer · edited Dec 14 '16 at 10:40

52

You will need to use Casper fill() function.

Below is an example which login to Facebook and print out your name after login. Note that you need to put in your username and password:

var casper = require('casper').create({   
    verbose: true, 
    logLevel: 'debug',
    pageSettings: {
         loadImages:  false,         // The WebPage instance used by Casper will
         loadPlugins: false,         // use these settings
         userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.4 (KHTML, like Gecko) Chrome/22.0.1229.94 Safari/537.4'
    }
});

// print out all the messages in the headless browser context
casper.on('remote.message', function(msg) {
    this.echo('remote message caught: ' + msg);
});

// print out all the messages in the headless browser context
casper.on("page.error", function(msg, trace) {
    this.echo("Page Error: " + msg, "ERROR");
});

var url = 'http://www.facebook.com/';

casper.start(url, function() {
   console.log("page loaded");
   this.test.assertExists('form#login_form', 'form is found');
   this.fill('form#login_form', { 
        email: '**<put your email here>**', 
        pass:  '**<put your password here>**'
    }, true);
});

casper.thenEvaluate(function(){
   console.log("Page Title " + document.title);
   console.log("Your name is " + document.querySelector('.headerTinymanName').textContent ); 
});

casper.run();

edited Dec 14 '16 at 10:40

Jordan Stewart

3,187
3
25
37

answered Nov 14 '12 at 10:05

Ngo Hung

754
7
9

thanks. I love PhantomJS/CasperJS :) It is one of the coolest project for automation and data scraping. However, note that things will get very complex if you want to login to multiple websites and handle cookies on server. It is also eating memory for fun. – Ngo Hung Nov 14 '12 at 10:36
2

If i were to multithread this with PHP how would this code react to prevent constant loging in and out. Is there a way to check if you are loged in and skip the code? – Nov 14 '12 at 10:42
1

you should store your cookie in a predefined path for that website. Depending on the website, the cookie should be valid for a long time (half an hour at least). You can pass this option via [command line](http://casperjs.org/cli.html). The more complete list of cookies APIs are found [here](https://github.com/ariya/phantomjs/wiki/API-Reference). As cookies is just a text file, there are many ways to manipulate or pass it between PHP and CasperJS/PhantomJS – Ngo Hung Nov 14 '12 at 10:49
@NgoHung, just curious? How did you know about the casper.on method? I can't see it in the documentation http://casperjs.org/api.html – Programming Noob Jul 08 '13 at 08:00
3

it is under the events page: http://casperjs.org/events-filters.html . The best way to understand their APIs is to read the sample folder under github repository. I think I learnt that way. – Ngo Hung Jul 08 '13 at 08:36

score 7 · Answer 2 · edited Dec 14 '16 at 11:41

Here is a slightly changed version of the code from Ngo Hung. The selector for the username was off as was the assignment of the userAgent:

var casper = require('casper').create({   
    verbose: true, 
    logLevel: 'debug',
    userAgent: 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_6_8) AppleWebKit/537.22 (KHTML, like Gecko) Chrome/25.0.1364.172 Safari/537.22',
    pageSettings: {
      loadImages:  false,         // The WebPage instance used by Casper will
      loadPlugins: false         // use these settings
    }
});

// print out all the messages in the headless browser context
casper.on('remote.message', function(msg) {
    this.echo('remote message caught: ' + msg);
});

// print out all the messages in the headless browser context
casper.on("page.error", function(msg, trace) {
    this.echo("Page Error: " + msg, "ERROR");
});

var url = 'http://www.facebook.com/';

casper.start(url, function() {
    console.log("page loaded");
    this.test.assertExists('form#login_form', 'form is found');
    this.fill('form#login_form', { 
        email: '**<put your email here>**', 
        pass:  '**<put your password here>**'
    }, true);
});

casper.thenEvaluate(function(){
    console.log("Page Title " + document.title);
    console.log("Your name is " + document.querySelector(".fbxWelcomeBoxName").innerHTML);
});

casper.run();

UPDATE: I recommend anyone else to use a site of their own, or at least not facebook.com if they are planning large amounts of testing. Facebook could tell that I was trying to log in over and over started emailing me and making me confirm my account with SMS.

I tried this and get 'CasperError: casper.test property is only available using the `casperjs test` command'. If I try that I get 'Fatal: you can't override the preconfigured casper instance in a test environment.' Any ideas? — codecowboy, Jan 04 '14 at 16:58
@codecowboy a `casper` instance is injected into the script when you call it through `casper test script.js`. Remove `var casper = require('casper').create();` and configure it using the `casper.options` property. — Artjom B., Apr 26 '14 at 12:24
Caleb G you should save and reuse cookies to avoid the problem you mentioned in the update .. — dorjeduck, Mar 08 '15 at 01:56

How to login into a website with CasperJS?

2 Answers2

Linked