Unexpected behavior when set baseUrl and use Post method

Hi, I encountered with problem when do post request. If I use this approach, all work good

import axios from 'axios'

var loginApiService = {
    getToken() {
        axios.post("/token", { email: "[e-mail]", password: "pass" })
            .then((response) => {
                return response.data;
            });
}

Request : POST http://localhost:59288/token HTTP/1.1 Host: localhost:59288 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0 Accept: application/json, text/plain, / Accept-Language: ru-RU,ru;q=0.8,en-US;q=0.5,en;q=0.3 Accept-Encoding: gzip, deflate Referer: http://localhost:59288/login?redirect=%2F Content-Type: application/json;charset=utf-8 Content-Length: 43 Cookie: Connection: keep-alive Pragma: no-cache Cache-Control: no-cache

{“email”:“[e-mail]”,“password”:“pass”}

But if I set base url :

import axios from ‘axios’

var loginApiService = {
    getToken() {

        axios({
            method: 'post',
            url: 'http://localhost:33333/token',
            data: {
                email: "[e-mail]",
                password:
                    "pass"
            }
        });
}

I have request:

OPTIONS http://localhost:33333/token HTTP/1.1 Host: localhost:33333 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8 Accept-Language: ru-RU,ru;q=0.8,en-US;q=0.5,en;q=0.3 Accept-Encoding: gzip, deflate Access-Control-Request-Method: POST Access-Control-Request-Headers: content-type Origin: http://localhost:59288 Connection: keep-alive Pragma: no-cache Cache-Control: no-cache

I did not see data in body and get 404 from server.

The same problem if I use

import axios from 'axios'
var apiClient = function () {
    return axios.create({
        baseURL: 'http://localhost:33333/',
        headers: {
            'Content-Type': 'application/json',
        }
    });
}

If I set Content-Type to application/x-www-form-urlencoded, it works, but I can obtain data only from FromForm. But I want to work with body.

Context

axios : 0.18v firefox: 61.0b5

[dreamevilgf]

I found out reason of this behavior. I didn’t allow CORS requests on server side.

I added cors policy and now axios works fine!

[savioserra]

Seems like your endpoint is on port 59288 in the first example. In the second one, you explicitly changed the port to 33333, and got a 404 (not found, which seems right to me).

I would recommend you to make both requests via curl and share the results with us.