Tìm hiểu các tùy chọn thay thế để truy vấn dữ liệu thông qua các yêu cầu HTTP trong JavaScript.

Bạn đang xem : Ví dụ về yêu cầu http javascript

Hình ảnh nổi bật

Javascript hiện đại cung cấp một số cách để gửi các yêu cầu HTTP đến các máy chủ từ xa. Từ đối tượng XMLHttpRequest gốc cho đến các thư viện của bên thứ ba như Axios, việc có một bộ sưu tập các lựa chọn đa dạng như vậy đã giúp cho việc yêu cầu và tải động nội dung trong các ứng dụng web trở nên dễ dàng hơn bao giờ hết.

Vì vậy, trong bài đăng hôm nay, chúng ta sẽ thảo luận về các cách khác nhau để gửi yêu cầu HTTP trong Javascript. Bắt đầu từ các tùy chọn gốc do ngôn ngữ cung cấp, chúng tôi sẽ xem xét năm mô-đun sau và gửi các loại yêu cầu HTTP khác nhau với chúng.

Hãy bắt đầu!

XMLHttpRequest

XMLHttpRequest
là một API gốc trong Javascript đóng gói logic của việc gửi các yêu cầu HTTP mà không cần phải làm mới một trang web đã tải (các yêu cầu AJAX). Mặc dù hiện nay các nhà phát triển hiếm khi sử dụng trực tiếp XMLHttpRequest, nhưng nó vẫn là khối xây dựng hoạt động bên dưới nhiều mô-đun yêu cầu HTTP phổ biến.

Vì vậy, hiểu cách gửi yêu cầu bằng phương pháp XMLHttpRequest có thể giúp bạn xử lý các trường hợp sử dụng duy nhất nếu thư viện của bên thứ ba không hỗ trợ nó.

Dưới đây là cách chúng tôi có thể gửi yêu cầu GET và truy xuất dữ liệu không đồng bộ từ API từ xa bằng API XMLHttpRequest:

  

// tạo đối tượng XMLHttpRequest

const

xhr

=

mới

XMLHttpRequest ()

// mở một yêu cầu nhận bằng URL máy chủ từ xa

xhr

.

mở

(

"NHẬN"

,

"https: // world. openfoodfacts.org/category/pastas/1.json "

)

// gửi yêu cầu Http

xhr

.

gửi

()

// XỬ LÝ SỰ KIỆN

// được kích hoạt khi phản hồi hoàn tất

xhr

.

onload

=

hàm

() {

if

(

xhr

.

trạng thái

===

200

) {

// phân tích cú pháp JSON datax`x

dữ liệu

=

JSON

.

phân tích cú pháp

(

xhr < /p>.

responseText

)

bảng điều khiển

.

nhật ký

(

dữ liệu

.

số lượng

)

bảng điều khiển

.

nhật ký

(

dữ liệu

.

sản phẩm

) }

else

if

(

xhr

.

trạng thái

===

404 < / p>) {

bảng điều khiển

.

nhật ký

(

"Không tìm thấy bản ghi"

) } }

// được kích hoạt khi xảy ra lỗi cấp mạng với yêu cầu

xhr

.

onerror

=

hàm

() {

bảng điều khiển

.

nhật ký

(

"Đã xảy ra lỗi mạng"

) }

// được kích hoạt định kỳ khi khách hàng nhận dữ liệu

// được sử dụng để theo dõi tiến trình của yêu cầu

xhr

.

onprogress

=

hàm

(

e < / p>) {

nếu

(

e

.

lengthComputable

) {

bảng điều khiển

.

nhật ký

(

`

$ {

e

.

được tải

}

B trong tổng số

$ {

e

.

} < / p>

B được tải! `

) }

khác

{

bảng điều khiển

.

nhật ký

(

`

$ {

e

.

được tải

}

B được tải! `

) } }

