Question 33465 in React native Question posted in
The official React Native documentation can be found here.

How to solve Axios react native post request error

I am trying to do a user registration in react native but i am getting an error.

I have tried this

var Data56 = {
  name: name,
  email: email,
  babyname: babyname,
  phone: nuber,
  // period: date2,
  baby_date: date,
};

// headers: { 'content-type': 'application/x-www-form-urlencoded' },
console.log(Data56);

axios
  .post("http://10.0.2.2:8000/api/register", Data56, {
    headers: {
      "Content-Type": "application/x-www-form-urlencoded",
    },
  })

  .then((res) => {
    //if succcess redirect to another url and pass data to that url
    // if (res.status == 200) {
    props.navigation.navigate("Home_scrren", { data: Data56 });
    // }
  })
  .catch((error) => {
    alert(error);
  });

And this is the error in screenshots below

enter image description here

enter image description here

but it is working in postman

enter image description here

C:Usersviveksukprsavamcomponentssignupfor.jsx:122 {"message":"Network Error","name":"AxiosError","stack":"AxiosError: Network Errorn    at XMLHttpRequest.handleError (http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.sukprsavam&modulesOnly=false&runModule=true:103296:16)","config":{"transitional":{"silentJSONParsing":true,"forcedJSONParsing":true,"clarifyTimeoutError":false},"adapter":["xhr","http"],"transformRequest":[null],"transformResponse":[null],"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":-1,"maxBodyLength":-1,"env":{},"headers":{"Accept":"application/json, text/plain, */*","Content-Type":"application/json"},"method":"post","url":"http://10.0.2.2/api/register","data":"{"name":"vivek kn","email":"[email protected]","phone":"7558973998","baby_date":"27/12/2022"}"},"code":"ERR_NETWORK","status":null}
Tags:

3

Answers


  1. 0

    Two Solutions

    Sol1:

    var Data56 = {
        name: name,
        email: email,
        babyname: babyname,
        phone: nuber,
        // period: date2,
        baby_date: date,
      };
      
      // headers: { 'content-type': 'application/x-www-form-urlencoded' },
      console.log(Data56);
      
      axios.request({
        url:"http://10.0.2.2:8000/api/register",
        data:Data56,
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/x-www-form-urlencoded',
           
          },
      }).then((res) => {
          //if succcess redirect to another url and pass data to that url
          // if (res.status == 200) {
          props.navigation.navigate("Home_scrren", { data: Data56 });
          // }
        })
        .catch((error) => {
          alert(error);
        });

    Sol 2: install dependency for FormData;

     var Data56 = {
            name: name,
            email: email,
            babyname: babyname,
            phone: nuber,
            // period: date2,
            baby_date: date,
          };

 var formData = new FormData();
      formData.append('name', name);
      formData.append('email', email);
      formData.append('babyname', babyname);
      formData.append('phone', nuber);
      formData.append('baby_date', date);
  // headers: { 'content-type': 'application/x-www-form-urlencoded' },
  console.log(Data56);
  
  axios.request({
    url:"http://10.0.2.2:8000/api/register",
    data:formData,
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/x-www-form-urlencoded',
       
      },
  }).then((res) => {
      //if succcess redirect to another url and pass data to that url
      // if (res.status == 200) {
      props.navigation.navigate("Home_scrren", { data: Data56 });
      // }
    })
    .catch((error) => {
      alert(error);
    });
    Login or Signup to reply.
  2. 0

    Please try this may solve your issue.

      // if (res.data.status == 200) {
props.navigation.navigate("Home_scrren", { data: Data56 });
// }
    Login or Signup to reply.
  3. 0

    Have a try by sending data in string format.

    Install qs library to convert json data to string query parameter data.

    import qs from 'qs';

var Data56 = {
  name: name,
  email: email,
  babyname: babyname,
  phone: nuber,
  // period: date2,
  baby_date: date,
};

axios
  .post("http://10.0.2.2:8000/api/register", qs.stringify(Data56), {
    headers: {
      "Content-Type": "application/x-www-form-urlencoded",
    },
  })
  .then((res) => {
    //if succcess redirect to another url and pass data to that url
    // if (res.status == 200) {
    props.navigation.navigate("Home_scrren", { data: Data56 });
    // }
  })
  .catch((error) => {
    alert(error);
  });
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search