如何从 JavaScript 调用 REST Web 服务 API？

javascript html rest web-services

2022-08-30 00:23:41

我有一个带有按钮的HTML页面。当我单击该按钮时，我需要调用 REST Web 服务 API。我尝试到处在线搜索。没有任何线索。有人可以给我一个线索/领先吗？非常感谢。

答案 1

我很惊讶没有人提到新的Fetch API，在撰写本文时，除了IE11之外，所有浏览器都支持它。它简化了您在许多其他示例中看到的 XMLHttpRequest 语法。

API包含更多内容，但从方法开始。它需要两个参数：fetch()

表示请求的 URL 或对象。
包含方法、标头、正文等的可选初始化对象。

简单获取：

const userAction = async () => {
  const response = await fetch('http://example.com/movies.json');
  const myJson = await response.json(); //extract JSON from the http response
  // do something with myJson
}

重新创建上一个顶部答案，即 POST：

const userAction = async () => {
  const response = await fetch('http://example.com/movies.json', {
    method: 'POST',
    body: myBody, // string or object
    headers: {
      'Content-Type': 'application/json'
    }
  });
  const myJson = await response.json(); //extract JSON from the http response
  // do something with myJson
}

答案 2

你的Javascript：

function UserAction() {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
         if (this.readyState == 4 && this.status == 200) {
             alert(this.responseText);
         }
    };
    xhttp.open("POST", "Your Rest URL Here", true);
    xhttp.setRequestHeader("Content-type", "application/json");
    xhttp.send("Your JSON Data Here");
}

您的按钮操作：：

<button type="submit" onclick="UserAction()">Search</button>

欲了解更多信息，请点击以下链接（2017/01/11更新）