Using variables in a Post request for a JSON object with JavaScript

Question

Using variables in a Post request for a JSON object with JavaScript

I am attempting to retrieve an Xmlhttp.response from a website by using the following code snippet:

var apiUrl = "http://somesite/someapicall/correctapiKey";
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("POST", apiUrl, false);
xmlHttp.setRequestHeader("Content-Type", "application/json");
var data {
    "username": username,
    "password": hashedPass,
    "someOption": "true",
    "someOtherOption": "true"
}
xmlHttp.send(data);
var response = xmlHttp.responseText;
var parsed = eval('(' + response + ')');

The code works when I manually input the strings for "username" and "password," but fails when using variables. I have checked for errors repeatedly without success.

I must be overlooking something minor, as I have been troubleshooting this issue all afternoon with no luck :(

Can anyone offer guidance or assistance, please?

Edit: The correct values for both the username and password variables are known and provided. The code has been updated to reflect the usage of these variables.

javascript json

Answer 1

Answer №1

Here's some important information:

 var apiUrl = "http://somesite/someapicall/correctapiKey";

When using an absolute URI like this, be cautious about cross-origin requests and potential issues with the Same Origin Policy. You can also explore ways to work around it.

Take a look at this code snippet:

var data {
    "username": username,
    "password": hashedPass,
    "someOption": "true",
    "someOtherOption": "true"
}

It contains a syntax error. Remember to add an = sign after data.

If "true" is meant to be a boolean value, remove the quotation marks. And always include a semicolon ; after the closing bracket.

You may encounter an issue with this line of code:

xmlHttp.send(data);

Converting data to a string using toString() will result in [Object object]. To send JSON instead, use JSON.stringify(data);

Watch out for this potentially harmful practice:

var parsed = eval('(' + response + ')');

Avoid using eval() as it is considered risky and inefficient. Switch to a safer method by using JSON.parse(response);

Answer 2

Here's some important information:

 var apiUrl = "http://somesite/someapicall/correctapiKey";

When using an absolute URI like this, be cautious about cross-origin requests and potential issues with the Same Origin Policy. You can also explore ways to work around it.

Take a look at this code snippet:

var data {
    "username": username,
    "password": hashedPass,
    "someOption": "true",
    "someOtherOption": "true"
}

It contains a syntax error. Remember to add an = sign after data.

If "true" is meant to be a boolean value, remove the quotation marks. And always include a semicolon ; after the closing bracket.

You may encounter an issue with this line of code:

xmlHttp.send(data);

Converting data to a string using toString() will result in [Object object]. To send JSON instead, use JSON.stringify(data);

Watch out for this potentially harmful practice:

var parsed = eval('(' + response + ')');

Avoid using eval() as it is considered risky and inefficient. Switch to a safer method by using JSON.parse(response);

Using variables in a Post request for a JSON object with JavaScript

Answer №1

Similar questions

Are the SystemIndexes in MongoDB influenced by the database contents, or do they remain fixed regardless of changes in the configuration

What is the process for printing a page in plain text format on a matrix-dot printer?

Locate the nearest index within the array

Invalidating the express response object due to a TypeError issue

Iterate over the items stored in localStorage and display a particular value when clicked

The jQuery AJAX autocomplete result box is either too cramped or displaying numbers

PHP API Integration for XBox

What are the steps for making Ajax calls?

What is preventing us from receiving JSON as the expected response?

Is it possible to employ ES6 modules within Node.js 8?

Retrieve the data stored in the `frontmatter` of `.mdx` files with the help of a `.js` script

Importing Vue and Vuex modules from separate files

Unusual happenings detected in Magellan Fixed with Foundation 5

Encountering the error message "[TypeError]: Unable to access properties of undefined (reading 'prototype')" when utilizing axios post function in next.js

What is the best way to initiate an event using the onMousewheel function?

What is the best way to display JSON data in a Listview control?

Toggling event triggers with the second invocation

Having trouble retrieving the Enum Value from my response JSON

Exporting keys of objects one by one

Revamping password security using token-based password reset system