Nền tảng của việc xây dựng một ứng dụng web là sử dụng các yêu cầu HTTP. Các yêu cầu HTTP cho phép dữ liệu được thu thập từ đầu vào của người dùng, sau đó được gửi qua back end tới máy chủ. Sau đó, một phản hồi được trả lại.
Đôi khi những yêu cầu này gửi dữ liệu được lưu vào cơ sở dữ liệu, như trong một yêu cầu ĐĂNG. Các yêu cầu thông thường khác nhận được phản hồi và hiển thị nó cho người dùng. Đây được gọi là yêu cầu GET. jQuery có get() phương pháp làm cho việc gửi yêu cầu trở thành một quy trình được tổ chức hợp lý.
jQuery get () là gì?
jQuery get() là một phương thức gửi yêu cầu GET đến điểm cuối URL và nhận phản hồi. Phản hồi là dữ liệu được gửi lại từ máy chủ. Không giống như yêu cầu ĐĂNG, yêu cầu GET chỉ nhận dữ liệu đã có từ trước từ máy chủ. Nó không lưu bất cứ thứ gì vào cơ sở dữ liệu.
Yêu cầu GET rất hữu ích để yêu cầu một tập hợp con dữ liệu cụ thể và thực hiện điều gì đó với nó. Ví dụ:nếu chúng tôi đang xây dựng một ứng dụng thương mại điện tử, chúng tôi sẽ gửi yêu cầu GET đến điểm cuối URL để truy cập sản phẩm. Chúng tôi có thể lấy dữ liệu nhận được trong một phản hồi và tạo kiểu cho nó để tạo một bố cục thẻ của tất cả các sản phẩm có sẵn để mua.
jQuery get() chịu trách nhiệm gửi yêu cầu đến URL và nhận dữ liệu dưới dạng phản hồi. Nhà phát triển hiện có quyền truy cập vào dữ liệu từ máy chủ và có thể chọn hiển thị nó cho người dùng theo ý muốn.
Bây giờ chúng ta đã quen với yêu cầu GET là gì, hãy xem get() cú pháp của phương thức.
get () Cú pháp jQuery
jQuery làm cho việc gửi một yêu cầu GET trở nên đơn giản. get() nhận địa chỉ URL dưới dạng một chuỗi và một hàm gọi lại để nhận dữ liệu. Về cơ bản, một hàm gọi lại là một hàm được truyền cho một phương thức sẽ được thực thi sau đó.
Để được giải thích sâu hơn về các chức năng gọi lại, hãy xem hướng dẫn này.
81% người tham gia cho biết họ cảm thấy tự tin hơn về triển vọng công việc công nghệ của mình sau khi tham gia chương trình đào tạo. Kết hợp với bootcamp ngay hôm nay.
Sinh viên tốt nghiệp bootcamp trung bình dành ít hơn sáu tháng để chuyển đổi nghề nghiệp, từ khi bắt đầu bootcamp đến khi tìm được công việc đầu tiên của họ.
Có một vài đối số tùy chọn get() chấp nhận, nhưng được sử dụng phổ biến nhất là URL và hàm gọi lại.
Bám sát ví dụ thương mại điện tử của chúng tôi, hãy xem yêu cầu GET cơ bản trông như thế nào bằng cách sử dụng get() :
$.get('/products', (data) => {
console.log(data)
})
Chúng tôi gọi get() và chuyển nó URL dưới dạng một chuỗi. Yêu cầu đang được gửi đến trang chỉ mục sản phẩm và máy chủ sẽ gửi lại dữ liệu. Hàm gọi lại chấp nhận một vài đối số, nhưng dữ liệu và trạng thái sẽ đủ cho mục đích của chúng tôi.
Dữ liệu đại diện cho dữ liệu nhận được từ yêu cầu. Trong ví dụ của chúng tôi, chúng tôi chỉ đơn giản là xuất những gì được trả về trong bảng điều khiển. jQuery được xây dựng để nhận dạng một vài kiểu dữ liệu, nhưng rất có thể chúng ta sẽ nhận được một đối tượng JSON.
Sẽ cần thêm mã để trích xuất thông tin mong muốn từ đối tượng JSON của chúng tôi. Hãy xem cách chúng tôi có thể làm điều đó.
jQuery get () Ví dụ
Đối với ví dụ của chúng tôi, hãy sử dụng một API thú vị. Trang web này cho chúng tôi biết hiện có bao nhiêu phi hành gia đang ở trong không gian! Nó cũng cung cấp cho chúng ta những cái tên và hàng thủ công không gian. Hãy bắt đầu bằng cách chuyển URL tới get() :
$.get('https://api.open-notify.org/astros.json', (data) => {
console.log(data)
})
Khi chúng tôi gửi yêu cầu, chúng tôi nhận được phản hồi này được ghi vào bảng điều khiển của chúng tôi:
Từ URL, chúng tôi đã biết rằng chúng tôi sẽ nhận được một đối tượng JSON được trả về từ máy chủ. Trong bảng điều khiển, chúng ta thấy các phím “tin nhắn”, “số” và “mọi người”. Giá trị thông báo của thành công giúp xử lý lỗi.
Phím số đề cập đến số lượng người trong không gian. “Mọi người” trỏ đến một giá trị chứa một mảng đối tượng. Từ đây, chúng tôi có thể lặp lại mảng "người" và hiển thị thông tin đó cho người dùng dưới dạng danh sách. Việc lấy lại dữ liệu như vậy để lại lựa chọn cho nhà phát triển về cách hiển thị dữ liệu do máy chủ trả về.
Kết luận
Chúng tôi đã xem xét yêu cầu GET là gì và cách jQuery làm cho nó nhanh chóng và đơn giản. Sau khi làm quen với các thông lệ cú pháp phổ biến, chúng tôi thấy get() trong hành động. Điều quan trọng cần lưu ý là dữ liệu có thể được lặp lại và hiển thị từ phần thân của hàm gọi lại.
Từ đây, một dự án thú vị có thể là tìm kiếm các API đơn giản và xây dựng các dự án nhỏ để thực hành gửi các yêu cầu GET và hiển thị dữ liệu đó. Nhận và hiển thị dữ liệu một cách dễ chịu là bước khởi đầu để trở thành một nhà phát triển thành thạo.