Sử dụng Web API cho hoạt động CRUD

Trong phần trước, chúng ta đã tạo Web API với các phương thức Get, Post, Put và Delete xử lý các yêu cầu HTTP GET, POST, PUT và DELETE tương ứng. Ở đây, chúng ta sẽ xem cách sử dụng (truy cập) Web API cho hoạt động CRUD.

Có thể truy cập Web API trong mã phía máy chủ trong .NET và cũng có thể truy cập ở phía máy khách bằng các khung JavaScript như jQuery, AnguarJS, KnockoutJS, v.v.

Ở đây, chúng ta sẽ sử dụng Web API (được tạo trong phần trước) trong các môi trường sau:

1. Sử dụng Web API trong ASP.NET MVC
2. Sử dụng Web API trong AngularJS

Sử dụng Web API trong ASP.NET MVC

Để sử dụng Web API trong ASP.NET MVC phía máy chủ, chúng ta có thể sử dụng HttpClient trong bộ điều khiển MVC. HttpClient gửi yêu cầu đến Web API và nhận phản hồi. Sau đó, chúng ta cần chuyển đổi dữ liệu phản hồi đến từ Web API thành mô hình rồi hiển thị thành dạng xem.

Hình sau minh họa cách sử dụng Web API trong ASP.NET MVC.

Lưu ý: AngularJS hoặc bất kỳ khuôn khổ JavaScript nào khác có thể được sử dụng trong chế độ xem MVC và có thể truy cập Web API trực tiếp từ chế độ xem bằng AJAX. Chúng tôi đã lấy ASP.NET MVC chỉ để chứng minh cách truy cập Web API từ mã phía máy chủ trong trường hợp bạn không sử dụng bất kỳ khuôn khổ JavaScript nào.

Sử dụng Web API trong AngularJS

Có thể truy cập Web API trực tiếp từ UI ở phía máy khách bằng cách sử dụng khả năng AJAX của bất kỳ khuôn khổ JavaScript nào như AngularJS, KnockoutJS, Ext JS, v.v.

Hình sau minh họa cách sử dụng Web API trong khuôn khổ phía máy khách bằng AJAX.

Tìm hiểu cách sử dụng các phương thức Get, Post, Put và Delete của Web API trong ASP.NET MVC và Angular trong các phần tiếp theo.