Home > other >  undefined variable under jquery payload
undefined variable under jquery payload

Time:06-07

I'm trying to post some data to an API but I'm struggling with javascript.

function pushData() {
  let rawdata;
  $.ajaxSetup({
    async: false
  });
  $.getJSON('https://api.db-ip.com/v2/free/self', function(result) {
    result = rawdata;
  })
  console.log(rawdata);

  let message = {
    "ip": rawdata.ipAddress,
    "country": rawdata.countryName,
    "city": rawdata.city
  };

  console.log(message);

  $.ajax({
    url: "https://xxxx.execute-api.eu-west-2.amazonaws.com/get",
    headers: {},
    /*         crossDomain: true,
     */
    type: "GET",
    success: function(result) {
      console.log(result);
    },
    error: function() {
      console.log("error");
    }
  })
}
$.ajax({
  url: "https://xxxx.execute-api.eu-west-2.amazonaws.com/post",
  crossDomain: true,
  type: "POST",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  data: JSON.stringify(message),
  success: function(result) {
    console.log(result);
  },
  error: function() {
    console.log("error pushing data");
  }
})

I'm getting Uncaught ReferenceError: message is not defined although I think that message is a global variable, so it should be called successfully on the payload? What I'm I doing wrong here?

Thanks to anyone for his reply in advance, I'm just trying to write a quick script for my API here.

CodePudding user response:

message is a local variable in the pushData() function, not a global variable. But even if it were global, you'd have to call the function before the second $.ajax() call.

Move the second AJAX call inside the function so you can access the variable. And embrace asynchrony, don't fight it with async: false. Nest the successive AJAX calls inside the callback function of the previous one.

function pushData() {
  $.getJSON('https://api.db-ip.com/v2/free/self', function(rawData) {
    console.log(rawdata);

    let message = {
      "ip": rawdata.ipAddress,
      "country": rawdata.countryName,
      "city": rawdata.city
    };

    console.log(message);

    $.ajax({
          url: "https://xxxx.execute-api.eu-west-2.amazonaws.com/get",
          headers: {},
          /*         crossDomain: true,
           */
          type: "GET",
          success: function(result) {
            console.log(result);
            $.ajax({
              url: "https://xxxx.execute-api.eu-west-2.amazonaws.com/post",
              crossDomain: true,
              type: "POST",
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              data: JSON.stringify(message),
              success: function(result) {
                console.log(result);
              },
              error: function() {
                console.log("error pushing data");
              }
            })
          });
      },
      error: function() {
        console.log("error");
      }
  })
}

  • Related