Như ví dụ này cho thấy, quá trình gửi một yêu cầu GET với XMLHttpRequest bao gồm ba bước:

  • Tạo XMLHttpRequest
  • Mở yêu cầu HTTP của loại được thụt lề
  • Gửi yêu cầu

Sau khi yêu cầu được gửi, chúng tôi có thể sử dụng các trình xử lý sự kiện do XMLHttpObject cung cấp để xử lý phản hồi của nó. Ở đây, chúng tôi đã sử dụng hai trình xử lý sự kiện: onload , onerror onprogress . Điều quan trọng cần lưu ý ở đây là phương pháp onerror chỉ xử lý các lỗi cấp mạng liên quan đến yêu cầu. Để xác định lỗi HTTP, chúng tôi phải kiểm tra cụ thể mã trạng thái HTTP bên trong phương thức onload.

Chúng tôi có thể gửi các yêu cầu POST với XMLHttpRequest theo một mẫu tương tự.

  

// tạo đối tượng XMLHttpRequest

const

xhr

=

mới

XMLHttpRequest ()

// mở một yêu cầu ĐĂNG

xhr

.

mở

(

"BÀI ĐĂNG"

,

"/ đồ ăn" )

// đặt tiêu đề loại nội dung thành JSON

xhr

.

setRequestHeader

(

"Loại-Nội dung"

,

"ứng dụng / json"

);

// gửi dữ liệu JSON đến máy chủ từ xa

xhr

.

gửi

(

JSON

.

xâu chuỗi

(

thức ăn

))

// Trình xử lý sự kiện

// theo dõi tiến trình tải lên dữ liệu

xhr

.

tải lên

.

chuyển sang chức năng

=

< / p> (

e

) {

bảng điều khiển

.

nhật ký

(

`

$ {

e

.

được tải

}

B trong tổng số

$ {

e

.

} < / p>

B đã tải lên! `

) }

// được kích hoạt khi quá trình tải lên dữ liệu hoàn tất

xhr

.

tải lên

.

tải lên

=

chức năng < / p> (

e

) {

bảng điều khiển

.

nhật ký

(

"Tải lên hoàn tất"

) }

// được kích hoạt khi nhận được đầy đủ phản hồi

xhr

.

onload

=

hàm

() {

bảng điều khiển

.

nhật ký

(

trạng thái xhr

.

) }

// được kích hoạt do lỗi cấp mạng

xhr

.

onerror

=

hàm

() {

bảng điều khiển

.

nhật ký

(

"Đã xảy ra lỗi mạng"

) }

Một điểm khác biệt chính giữa yêu cầu GET trước đó và yêu cầu POST hiện tại là đặt tiêu đề loại nội dung một cách rõ ràng khi đăng dữ liệu JSON. Ngoài ra, có một loại sự kiện bổ sung mà yêu cầu POST có thể kích hoạt so với yêu cầu GET. Chúng là các sự kiện tải lên được truy cập thông qua trường xhr.upload. Các trình xử lý sự kiện này giúp chúng tôi theo dõi tiến trình tải lên dữ liệu khi nội dung yêu cầu phải mang một lượng dữ liệu đáng kể (ví dụ: hình ảnh, tệp, v.v.)

Ưu điểm của XMLHttpRequest

  • Vì phương pháp này được hỗ trợ nguyên bản nên nó tương thích với tất cả các phiên bản trình duyệt hiện đại.
  • Loại bỏ nhu cầu phụ thuộc bên ngoài.
  • Cho phép truy cập và xử lý các yêu cầu HTTP không đồng bộ ở cấp cơ sở.

Nhược điểm của XMLHttpRequest

  • Mã dài dòng và không cần thiết.
  • Không hỗ trợ cú pháp async / await hoặc dựa trên lời hứa.
  • Hầu hết các gói yêu cầu HTTP mới hơn đều cung cấp các bản tóm tắt đơn giản so với API XMLHttpRequest phức tạp.

Tìm nạp

