Category javascript

Creating an Angular Component for Plotly

This article shows how the Plotly javascript library can be used inside an Angular 2 Component. The Angular 2 component can then be used anywhere inside an application using only the Angular Component selector. The data used for the chart is provided in an ASP.NET Core MVC application using Elasticsearch. Code: https://github.com/damienbod/AngularComponentPlotly 2017.02.07: Updated Updated […]

Angular secure file download without using an access token in URL or cookies

This article shows how an Angular SPA client can download files using an access token without passing it to the resource server in the URL. The access token is only used in the HTTP Header. If the access token is sent in the URL, this will be saved in server logs, routing logs, browser history, […]

Angular 2 child routing and components

This article shows how Angular 2 child routing can be set up together with Angular 2 components. An Angular 2 component can contain it’s own routing, which makes it easy to reuse or test the components in an application. Code: Angular 2 app host with ASP.NET Core 2017.01.07: Updated to Angular 2.4.1, Webpack 2.2.0-rc.3 2016.11.07: […]

Secure file download using IdentityServer4, Angular2 and ASP.NET Core

This article shows how a secure file download can be implemented using Angular 2 with an OpenID Connect Implicit Flow using IdentityServer4. The resource server needs to process the access token in the query string and the NuGet package IdentityServer4.AccessTokenValidation makes it very easy to support this. The default security implementation jwtBearerHandler reads the token […]

Angular OpenID Connect Implicit Flow with IdentityServer4

This article shows how to implement an OpenID Connect Implicit Flow client in Angular. The Angular client is implemented in Typescript and uses IdentityServer4 and an ASP.NET core 2.0 resource server. The OpenID Connect specification for Implicit Flow can be found here. Code: https://github.com/damienbod/AspNet5IdentityServerAngularImplicitFlow History: 2019-09-20: Updated ASP.NET Core 3.0, Angular 8.2.6 2018-12-05: Updated to […]

AngularJS OpenID Connect Implicit Flow with IdentityServer4

This article shows how to implement the OpenID Connect Implicit Flow using Angular. This previous blog implemented the OAuth2 Implicit Flow which is not an authentication protocol. The OpenID Connect specification for Implicit Flow can be found here. Code: VS2017 msbuild | VS2015 project.json History: 2017.03.18: Updated to angular 2.4.10, oidc client validation Full history: […]

Plotly charts using Angular, ASP.NET Core 1.0 and Elasticsearch

This article shows how to use a javascript Plotly Bar Chart in Angular to display data from an ASP.NET Core 1.0 MVC application. The server uses Elasticsearch as persistence and uses it to retrieve the aggregated data and return it to the UI. Code: https://github.com/damienbod/AngularPlotlyAspNetCore 2016.07.05: Updated to ASP.NET Core RTM and ElasticsearchCrud 2.3.3.1 2016.05.20: […]

OAuth2 Implicit Flow with AngularJS and ASP.NET Core 2.0 IdentityServer4

This article shows how to implement the OAuth2 Implicit Flow with an AngularJS client and IdentityServer4 hosted in ASP.NET Core 1.1. The code was built using the IdentityServer4.Samples. Thanks to everyone who helped in creating IdentityServer. Code: https://github.com/damienbod/AspNet5IdentityServerAngularImplicitFlow History: 2017-08-15: Updated ASP.NET Core 2.0, Angular 4.3.6 Full history: https://github.com/damienbod/AspNet5IdentityServerAngularImplicitFlow#history Other posts in this series: OAuth2 […]

ASP.NET Core 2.0 with SQLite and Entity Framework Core

This article shows how to use SQLite with ASP.NET Core 2.0 using Entity Framework Core. EF Core can now create SQLite databases using Entity Framework migrations which was not possible in previous versions. Code: https://github.com/damienbod/AspNetCoreSQLite 2017-08-17: Updated to ASP.NET Core 2.0 and EF Core 2.0 2017-02-02: Updated to VS2017 csproj with EF Core msbuild 2017-07-01: […]

Visualizing Elasticsearch Watcher events using ASP.NET Core 1.0, SignalR and Angular

This article shows how to display Elasticsearch Watcher events in an Angular UI using SignalR. The Elasticsearch Watcher events are sent to a MVC 6 controller in an ASP.NET Core 1.0 application. The action method in the controller handles the watcher events and sends the data to the Angular UI using SignalR and the SignalR […]