I'm currently facing an issue with calling a JSON-based authentication API. The API requires two parameters, username and password, to be passed in JSON format.
What could be the mistake in my approach? Below is the snippet of my current test code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<title>API Testing Page</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<h1>API Testing Page</h1>
<button id="btn">test</button>
</header>
<p id="result"></p>
<script>
const xhr = new XMLHttpRequest();
xhr.onload = function () {
const serverResponse = document.getElementById("result");
serverResponse.innerHTML = this.responseText;
}
xhr.open("POST", "url");
xhr.setRequestHeader("Content-type", "application/json");
xhr.send("username=test&password=test");
</script>
</body>
</html>