Tìm nạp
là một API Javascript gốc đơn giản và hiện đại được sử dụng để thực hiện các yêu cầu HTTP. Nó đi kèm với hỗ trợ tích hợp cho các hứa hẹn và cải thiện cú pháp dài dòng của XMLHttpRequest đã được thảo luận trước đó. Là một API được xây dựng dựa trên nhu cầu của nhà phát triển và ứng dụng hiện đại, Fetch đã trở thành một trong những cách phổ biến nhất để gửi yêu cầu HTTP trong Javascript ngày nay.

Theo cú pháp dựa trên lời hứa, chúng tôi có thể sử dụng Tìm nạp để gửi các yêu cầu HTTP từ phía máy khách, như ví dụ này cho thấy.

  

tìm nạp

(

"https://world.openfoodfacts.org/category/pastas/1.json" < / p>) .

sau đó

(

phản hồi

= & gt; {

// cho biết phản hồi có thành công hay không (mã trạng thái 200-299) hay không

nếu

(

!

phản hồi

.

được rồi

) {

ném

mới

Lỗi (

`` Yêu cầu không thành công với trạng thái

$ {

phản hồi lại

.

trạng thái

}

`

) }

trả lại

phản hồi

.

json

() }) .

sau đó

(

dữ liệu

= & gt; {

bảng điều khiển

.

nhật ký

(

dữ liệu

.

số lượng

)

bảng điều khiển

.

nhật ký

(

dữ liệu

.

sản phẩm

) }) .

bắt

(

lỗi

= & gt;

bảng điều khiển

.

nhật ký

(

lỗi

))

Tìm nạp làm giảm đáng kể độ phức tạp và dài dòng của mã bằng cách sử dụng cú pháp và lời hứa đơn giản hơn. Trong quá trình triển khai này, chúng ta phải sử dụng trường response.ok để kiểm tra xem phản hồi có chứa lỗi HTTP hay không vì các lỗi mắc phải trong phương thức catch thuộc cấp mạng chứ không phải cấp ứng dụng.

Phương thức tìm nạp chấp nhận một đối tượng cấu hình làm tham số thứ hai để cho phép thao tác dễ dàng các trường HTTP như tiêu đề, loại nội dung, phương thức yêu cầu, v.v. Bạn có thể tìm thấy danh sách đầy đủ các tùy chọn cấu hình mà Fetch hỗ trợ trong tài liệu chính thức
.

Thực hiện các yêu cầu ĐĂNG với Tìm nạp cũng tuân theo một mẫu tương tự như ví dụ trước. Ở đây, chúng tôi sử dụng đối tượng cấu hình để chỉ định phương thức yêu cầu và chuyển dữ liệu cần được đăng.

Hãy thử cách triển khai này bằng cách sử dụng async / await:

  

chức năng không đồng bộ

postData

() {

const

thức ăn

=

{

tên

:

"Bánh mì"

,

trọng lượng

:

450

,

số lượng

:

3

}

const

phản hồi

=

chờ đợi

tìm nạp

(

"/ food" , {

phương pháp

:

"ĐĂNG"

,

cơ thể

:

JSON

.

xâu chuỗi lại

(

đồ ăn

),

tiêu đề

:

{

"Loại nội dung"

:

"application / json"

} })

nếu

(

!

phản hồi

.

được rồi

) {

ném

mới

Lỗi (

`` Yêu cầu không thành công với trạng thái

$ {

phản hồi lại

.

trạng thái

}

`

) }

bảng điều khiển

.

nhật ký

(

"Yêu cầu thành công!"

) }

Ưu điểm của Tìm nạp

  • Cung cấp một cách đơn giản, tự nhiên để thực hiện các yêu cầu HTTP trong Javascript.
  • Dễ dàng học và sử dụng cho các vấn đề ở mọi cấp độ.
  • Hỗ trợ triển khai dựa trên lời hứa, cho phép chúng tôi viết mã ngắn gọn và rõ ràng hơn.
  • Cung cấp các tính năng bổ sung qua XMLHttpRequest chẳng hạn như tích hợp các đối tượng Yêu cầu và Phản hồi với API Cache gốc và gửi yêu cầu no-cors
    .

Nhược điểm của Tìm nạp

  • Thiếu một số tính năng hữu ích được hỗ trợ bởi XMLHttpRequest, chẳng hạn như hủy bỏ một yêu cầu và giám sát tiến trình yêu cầu. (Tuy nhiên, nó cho phép sử dụng AbortController riêng biệt
    đối tượng để kiểm soát việc hủy bỏ yêu cầu và hết thời gian chờ.)
  • Chấp nhận phản hồi ngay cả khi xảy ra lỗi HTTP. Chúng tôi phải kiểm tra lỗi HTTP theo cách thủ công và xử lý chúng.
  • Không tương thích với Internet Explorer
    Tuy nhiên, hy vọng rằng điều này không còn quan trọng nữa.

Axios

Axios
là một trong những gói bên thứ ba phổ biến nhất được sử dụng để thực hiện các yêu cầu HTTP trong Javascript. Nó hoạt động với API XMLHttpRequest nguyên bản để mang lại một bộ tính năng tiện lợi và linh hoạt để giải quyết các vấn đề duy nhất như chặn các yêu cầu HTTP và gửi các yêu cầu đồng thời. Tương tự như Tìm nạp, nó hỗ trợ các hứa hẹn để xử lý các yêu cầu không đồng bộ.

Khi thực hiện các yêu cầu GET với Axios, chúng tôi có thể sử dụng phương thức axios.get () chuyên dụng để biên dịch yêu cầu. Ở đây, chúng tôi đã trình bày một ví dụ về cách triển khai:

  

axios

.

lấy

(

"https://world.openfoodfacts.org/ category / pastas / 1.json "

) .

sau đó

(

phản hồi

= & gt; {

// truy cập dữ liệu phản hồi JSON được phân tích cú pháp sử dụng trường response.data

dữ liệu

=

phản hồi

.

dữ liệu

bảng điều khiển

.

nhật ký

(

dữ liệu

.

số lượng

)

bảng điều khiển

.

nhật ký

(

dữ liệu

.

sản phẩm

) }) .

bắt được

(

lỗi

= & gt; {

nếu

(

lỗi

.

phản hồi

) {

// nhận mã lỗi HTTP

bảng điều khiển

.

nhật ký

(

lỗi

.

phản hồi

.

trạng thái

) }

khác

{

bảng điều khiển

.

nhật ký

(

lỗi

.

thông báo

) } })

Như ví dụ này cho thấy, Axios giảm bớt khối lượng công việc mà chúng tôi phải thực hiện để thực hiện các yêu cầu HTTP ngay cả so với Tìm nạp. Nó tự động phân tích cú pháp dữ liệu JSON đã nhận mà chúng ta có thể truy cập thông qua trường response.data. Axios cũng bắt lỗi HTTP trong phương thức bắt của nó, loại bỏ nhu cầu kiểm tra cụ thể mã trạng thái trước khi xử lý phản hồi. Bên trong phương thức catch, chúng ta có thể phân biệt các lỗi HTTP bằng cách sử dụng kiểm tra lỗi. Phản hồi, kiểm tra này lưu trữ mã lỗi HTTP.

Để gửi các yêu cầu POST với Axios, chúng tôi sử dụng phương thức axios.post () chuyên dụng làm ví dụ sau, được triển khai bằng async / await, cho thấy:

  

chức năng không đồng bộ

postData

() {

const

thức ăn

=

{

tên

:

"Bánh mì"

,

trọng lượng

:

450

,

số lượng

:

3

}

hãy thử

{

const

phản hồi

=

chờ đợi

tiên đề

.

bài đăng

(

"/ food"

,

đồ ăn

)

bảng điều khiển

.

nhật ký

(

"Yêu cầu thành công!"

) }

bắt

(

lỗi

) {

nếu

(

lỗi

.

phản hồi

) {

bảng điều khiển

.

nhật ký

(

lỗi

.

phản hồi

.

trạng thái

) }

khác

{

bảng điều khiển

.

nhật ký

(

lỗi

.

thông báo

) } } }

Một lần nữa, Axios đơn giản hóa việc triển khai này bằng cách tự động chuyển đổi các đối tượng Javascript thành JSON mà không có sự can thiệp của chúng tôi. Các phương thức Axios này cũng chấp nhận tham số cuối cùng chỉ định cấu hình HTTP.

Ngoài các tính năng cơ bản này, Axios cung cấp các giải pháp cho nhiều trường hợp sử dụng độc đáo mà chúng ta sẽ không thảo luận ở đây. Nhưng nếu bạn muốn tìm hiểu sâu hơn về cách làm việc với Axios trong Javascript cũng như Node.js, bạn có thể làm theo hướng dẫn chuyên sâu về Axios này
trên blog của chúng tôi.

Ưu điểm của Axios

  • Cung cấp cú pháp đơn giản, ngắn gọn và dễ học.
  • Hỗ trợ một bộ tính năng linh hoạt không có sẵn trong nhiều gói HTTP có sẵn khác. Chúng bao gồm chặn các yêu cầu HTTP, gửi yêu cầu đồng thời, hủy bỏ các yêu cầu đã gửi, chuyển đổi dữ liệu JSON tự động, giám sát tiến trình yêu cầu, v.v.
  • Tương thích với tất cả các phiên bản trình duyệt chính, bao gồm cả Internet Explorer.
  • Cung cấp hỗ trợ phía Máy khách để bảo vệ XSRF.

Nhược điểm của Axios

  • Thêm phần phụ thuộc bên ngoài vào ứng dụng vì mô-đun không phải là mô-đun gốc.

SuperAgent

SuperAgent
là một trong những gói của bên thứ ba sớm nhất được giới thiệu với Javascript để thực hiện các yêu cầu HTTP. Tương tự như Axios, nó sử dụng API XMLHttpRequest trong quá trình triển khai và đi kèm với một bộ tính năng toàn diện hữu ích trong một số tác vụ xử lý yêu cầu. Gói hỗ trợ cả triển khai dựa trên lời hứa và dựa trên cuộc gọi lại.

Khi gửi các yêu cầu HTTP bằng SuperAgent, chúng tôi có thể dựa vào các phương thức chuyên dụng của nó để bắt đầu một loại yêu cầu cụ thể. Ví dụ: chúng ta có thể sử dụng phương thức superagent.get () để gửi các yêu cầu GET, như ví dụ này cho thấy.

  

siêu cấp

.

lấy

(

"https://world.openfoodfacts.org/category/pastas/1.json"

) .

sau đó

(

phản hồi

= & gt; {

// nhận dữ liệu phản hồi JSON đã được phân tích cú pháp

dữ liệu

=

phản hồi

.

nội dung

bảng điều khiển

.

nhật ký

(

dữ liệu

.

số lượng

)

bảng điều khiển

.

nhật ký

(

dữ liệu

.

sản phẩm

) }) .

bắt được

(

lỗi

= & gt; {

nếu

(

lỗi

.

phản hồi

) {

bảng điều khiển

.

nhật ký

(

lỗi

.

trạng thái

) }

khác

{

bảng điều khiển

.

nhật ký

(

lỗi

.

thông báo

) } })

Với cú pháp dựa trên lời hứa, SuperAgent tuân theo một mẫu tương tự như Axios để gửi các yêu cầu GET. Nó tự động phân tích cú pháp nội dung phản hồi thành một đối tượng Javascript mà không có sự can thiệp của nhà phát triển. Nó cũng bắt lỗi HTTP bên trong phương thức catch mà chúng ta có thể xác định bằng cách sử dụng trường error.response. Nếu yêu cầu không thành công do lỗi liên quan đến mạng, các trường lỗi. Phản hồi và lỗi. Trạng thái này sẽ vẫn không được xác định.

Chúng tôi có thể gửi yêu cầu ĐĂNG với SuperAgent theo cách tương tự.

  

siêu cấp

.

bài đăng

(

"/ food"

) .

gửi

(

đồ ăn

) .

sau đó

(

phản hồi

= & gt;

bảng điều khiển

.

nhật ký

(

"Yêu cầu thành công!" )) .

bắt được

(

lỗi

= & gt; {

nếu

(

lỗi

.

phản hồi

) {

bảng điều khiển

.

nhật ký

(

lỗi

.

trạng thái

) }

khác

{

bảng điều khiển

.

nhật ký

(

lỗi

.

thông báo

) } })

Theo mặc định, SuperAgent giả định dữ liệu được truyền ở dạng JSON và xử lý việc chuyển đổi dữ liệu và tự đặt tiêu đề loại nội dung. Để chuyển dữ liệu được gửi cùng với yêu cầu POST, chúng tôi sử dụng phương thức send () của SuperAgent.

Ưu điểm của SuperAgent

  • Cung cấp một giải pháp dựa trên lời hứa, dễ sử dụng để gửi các yêu cầu HTTP.
  • Đây là một mô-đun dành cho người lớn và được hỗ trợ tốt trong Javascript.
  • Hỗ trợ yêu cầu thử lại nếu xảy ra lỗi liên quan đến mạng hoặc lỗi thoáng qua khác khi đưa ra yêu cầu.
  • Hỗ trợ mở rộng chức năng của gói với sự trợ giúp của bộ plugin liên tục phát triển
    . Một số ví dụ về các tính năng mà các plugin này thêm vào SuperAgent bao gồm mô phỏng các cuộc gọi HTTP giả, dữ liệu phản hồi và yêu cầu trong bộ nhớ đệm, yêu cầu xếp hàng và điều chỉnh, v.v.
  • Tương thích với tất cả các phiên bản trình duyệt chính. Tuy nhiên, bạn phải sử dụng polyfill cho các phiên bản Internet Explorer trước đó để kích hoạt các tính năng như hỗ trợ hứa hẹn, một lần nữa, IE? ai quan tâm ở điểm này, đúng không?

Nhược điểm của SuperAgent

  • Thêm phần phụ thuộc bên ngoài vì mô-đun không phải là mô-đun gốc.
  • Không hỗ trợ tiến độ yêu cầu giám sát.

Kỳ

Kỳ
là một gói Javascript tương đối mới có thể được sử dụng để thực hiện các yêu cầu HTTP không đồng bộ từ giao diện người dùng của một ứng dụng web. Nó được xây dựng dựa trên API tìm nạp gốc với cú pháp đơn giản hơn và chức năng bổ sung.

Ky cung cấp một cú pháp đơn giản để thực hiện các yêu cầu bằng các phương thức HTTP chuyên dụng của nó. Dưới đây là ví dụ về việc gửi yêu cầu GET bằng Ky với async / await.

  

async

function

getData

() {

thử

{

const

dữ liệu

=

đang chờ đợi

ky

.

lấy

(

"https://world.openfoodfacts.org/category/pastas/1.json"

).

json

()

bảng điều khiển

.

nhật ký

(

dữ liệu

.

số lượng

)

bảng điều khiển

.

nhật ký

(

dữ liệu

.

sản phẩm

) }

bắt

(

lỗi

) {

nếu

(

lỗi

.

phản hồi

) {

bảng điều khiển

.

nhật ký

(

lỗi

.

phản hồi

.

trạng thái

) }

khác

{

bảng điều khiển

.

nhật ký

(

lỗi

.

thông báo

) } } }

Chúng tôi có thể gửi các yêu cầu ĐĂNG theo một mẫu tương tự:

  

chức năng không đồng bộ

postData

() {

thử

{

const

phản hồi

=

chờ đợi

ky

.

đăng bài

(

"/ food"

, {

json

:

đồ ăn

})

bảng điều khiển

.

nhật ký

(

"Yêu cầu thành công!"

) }

bắt

(

lỗi

) {

nếu

(

lỗi

.

phản hồi

) {

bảng điều khiển

.

nhật ký

(

lỗi

.

phản hồi

.

trạng thái

) }

khác

{

bảng điều khiển

.

nhật ký

(

lỗi

.

thông báo

) } } }

Thuận của Ky

  • Cung cấp một API đơn giản, nhẹ, dựa trên lời hứa để thực hiện các yêu cầu HTTP.
  • Khắc phục một số hạn chế trong API tìm nạp gốc với sự hỗ trợ cho các tính năng như thời gian chờ yêu cầu, thử lại và theo dõi tiến trình.
  • Cung cấp các hook để sửa đổi các yêu cầu trong vòng đời của chúng: beforeRequest, afterResponse, beforeRetry, v.v.
  • Hỗ trợ tất cả các trình duyệt hiện đại như Chrome, Firefox, Safari. Để được hỗ trợ Internet Explorer, Ky cung cấp một gói thay thế, Ky-Universal
    , không rõ tại sao họ vẫn bận tâm.

Nhược điểm của Ky

  • Một gói tương đối mới so với các tùy chọn linh hoạt, trưởng thành khác được thảo luận trong bài đăng này.
    Thêm phụ thuộc bên ngoài.

Kết thúc

Trong những năm gần đây, một số mô-đun gốc và mô-đun của bên thứ ba đã được giới thiệu với Javascript nhằm mục đích gửi các yêu cầu HTTP. Trong năm phương pháp mà chúng ta đã thảo luận hôm nay, chúng ta đã đề cập đến những cách truyền thống, phổ biến và thậm chí là tương đối mới để hoàn thành nhiệm vụ này để cung cấp tổng quan đầy đủ về các tùy chọn khác nhau dành cho bạn với tư cách là nhà phát triển.

Mặc dù các phương pháp này có điểm mạnh và điểm yếu riêng, nhưng bạn có thể chọn phương pháp phù hợp nhất để sử dụng trong các ứng dụng web của mình sau khi cân nhắc kỹ các yêu cầu của mình. Chúng tôi hy vọng bài đăng này sẽ giúp bạn thực hiện phân tích đó và xác định phương pháp phù hợp để gửi yêu cầu HTTP trong các dự án tương lai của bạn.


Xem thêm những thông tin liên quan đến chủ đề http, ví dụ về yêu cầu javascript

Sending JavaScript Http Requests with XMLHttpRequest

alt

  • Tác giả: Academind
  • Ngày đăng: 2019-09-18
  • Đánh giá: 4 ⭐ ( 3571 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Want to send some background (Ajax) Http requests with JavaScript? Learn how to use XMLHttpRequest for that!

    Join the full “JavaScript – The Complete Guide” course: https://acad.link/js
    Exclusive Discount also available for my “Accelerated ES6 Training” Course: https://acad.link/es6

    THIS VIDEO IS PART OF A MINI-SERIES! Check out the other parts:

    1 (this video) – Using XMLHttpRequest: https://www.academind.com/learn/javascript/xhr-fetch-axios-xmlhttprequest
    2 – Using the fetch() API: https://www.academind.com/learn/javascript/xhr-fetch-axios-the-fetch-api
    3 – Using Axios: https://academind.com/learn/javascript/xhr-fetch-axios-using-axios

    Check out all our other courses: https://academind.com/learn/our-courses

    Starting Code for the series: https://github.com/academind/xhr-fetch-axios-intro/tree/starting-setup
    Finished Code: https://github.com/academind/xhr-fetch-axios-intro/tree/xhr

    ———-

    • Go to https://www.academind.com and subscribe to our newsletter to stay updated and to get exclusive content & discounts
    • Follow @maxedapps and @academind_real on Twitter
    • Follow @academind_real on Instagram: https://www.instagram.com/academind_real
    • Join our Facebook community on https://www.facebook.com/academindchannel/

    See you in the videos!

    ———-

    Academind is your source for online education in the areas of web development, frontend web development, backend web development, programming, coding and data science! No matter if you are looking for a tutorial, a course, a crash course, an introduction, an online tutorial or any related video, we try our best to offer you the content you are looking for. Our topics include Angular, React, Vue, Html, CSS, JavaScript, TypeScript, Redux, Nuxt.js, RxJs, Bootstrap, Laravel, Node.js, Progressive Web Apps (PWA), Ionic, React Native, Regular Expressions (RegEx), Stencil, Power BI, Amazon Web Services (AWS), Firebase or other topics, make sure to have a look at this channel or at academind.com to find the learning resource of your choice!

Yêu cầu (Request) trong HTTP

  • Tác giả: vietjack.com
  • Đánh giá: 5 ⭐ ( 1078 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Yêu cầu (Request) trong HTTP – Học HTTP cơ bản và nâng cao theo các bước cơ bản từ tổng quan về HTTP, các tham số giao thức trong HTTP, cấu trúc thông báo trong HTTP, message trong HTTP, yêu cầu, response, phản hồi trong HTTP, request trong HTTP, kết nối trong HTTP, mã hóa trạng thái trong HTTP, caching trong HTTP, status code trong HTTP, trường header trong HTTP, bảo mật trong HTTP và phương thức như GET, POST, HEAD, PUT trong HTTP cùng với các ví dụ phù hợp.

Tổng hợp các bài tập javascript cơ bản có lời giải mới nhất 2020

  • Tác giả: xaydungweb.vn
  • Đánh giá: 4 ⭐ ( 7865 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài tập javascript cơ bản có lời giải là một trong những keyword được search nhiều nhất trên Google về chủ đề bài tập javascript cơ bản có lời giải. Trong bài viết này, xaydungweb.vn sẽ viết bài viết Tổng hợp các bài tập javascript cơ bản có lời giải mới nhất 2020.

Câu hỏi phỏng vấn JavaScript nhiều cấp độ cùng hướng dẫn trả lời

  • Tác giả: final-blade.com
  • Đánh giá: 4 ⭐ ( 5427 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

XMLHttpRequest – Tạo HTTP request đến server trong JavaScript

  • Tác giả: completejavascript.com
  • Đánh giá: 4 ⭐ ( 1422 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: XMLHttpRequest giúp bạn gửi HTTP request (GET, POST, PUT, DELETE,…) đến server và hỗ trợ hai kiểu request: đồng bộ và bất đồng bộ.

XMLHTTPREQUEST – TẠO HTTP REQUEST ĐẾN SERVER TRONG JAVASCRIPT

  • Tác giả: kipalog.com
  • Đánh giá: 5 ⭐ ( 3871 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Có bao giờ bạn thắc mắc, chuyện gì thực sự diễn ra khi chúng ta gõ một địa chỉ trang web (ví dụ: (Link)) lên trình duyệt và nhấn Enter? Đầu tiên, t…

Giới thiệu về Axios – một HTTP Client dựa trên Promise của Javascript

  • Tác giả: viblo.asia
  • Đánh giá: 3 ⭐ ( 9829 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tổng quan Axios là một HTTP client được viết dựa trên Promises được dùng để hỗ trợ cho việc xây dựng các ứng dụng API từ đơn giản đến phức tạp và có thể được sử dụng cả ở trình duyệt hay Node.js.

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Nút tắt JavaScript - vô hiệu hóa một nút trong javascript

By ads_php