tecnologias para la integracion de soluciones - uv.mx
TRANSCRIPT
Facultad de Estadística e Informática
TECNOLOGIAS PARA LA INTEGRACION DE SOLUCIONES
Facultad de Estadística e Informática
Clase 24
▪ Tema 4: Servicios Web RESTful
Facultad de Estadística e Informática
Clase 24
▪ Práctica. Creando una aplicación Web y una Web API para acceder a una base de datos. Parte 2.
Facultad de Estadística e Informática
Clase 24▪ Práctica. Creando una aplicación Web y una Web API:✓ Página HTML: MVC ASP.NET
✓ Base de datos: Entity Framework
✓Manejo de solicitudes AJAX y retorno de datos JSON: ASP .NET Web API
✓ Enlazar los elementos HTML a los datos JSON: jQuery
Facultad de Estadística e Informática
ProyectoModelo: Es la representación del lado del servidor de
los datos en el dominio del negocio (libros y autores).
View: Es la capa de presentación (HTML)
View Model: Es un objeto JavaScript que mantiene los
modelos. Es una abstracción de código de la Interfaz de
Usuario (UI). No tiene conocimiento de la
representación HTML. Representa aspectos abstractos
de la vista tales como “una lista de libros”. Captura
eventos de la vista, como ‘botones’.
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)
Hasta el momento la Web API expone las entidades de la base de datos al cliente.En ocasiones deseamos cambiar la forma de los datos que son enviados al usuario, por ejemplo: ▪ Esconder propiedades que no deben visualizar▪ Omitir datos para reducir el tamaño de carga ▪ Evitar vulnerabilidad en sobre exposición de datos▪ Etcétera
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)
Para ello se definen Data Transfer Objects(DTOs), que definen la forma en la que los datos se enviarán a través de la red.
Agregaremos dos clases DTO al proyecto BookService.
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)
Models->Agregar->Clase
BookDetailDTOpublic class BookDetailDTO
{public int Id { get; set; }public string Title { get; set; }public int Year { get; set; }public decimal Price { get; set; }public string AuthorName { get; set; }public string Genre { get; set; }
}
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)
Models->Agregar->Clase
BookDTO public class BookDTO{
public int Id { get; set; }public string Title { get; set; }public string AuthorName { get; set; }
}
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)
Reemplazaremos los dos métodos GET y el método POST de la clase BooksController, con el fin de retornar los DTO creados.
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)
// GET: api/Bookspublic IQueryable<BookDTO> GetBooks(){
var books = from b in db.Booksselect new BookDTO(){
Id = b.Id,Title = b.Title,AuthorName = b.Author.Name
};
return books;}
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)// GET: api/Books/5
[ResponseType(typeof(BookDetailDTO))]public async Task<IHttpActionResult> GetBook(int id){
var book = await db.Books.Include(b => b.Author).Select(b =>new BookDetailDTO(){
Id = b.Id,Title = b.Title,Year = b.Year,Price = b.Price,AuthorName = b.Author.Name,Genre = b.Genre
}).SingleOrDefaultAsync(b => b.Id == id);if (book == null){
return NotFound();}
return Ok(book);}
Facultad de Estadística e Informática
Data Transfer Objects (DTOs)// POST: api/Books
[ResponseType(typeof(Book))]public async Task<IHttpActionResult> PostBook(Book book){
if (!ModelState.IsValid){
return BadRequest(ModelState);}
db.Books.Add(book);await db.SaveChangesAsync();
// New code:// Load author namedb.Entry(book).Reference(x => x.Author).Load();
var dto = new BookDTO(){
Id = book.Id,Title = book.Title,AuthorName = book.Author.Name
};
return CreatedAtRoute("DefaultApi", new { id = book.Id }, dto);}
Facultad de Estadística e Informática
Creando la Vista (HTML)
A continuación crearemos la vista usando HTML y el ViewModel con JavaScript, a través del cual:✓ Se listarán los libros existentes✓ Se mostrará el detalle de un libro✓ Se agregará un libro nuevo
Facultad de Estadística e Informática
Creando la Vista (HTML)
Index.html
Facultad de Estadística e Informática
Creando la Vista (HTML)
Descargar código de index.html
Facultad de Estadística e Informática
Creando el ViewModelEn la carpeta Scripts del proyectoAgregamos el archivo Javascript con el nombre app.js
Facultad de Estadística e Informática
Creando el ViewModel
Descargar código de app.js
Facultad de Estadística e Informática
Creación del proyecto
Gracias por su atención
ReferenciasASP.NET MVC 4 and the Web API. (diciembre de 2012). Jaime Kurtz. aPress. Obtenido de: http://sd.blackball.lv/library/ASP.NET_MVC_4_and_the_Web_API.pdf
REST Vs Web Services (2006). Rafael Navarro. Modelado, Diseño e Implementación de Servicios Web. Obtenido de: http://users.dsic.upv.es/~rnavarro/NewWeb/docs/RestVsWebServices.pdf
RESTful Web Services(2007). Leonard Richarson & Sam Ruby. O’Really. Obtenido de: https://www.crummy.com/writing/RESTful-Web-Services/RESTful_Web_Services.pdf
Getting Started with ASP.NET Web API 2. (2015). Mike Watson. Microsoft Docs. Obtenido de: https://docs.microsoft.com/en-us/aspnet/web-api/overview/getting-started-with-aspnet-web-api/tutorial-your-first-web-api