Hướng dẫn can you use rest api with javascript? - bạn có thể sử dụng api nghỉ với javascript không?

Tôi có một trang HTML có nút trên đó. Khi tôi nhấp vào nút đó, tôi cần gọi API dịch vụ web REST. Tôi đã thử tìm kiếm trực tuyến ở khắp mọi nơi. Không có manh mối gì. Ai đó có thể cho tôi một khách hàng tiềm năng/đầu tiên về điều này? Rất nhiều đánh giá cao.

Kian

1.3492 Huy hiệu vàng12 Huy hiệu bạc19 Huy hiệu đồng2 gold badges12 silver badges19 bronze badges

Khi được hỏi ngày 2 tháng 5 năm 2016 lúc 5:40May 2, 2016 at 5:40

Shaik Syed Alishaik Syed AliShaik Syed Ali

3.0993 Huy hiệu vàng15 Huy hiệu bạc20 Huy hiệu Đồng3 gold badges15 silver badges20 bronze badges

1

Tôi ngạc nhiên khi không ai đề cập đến API Fetch mới, được hỗ trợ bởi tất cả các trình duyệt ngoại trừ IE11 tại thời điểm viết. Nó đơn giản hóa cú pháp XMLHTTPREQUEST mà bạn thấy trong nhiều ví dụ khác.

API bao gồm nhiều hơn nữa, nhưng bắt đầu với phương thức

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
}

1. Một URL hoặc một đối tượng đại diện cho yêu cầu.
2. Đối tượng init tùy chọn chứa phương thức, tiêu đề, cơ thể, v.v.

Nhận đơn giản:

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
}

Tái tạo câu trả lời hàng đầu trước đó, một bài đăng:

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
}

Đã trả lời ngày 15 tháng 8 năm 2018 lúc 6:44Aug 15, 2018 at 6:44

Brendan McGillbrendan McGillBrendan McGill

5,8854 Huy hiệu vàng19 Huy hiệu bạc28 Huy hiệu đồng4 gold badges19 silver badges28 bronze badges

5

JavaScript của bạn:

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");
}

Hành động nút của bạn ::

Search

Để biết thêm thông tin, hãy đi qua liên kết sau (cập nhật 2017/01/11)

Đã trả lời ngày 2 tháng 5 năm 2016 lúc 5:55May 2, 2016 at 5:55

6

Dưới đây là một cuộc gọi API REST JavaScript khác với xác thực bằng JSON:

call

Bhola

3921 Huy hiệu bạc15 Huy hiệu đồng1 silver badge15 bronze badges

Đã trả lời ngày 9 tháng 6 năm 2017 lúc 16:37Jun 9, 2017 at 16:37

4

    $("button").on("click",function(){
      //console.log("hii");
      $.ajax({
        headers:{  
           "key":"your key",
     "Accept":"application/json",//depends on your api
      "Content-type":"application/x-www-form-urlencoded"//depends on your api
        },   url:"url you need",
        success:function(response){
          var r=JSON.parse(response);
          $("#main").html(r.base);
        }
      });
});

Đã trả lời ngày 1 tháng 3 năm 2017 lúc 18:11Mar 1, 2017 at 18:11

Aayushiaayushiaayushi

3494 Huy hiệu bạc11 Huy hiệu đồng4 silver badges11 bronze badges

Tôi nghĩ thêm if (this.ReadyState == 4 && this.status == 200) để chờ là tốt hơn:

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
       // Typical action to be performed when the document is ready:
        var response = xhttp.responseText;
        console.log("ok"+response);
    }
};
xhttp.open("GET", "your url", true);

xhttp.send();

Đã trả lời ngày 12 tháng 4 năm 2018 lúc 15:54Apr 12, 2018 at 15:54

martinwang1985martinwang1985martinwang1985

5183 Huy hiệu vàng26 Huy hiệu bạc42 Huy hiệu Đồng3 gold badges26 silver badges42 bronze badges

1

Nếu điều đó giúp bất cứ ai, nếu bạn ổn với một thư viện bên ngoài thì tôi có thể chứng minh cho Axios, có một API khá sạch sẽ và tài liệu phong phú để xử lý các cuộc gọi REST, đây là một ví dụ dưới đây:-

const axios = require('axios');

axios.get('/user?ID=12345')
  .then(function (response) {
    // handle success
    console.log(response);
  });

Đã trả lời ngày 2 tháng 5 lúc 0:26May 2 at 0:26

Shuvo Aminshuvo AminShuvo Amin

4135 Huy hiệu bạc10 Huy hiệu Đồng5 silver badges10 bronze badges

Trước khi chúng tôi cố gắng đặt bất cứ thứ gì ở phía trước của trang web, hãy mở kết nối API. Chúng tôi sẽ làm như vậy bằng cách sử dụng các đối tượng xmlhttprequest, đây là một cách để mở các tệp và thực hiện yêu cầu HTTP.

Chúng tôi sẽ tạo một biến yêu cầu và gán một đối tượng XMLHTTPrequest mới cho nó. Sau đó, chúng tôi sẽ mở một kết nối mới với phương thức Open () - trong các đối số, chúng tôi sẽ chỉ định loại yêu cầu là nhận cũng như URL của điểm cuối API. Yêu cầu hoàn thành và chúng tôi có thể truy cập dữ liệu bên trong chức năng Onload. Khi chúng tôi hoàn thành, chúng tôi sẽ gửi yêu cầu. // Tạo một biến yêu cầu và gán một đối tượng XMLHTTPrequest mới cho nó. var request = new xmlhttprequest ()
// Create a request variable and assign a new XMLHttpRequest object to it. var request = new XMLHttpRequest()

// Open a new connection, using the GET request on the URL endpoint
request.open('GET', 'https://ghibliapi.herokuapp.com/films', true)

request.onload = function () {
  // Begin accessing JSON data here
  }
}

// Send request
request.send()

Đã trả lời ngày 17 tháng 6 năm 2019 lúc 5:33Jun 17, 2019 at 5:33

1

Cho đến nay, dễ nhất đối với tôi là Axios. Bạn có thể tải xuống mô -đun nút hoặc sử dụng CDN cho các dự án đơn giản hơn của bạn.

CDN:

Ví dụ về mã cho get/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
}

Đã trả lời ngày 27 tháng 10 lúc 17:27Oct 27 at 17:27

Không còn nghi ngờ gì nữa, phương pháp đơn giản nhất sử dụng phần tử hình thức vô hình trong HTML chỉ định phương thức REST mong muốn. Sau đó, các đối số có thể được chèn vào các trường giá trị

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
}

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
}

Lưu ý rằng ví dụ này sẽ thay thế trang bằng đầu ra từ trang rest.php. Tôi không chắc làm thế nào để sửa đổi điều này nếu bạn muốn API được gọi mà không có hiệu ứng hiển thị trên trang hiện tại. Nhưng nó chắc chắn đơn giản.

Đã trả lời ngày 8 tháng 8 năm 2020 lúc 22:26Aug 8, 2020 at 22:26

Cách thông thường là đi với PHP và AJAX. Nhưng theo yêu cầu của bạn, dưới đây sẽ hoạt động tốt.

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
}

Đã trả lời ngày 6 tháng 3 năm 2019 lúc 6:58Mar 6, 2019 at 6:58

API REST hoạt động như thế nào JavaScript?

Chúng ta có thể viết API bằng JavaScript không?

Ngôn ngữ lập trình nào là tốt nhất cho API REST?

Làm thế nào sẽ sử dụng một API trong JavaScript?