单个HTML页面上的REST API发布请求

如何解决单个HTML页面上的REST API发布请求

我正在尝试使用端点URL提交发布请求。我将内容类型作为application / json发送，并为用户名和密码发送了两个标头值。当我尝试通过邮递员访问它时，我得到200个响应代码以及tokenId和successUrl，但是当通过下面的JavaScript代码完成相同操作时，我得到401。当我尝试通过JSP和Java。我不是Java语言专家，无法弄清原因。我阅读了CORS文章，但不确定为什么跨域不是Java / JSP代码的问题，而是JavaScript的问题。下面是代码：

<!DOCTYPE html>
<html>
<body>

<h2>REST</h2>

<button type="button" onclick="myFunc()">Request data</button>

<p id="demo"></p>
 
<script>
function myFunc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML = this.responseText;
    }
  };
  xhttp.open("POST","Endpoint URL entered here",true);
  xhttp.setRequestHeader("Content-type","application/json");
  xhttp.setRequestHeader("X-OpenAM-Username","username entered here");
  xhttp.setRequestHeader("X-OpenAM-Password","password entered here");
  xhttp.send();
}
</script>

</body>
</html>

Chrome浏览器出现的错误如下：

从源'null'对'Endpoint URL'处的XMLHttpRequest的访问已被CORS策略阻止：对预检请求的响应未通过访问控制检查：没有'Access-Control-Allow-Origin'标头出现在请求的资源上。

a.html：23 POST'Endpoint URL'net :: ERR_FAILED

EDIT1： Firefox浏览器上的错误如下：

XHROPTIONS'端点URL' [HTTP / 1.1 401未经授权2025ms]

跨域请求被阻止：“相同来源策略”不允许读取“端点URL”上的远程资源。（原因：CORS标头“ Access-Control-Allow-Origin”缺失）。

跨域请求被阻止：“相同来源策略”不允许读取“端点URL”上的远程资源。（原因：CORS请求未成功）。

请让我知道我到底在做错什么。

解决方法

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

作为CORS的一部分，您的浏览器将向服务器发送所谓的“预检请求”，以查看是否会接受您的请求。它正在检查一些事情，在这种情况下，服务器未使用“ Acess-Control-Allow-Origin”标头回复预检，因此您的浏览器知道您尝试发送的请求将失败并阻止它被发送出去。

在浏览器环境之外不会发生这种情况-Postman不在乎服务器是否会使用适当的标头进行响应。

如果您有权访问服务器，则需要配置CORS策略，以允许来自您的特定来源（网站）的请求。如果您可以提供更多有关您的设置的信息，很乐意为您提供帮助。

单个HTML页面上的REST API发布请求

如何解决单个HTML页面上的REST API发布请求

解决方法

相关推荐