The following example shows how to load the data of a Web API interface with a UWP application.
UWP application
The example shows a Windows Universal Platform App UWP, which contains the data from an Api page of a locally running web server.
C # code for loading Api values
The data is retrieved in a fairly simple way.
First, a HttpClient is created and this reads in the complete json string of the Api website.
After that, all data records are processed and displayed in a jsonArray conversion and then in individual data records
using System; using System.Net.Http; //*HttpClient using Windows.Data.Json; //*JsonObject using Windows.UI.Xaml; using Windows.UI.Xaml.Controls;
namespace api01 {
public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); }
private void btnStart_Click(object sender, RoutedEventArgs e) { read_API_Data();
}
public async void read_API_Data() { //---------------< read_API_Data() >--------------- //< read webApi > string sURL = "http://localhost:51198/api/projects"; HttpClient client = new HttpClient(); string sResponse = await client.GetStringAsync(sURL); //</ read webApi >
//< get Json values > JsonArray jsonArray = JsonArray.Parse(sResponse); foreach (var jsonRow in jsonArray) { //----< json Row >---- JsonObject jsonObject=jsonRow.GetObject();
//< values > string IDProject= jsonObject["idProject"].ToString(); string Title = jsonObject["title"].ToString(); string Text = jsonObject["text"].ToString(); string dtEdit = jsonObject["dtEdit"].ToString(); //</ values >
tbxResults.Text += Environment.NewLine + "-------"; tbxResults.Text += Environment.NewLine + "idProject=" + IDProject; tbxResults.Text += Environment.NewLine + "Title=" + Title; tbxResults.Text += Environment.NewLine + "Text=" + Text; tbxResults.Text += Environment.NewLine + "dtEdit=" + dtEdit; //----</ json Row >---- }
//</ get Json values > //---------------</ read_API_Data() >--------------- }
} }
|
UWP Mainpage
<Page x:Class="api01.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:api01" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid> <Button x:Name="btnStart" Content="Start" HorizontalAlignment="Left" Margin="44,35,0,0" VerticalAlignment="Top" Height="106" Width="143" FontSize="22" Click="btnStart_Click" /> <ScrollViewer Margin="201,32,226,119" VerticalScrollBarVisibility="Visible" VerticalScrollMode="Enabled"> <TextBlock x:Name="tbxResults" HorizontalAlignment="Stretch" TextWrapping="Wrap" VerticalAlignment="Stretch" /> </ScrollViewer> </Grid> </Page>
|
Web Server
The web server runs on Asp.Net Core MVC
Here an ApiController is created in the Api
using System; using System.Collections.Generic; using System.Linq; using System.Threading.Tasks; using Freelance.Data; using Freelance.Models; using Microsoft.AspNetCore.Http; using Microsoft.AspNetCore.Mvc;
namespace Freelance.Controllers.api {
[Produces("application/json")] [Route("api/Projects")] public class ProjectsController : Controller { //--------------< Class: Controller >--------------------- #region Controller Init private readonly ApplicationDbContext _dbContext;
public ProjectsController(ApplicationDbContext dbContext) { //----< Init: Controller >---- _dbContext = dbContext; //----</ Init: Controller >---- } #endregion
// GET: /api/index public List<ProjectModel> Index() { ///-------------< Index >-------------
//--< Get Linq.Query >-- //*gets last 10 Projects with View_Sum var query = (from n in _dbContext.tbl_Projects where n.IsDraft == false orderby n.IDProject descending select n ).Take(10); //--</ Get Linq.Query >--
//----< fill Data_to_View >---- List<ProjectModel> dataList = query.ToList<ProjectModel>();
//< out > //*output to client return dataList; //</ out > ///-------------</ Index >------------- }
//--------------</ Class: Controller >--------------------- } }
|
The associated WebApi in Asp.Net Core MVC Api
http://localhost:51198/api/projects
Example of the Json Api answer
3-data records of projects
[{"idProject":411,"idOwner":1,"title":"Test Title","text":"Test Text","html":"Test HTML","urlRef":"u","folder":"Freelancer","dtEdit":"2018-06-10T12:03:07.047","dtCreated":"2018-06-10T11:58:20.15","isDraft":false},{"idProject":403,"idOwner":1,"title":"Full-Stack Entwickler (m/w)","text":"Für einen Kunden suchen wir einen Full-Stack Entwickler (m/w) in Esslingen. \r\n\r\nTätigkeiten\r\n\r\n\r\nAnforderungsklärung mit den Product Ownern und dem Solution Architect anhand von gegebenen User Stories in Visual Studio\r\n\r\n\r\nEinforderung, Analyse und Abstimmung erforderlicher Rahmendaten mit Experten aus der IT und den Fachbereichen\r\n\r\n\r\nAbstimmung der Realisierung mit dem Solution Architect\r\n\r\n\r\nEigenständige Implementierung von Azure-Cloud-Services und -Prozessen\r\n\r\n\r\nAktive Teilnahme am agilen Prozess nach Scrum, insbesondere Daily, Planning 1, Planning 2, Review & Retro\r\n\r\n\r\nEinhalten der Konzern- und Projektrahmenvereinbarungen \r\n\r\n\r\nEigenständige Organisation seiner Arbeitsweise\r\n\r\n\r\n\r\n\r\nSkills\r\n\r\n\r\nEntwicklung von Webanwendungen (Microservices, REST, Architekturpatterns)\r\n\r\n\r\nKenntnis des Microsoft-Stacks (ASP.NET, C#/F#, Azure)\r\n\r\n\r\nBeherrschung integrierter Entwicklungsprozesse und zugehöriger Werkzeuge (CI / DevOps, TDD, VSTS, GIT)\r\n\r\n\r\nErfahrung mit der Anbindung verschiedener Datentechnologien (RDMBS, EventStreams, graphorientierte Datenbanken, Azure Container)\r\n\r\n\r\nGute Kenntnisse gängiger Protokolle und Technologien\r\n\r\n\r\nGrundlegende Kenntnisse in der Entwicklung statischer und dynamischer WebUIs\.... ..}]
|