Ngay từ khi ra đời có thể nói ASP.NET MVC là một mô hình lập trình web chiến lược của Microsoft. Đối với những ai ưa thích và có niềm đam mê với “.NET”, phát triển website thông qua ASP.NET MVC là kĩ năng không thể thiếu. Bài viết này sẽ hướng dẫn lập trình web API Service (MVC5) mới nhất để giúp bạn hình dung rõ hơn.
Tóm Tắt
Website API là gì
Asp. net web API ( Application Programming Interface ) là một framework giúp việc kiến thiết xây dựng HTTP service một cách thuận tiện hơn. Chúng đủ sức làm tăng trưởng cho nhiều clients khác nhau như trình duyệt, mobile app. Web API là một mạng lưới hệ thống góp thêm phần tăng trưởng những ứng dụng dựa trên Restfull service trong “. Net ”. Bạn hoàn toàn có thể tưởng tượng rõ hơn qua hình dưới đây :
Hoặc bạn cũng có thể tìm hiểu rõ hơn tại đường link: http://www.asp.net/web-api
Bạn đang đọc: Hướng dẫn lập trình web API Service (MVC5) mới nhất
Máy tính những bạn cần setup Visual Studio 2013 ( hoặc là Visual Studio 2012 ) để mở mẫu Project cũng như tăng trưởng ứng dụng web API .
Cấu trúc của một MVC
MVC thiết thế gồm ba phần cơ bản là Model, View và Controller. Trong đó :
- Model : đóng vai tròchứa và bộc lộ những đặc tính, logic ứng dụng. Hoặc cũng hoàn toàn có thể hiểu Model là sự đại diện thay mặt cho tài liệu và logic cốt lõi. Nó chính là những lớp ( class ) mang thông tin về đối tượng người dùng ta cần thao tác, thao tác. Ví dụ : “ Sách ” chứa những thông tin trên nó như “ Tên ”, “ Tác giả ”, “ Ngày phát hành ”, “ Giá ”, “ Nhà sản xuất ”, …
- View : có trách nhiệm biểu lộ một hay nhiều Model một cách trực quan. Hay nó nhận thông tin từ một hay nhiều Model sau đó trình diễn lên những website .
- Controller : nằm giữa tầng View và Model ; có trách nhiệm tìm kiếm, giải quyết và xử lý một hoặc nhiều Model, sau đó gửi Model đó qua View để View hiển thị .
Hướng dẫn lập trình web API Service ( MVC5 ) mới nhất
Tạo project
Các bước để tạo một project mới được triển khai như sau :
Bước 1 : Mở File / New Project
Bước 2 : Tại list mới hiện ra, chọn “ ASP.NET Web Application (. NET Framework ) ” ở góc trái màn hình hiển thị. Đặt tên và chọn nơi lưu Project, sau đó nhấn “ OK ” .
Bước 3 : Tại màn hình hiển thị “ New ASP.NET Web Application ”, chọn “ MVC ” và OK
Bước 4 : Nhấn F5 để khởi động Visual Studio
Tạo Data Model
Trong phần tiếp theo hướng dẫn lập trình web API Service (MVC5) mới nhất, chúng tôi sẽ hướng dẫn bạn thao tác thực hiện là nhấn chuột phải tại mục Models/ New/ Class.
Tạo controller
Để tạo Controller, những bước triển khai như sau :
Bước 1 : Nhấp chuột phải tại mục Controller / “ Add ” / “ Controller ”
Bước 2 : Tại hành lang cửa số “ Add Scaffold ”, chọn “ Web API 2 Controller with actions, using Entity Framework ” .
Sau đó màn hình hiển thị sẽ hiển thị hành lang cửa số Add controller
Bước 3 :
- Tại Model class, chọn Category class .
- Tích vào ô “ Use async controller actions ” .
- Trong mục “ Controller Name ”, controller auto được điền vào .
Tiếp đến nhấn ( + ) ở mục “ Data context Class ”, gõ tên Data context class trên hành lang cửa số “ New Data Context ” theo mong ước. Chẳng hạn ở đây class có tên : WebAPIDemoContext. ProductsController được tạo tương tự như trên .
Thao tác với Entity framework
Demo này sử dụng Code First Migrations để thực thi init data và thao tác với Sql server .
Chọn “ Tool ” / “ Nuget Package Manager ” / “ Package Manage Console ”. Trong hành lang cửa số Package Manage Console gõ lệnh sau
| Enable-Migrations |
Một thư mục Migrations được kiến thiết xây dựng cùng file “ Configuration ”. Tiếp theo tất cả chúng ta sẽ init data bằng method Seed trong class. Đây là method kiến thiết xây dựng sẵn trong class DbContext của Entity Framework và tất cả chúng ta trọn vẹn đủ sức ghi đè tùy theo trường hợp sử dụng. Chúng được minh họa như sau :
| protectedoverridevoidSeed ( WebAPIDemoContext context )
context. Categories. AddOrUpdate ( x => x. Id, newCategory Id = 1, Name = ” Mobile ”, newCategory Id = 2, Name = ” Tablet ”, newCategory Id = 3, Name = ” Smart watch ” ) ; |
Chúng ta đang có một số ít data check cho demo, sau đó ta cần tới một class để tạo table và insert những bản ghi trên vào sql server, để triển khai điều đó ta gõ lệnh :
| Add-Migration Initial Update-Database |
File migration được tạo ra như sau :
| namespace WebAPIDemo. Migrations using System ; using System. Data. Entity. Migrations ; publicpartialclassInitial : DbMigrationpublicoverridevoidUp ( ) CreateTable(“dbo.Categories”, c => new |
Với đoạn code trên, Code First tự động hóa link, tạo database, table và insert data tới sql server trong lần khởi chạy tiên phong, những lần sau đó nếu có đổi khác thì migration DB sẽ được update ngược lại. Sau đó tất cả chúng ta nhấn F5 để chạy web, kiểm tra database trong Server Explorer của Visual studio. Việc hoàn tất khởi tạo phải có giao diện như sau :
Thiết lập Client với Knockout js
Hướng dẫn lập trình web API Service (MVC5) mới nhất sẽ bao gồm các bước để thiết lập Client. Knockout js là một thư viện Javascript,trong đó sử dụng mô ảnh Model-View-ViewModel (MVVM). Mô hình hoạt động của nó được thể hiện như hình sau:
Các thao tác để thiết lập Client :
- Add “ knockout js ”. Trong Package manager console gõ lệnh sau :
| Install-Package knockoutjs |
- Tạo lượt xem Model :
| varViewModel = function ( ) var self = this ; self.products = không. observableArray ( ) ; self.error = ko.observable ( ) ; var productsUri = ’ / api / products / ’ ; functionajaxHelper ( uri, method, data ) self.error ( ” ) ; / / Clear error messagereturn USD. ajax ( type : method , url : uri , dataType : ‘ json ’ , contentType : ‘ application / json ’ , data : data ? JSON.stringify ( data ) : null ). thất bại ( function ( jqXHR, textStatus, errorThrown ) self.error ( errorThrown ) ; ) ; functiongetAllProducts ( ) ajaxHelper ( productsUri, ‘ GET ’ ). done ( function ( data ) self.products ( data ) ; ) ; / / Fetch the initial data. getAllProducts ( ) ; self.detail = ko.observable ( ) ; self. getProductDetail = function ( item ) ajaxHelper ( productsUri + item. Id, ‘ GET ’ ). done ( function ( data ) self.detail ( data ) ; ) ; self.categories = không. observableArray ( ) ; self. newProduct = Category : không. observable ( ) , Name : không. observable ( ) , Price : ko.observable ( ) , var categoriesUri = ’ / api / categories / ’ ; functiongetCategories ( ) ajaxHelper ( categoriesUri, ‘ GET ’ ). done ( function ( data ) self.categories ( data ) ; ) ; self. addProduct = function ( formElement ) var product = CategoryId : self. newProduct. Category ( ). Id , Name : self. newProduct. Name ( ) , Price : self. newProduct. Price ( ) , ; ajaxHelper ( productsUri, ‘ POST ’, product ). done ( function ( item ) self.products.push ( item ) ; ) ; getCategories ( ) ; ; ko. applyBindings ( newViewModel ( ) ) ; |
- Binding trên view
| class = ” panel panel-default ” > class = ” panel-heading ” > class = ” panel-title ” > Products class=”panel-body”>
|
Trên đây chúng tôi đã hướng dẫn lập trình web API Service (MVC5) mới nhất. Hy vọng rằng những kiến thức này sẽ phần nào hỗ trợ bạn trong quá trình thực hiện lập trình trên nền tảng C++. Chúc bạn thành công!
Source: https://final-blade.com
Category: Kiến thức Internet
