How can I login to an AngularJS website with python?

Issue

I've tried reading more than 10 questions here on Stack Overflow on this subject, so forgive me if this' been aswered before. I hardly ever ask questions because I always feel my answer is somewhere in here and all I have to do is look for it, but I gotta admit that I'm at a loss here.

I'm looking to automate downloading a few reports from a specific website (http://ecargo.mercosulline.com.br/), after navigating through it with Python requests module. However, I can't get past the login screen.. haha

If tried many different snippets of code, but I'll paste what I am most "confident" below:

with requests.Session() as s:
headers = {'User-Agent': 'Mozilla/5.0 (Windows NT 6.1; WOW64; rv:52.0) Gecko/20100101 Firefox/52.0'}     

payload = {
    #'txt_nome':'username',
    #'txt_senha':'password'
    'usuario':'username',
    'senha':'password'
}

url = 'http://ecargo.mercosulline.com.br/SERVICOS/WSMontarMenu.Service.svc/rest/ChecarUsuario'
#url = 'http://ecargo.mercosulline.com.br/NovoIndex.asp'
#r = s.get(url)
#print(r.content)

r = s.post(url, data=payload, headers=headers)
print(r.text)

Upon inspecting the page while logging in, I see that my browser makes 2 "POST" requests:

1st. http://ecargo.mercosulline.com.br/SERVICOS/WSMontarMenu.Service.svc/rest/ChecarUsuario with 'usuario' as the field name for username and 'senha' as the field name for password.

2nd. http://ecargo.mercosulline.com.br/NovoIndex.asp there it uses the webpage form names (txt_nome and txt_senha) as can be seen in the piece of html below:

<form name="frmLogin">
                        <br/>

                        <div class="form-group">
                            <input class="form-control" placeholder="Usuário" name="txt_nome" type="text" value="{{viewModel.usuario}}" autofocus ng-model="viewModel.usuario">
                        </div>

                        <br/>

                        <div class="form-group">
                            <input class="form-control" placeholder="Senha" name="txt_senha" type="password" value="{{viewModel.senha}}" ng-model="viewModel.senha">
                        </div>

                        <br/>

                        <button class="btn btn-lg btn-success btn-block" type="submit" ng-click="viewModel.logar()">Entrar</button>

                        <br/>
                    </form>

If I POST the data in the 1st URL, it doesn't work at all - just gives me an error and says "check server log for more details" If I post the data in the 2nd URL and print its contents, it just brings me back to the login page.

It seems this page was created with AngularJS so I'm not sure requests module is the right one? Would anyone please help me?

Solution

First of all, you have to use your Browser Developer Tools And then navigate to Network Monitor.

Then try to login to the site.

You will notice the following:

That's mean a POST request has been done using JSON where you need to use json= but if it's form-data so you will use data=

Check the document as a ref.

import requests

data = {
    'senha': 'test@test.com',
    'usuario': 'test123'
}

r = requests.post(
    "http://ecargo.mercosulline.com.br/SERVICOS/WSMontarMenu.Service.svc/rest/ChecarUsuario", json=data).json()


print(r)

Answered By - αԋɱҽԃ αмєяιcαη