TypeError: Failed to fetch - react js

Question

I want to send data to my sever but I got this error:

TypeError: Failed to fetch

my codes:

function login(username, password) {
    const requestOptions = {
        method: 'POST',
        headers: { 'Content-Type': 'application/json','charset':'utf-8' },
        body: JSON.stringify({ 'username':username , 'password':password })
    };

    console.log(requestOptions);

    return fetch(BASE_URL+serverConstants.LOGIN_POST_REQUEST, requestOptions)
        .then(response => {
            if (!response.ok) {
                return Promise.reject(response.statusText);
            }

            return response.json();
        })
        .then(user => {
            // login successful if there's a jwt token in the response
            if (user && user.token) {
                // store user details and jwt token in local storage to keep user logged in between page refreshes
                localStorage.setItem('user', JSON.stringify(user));
            }

            return user;
        });
}

but I tested it on postman I got correct response.

Can you try using the raw body option in postman, since it is closer to the code you have posted: — Daniel Stoyanoff
– Daniel Stoyanoff, Commented Mar 25, 2018 at 15:46

simbathesailor · Accepted Answer · 2018-03-25 16:15:51Z

1

Your preflight request is failing. Allow cross origin for the API you are hitting:

In node you do it like this,

res.header("Access-Control-Allow-Origin", "*");

Hope this helps

answered Mar 25, 2018 at 16:15

simbathesailor

3,6852 gold badges22 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

S.M_Emamian · Accepted Answer · 2018-11-13 12:35:36Z

0

If you want to send values to your sever like form-data from postman sowftware you should use formData (your don't need to import FormData from any class):

var formData = new FormData()
formData.append('yourKey, 'yourValue');

  var requestOptions = {
    method: 'POST',
    headers: {
        'Accept': 'application/json'
    },

    body: formData
};

return fetch('Your url', options)
    .then(checkStatus)
    .then(parseJSON);

of course from your server-side you should enable CORS. CORS depending on your language server-side is different.

edited Nov 13, 2018 at 12:35

answered Nov 13, 2018 at 10:59

S.M_Emamian

17.4k40 gold badges156 silver badges274 bronze badges

Collectives™ on Stack Overflow

TypeError: Failed to fetch - react js

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related