-1

i am trying to post data to server using axios. I can hit GET request but having issues in POST.

# i am using CORS
app = Flask(__name__, static_url_path='',
            static_folder='web/static', template_folder='web/templates')
CORS(app)

#flask server code
@app.route('/login', methods=['GET', 'POST'])
def login():
    print('hi')
    global logingStatus
    global currentUser
    if request.method == 'POST':
        result = db.login(request.form['username'], request.form['password'])
        if result == 'success':
            logingStatus = True
            currentUser = db.getUserObj(request.form['username'])
            # print(type(currentUser), '<----')
            return redirect(url_for('dashboard'))
        else:
            return result
    else:
        logingStatus = False
        return render_template('login.html')

client side code:

axios.post('/login/', {
                        username: this.username,
                        password: this.password
                    }).then(function (response) {
                        if(response.data.includes('ERROR')) {
                            this.errorMessage = response.data
                            this.isError = true
                        }
                    }).catch(function (error) {
                        console.log(error);
                    });

ERROR:

server console:

127.0.0.1 - - [28/Sep/2020 13:55:04] "GET /login HTTP/1.1" 200 -

127.0.0.1 - - [28/Sep/2020 13:55:21] "POST /login/ HTTP/1.1" 405 -

client:

Failed to load resource: the server responded with a status of 405 (METHOD NOT ALLOWED)

What i am doing wrong here ?

Edit:

After answer from @cizario i tried

axios('/login',{...});
# error
Failed to load resource: the server responded with a status of 400 (BAD REQUEST)

I was not sure what was doing wrong. But i not solving my problem.

Also, When i try this:

@app.route('/test', methods=['GET', 'POST'])
def test():
    return 'test'

# response: test
# headers
access-control-allow-origin:*

It's working !

Where previous post request it was giving response 400 BAD REQUEST

Why ?

Eidt 2:

Ok i found the problem it's related to how i access data from request where i should use request.json['username'] instead of request.form['username'] (which causing 400) (in this context). Also, different rout path on both side was causing 405.

1 Answers1

2

just delete the trilling slash in

axios.post('/login', {..})

because you defined login route with out / at the end in

@app.route('/login', methods=['GET', 'POST'])
cizario
  • 2,927
  • 3
  • 7
  • 22
  • i try it initially but it was responding `Failed to load resource: the server responded with a status of 400 (BAD REQUEST)`I was not sure what was exactly i am doing wrong. – sameep baraiya Sep 28 '20 at 09:07
  • Do i really need to send using CSRF cause i can do normal post request using html form ? – sameep baraiya Sep 28 '20 at 09:18
  • @sameepbaraiya i think i was wrong because you already have set `CORS(app)` maybe it could be missing/wrong `headers`, not sure but i'm making some searches – cizario Sep 28 '20 at 09:22
  • @sameepbaraiya i didn't know before but have a look at this SO thread https://stackoverflow.com/questions/45373124/axios-post-request-to-flask it suggest adding `CORS` support this way `CORS(app, resources={r"/YOURAPP/*": {"origins": "*"}})` give it a try, if ok ill update my answer – cizario Sep 28 '20 at 09:40
  • 1
    Yes look that answer before but i found just problem related to how i access the request in flask. request.form['username'] causing issue here. I am not able to retrieve data from request. But, thanks for answer man :) – sameep baraiya Sep 28 '20 at 09:48