Automatic website login opening Chrome

Question

Is there any way to open a tab from a Chrome extension immediately after Chrome gets opened? My school has an access point which you have to sign in to every time you open up your computer to use the internet, and I would like to make an extension that automatically logs me in, but I cannot figure out how to make the script run as soon as I open Chrome.

EDIT: The login page is not the page that is opened when I open the browser: I've got to manually go to a certain site to make the system prompt me to log in, otherwise it will just tell me I'm not connected to the internet.

Answer 1

Preparation

What you need to do here is to:

1. Create a basic "empty" extension with the required manifest.json file.
2. Declare the "background" field, which will run a backgrond.js script to open the login page when Chrome is opened, using the chrome.tabs API. You'll need then to add a permission for that.
3. Declare the "content_scripts" field in your manifest, and set a contnet.js script to match the login URL that gets opened and allows you to log in.
4. The script (content.js), which will be executed in the created tab, will contain the code to automatically fill the fields with username and password and click the log-in button.

Implementation

1. Create a basic extension, which will contain three files:

   • manifest.json: the extension's manifest
   • background.js: the extension's background script
   • content.js: your content script

2. Write the essential fields in your manifest, like: version, name, background etc. Then add the "content_scripts" field to declare your script. Your manifest.json should then look like this:

   {
       "manifest_version": 2,
   
       "name": "Some name",
       "version": "0",
   
       "permissions": [
           "tabs"
       ],
   
       "background": {
           "scripts": ["background.js"]
       },
   
       "content_scripts": {
           {
               "matches": ["http://your-login-page-url..."],
               "js": "/content.js"
           }
       }
   }
   

3. In your background.js script you'll open a tab right when the extension is started (which is also when Chrome gets opened), like this:

   chrome.tabs.create({url: "http://your-login-page-url..."});
   // this URL ---------------^^ should be the same as the one that matches the content script in the manifest.json
   

   Change the URL with the real one and check that the opened tab is the right one.

4. Now, in your content.js script, which will be loaded into the tab that has just been created, you'll get the right fields and fill them up, then click the login button.

   For example, if the login page looks something like this:

   ...
       <span>User:</span><input id="username" type="text"/>
       <span>Password:</span><input id="password" type="password"/>
       <button id="login-btn">Log in</button>
   ...
   

   Then in your content.js script you'll do:

   document.getElementById('username').value = 'yourusername';
   document.getElementById('password').value = 'yourpassword';
   document.getElementById('login-btn').click();
   

   Obviously you'll have to replace yourusername and yourpassowrd with the real credentials.

That's all, pretty easy: just a tab creation and a content script injected inside it. This extension will now log-in for you right when you open Chrome!