Category javascript

Auto redirect to an STS server in an Angular app using oidc Implicit Flow

This article shows how to implement an auto redirect in an Angular application, if using the OIDC Implicit Flow with an STS server. When a user opens the application, it is sometimes required that the user is automatically redirected to the login page on the STS server. This can be tricky to implement, as you […]

Angular search with ASP.NET Core and Elasticsearch

This article shows how a website search could be implemented using Angular, ASP.NET Core and Elasticsearch. Most users expect autocomplete and a flexible search like some of known search websites. When the user enters a char in the search input field, an autocomplete using a shingle token filter with a terms aggregation used to suggest […]

Using SASS with Webpack, Angular and Visual Studio

This post shows how to use SASS with Webpack and Angular 2 in Visual Studio. I had various problems trying to get this to work from Visual Studio using a Webpack build. The following is a solution which works, but not the only one. Code: https://github.com/damienbod/Angular2WebpackVisualStudio 2017.02.08: Updated webpack 2.2.1, angular 2.4.6 2017.01.07: Updated webpack […]

IdentityServer4, Web API and Angular in a single ASP.NET Core project

This article shows how IdentityServer4 with Identity, a data Web API, and an Angular SPA could be setup inside a single ASP.NET Core project. The application uses the OpenID Connect Implicit Flow with reference tokens to access the API. The Angular application uses webpack to build. Code: https://github.com/damienbod/AspNet5IdentityServerAngularImplicitFlow History: 2019-09-20: Updated ASP.NET Core 3.0, Angular […]

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 […]

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 […]

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 […]

Creating HTML themes in ASP.NET Core 1.0 using Sass

This article shows how to create HTML themes in an ASP.NET Core 1.0 angular application using Sass and grunt. The CSS themes are created using Sass, built using grunt-contrib-sass and compressed using grunt-contrib-cssmin. Angular is then used to switch the themes, using an input button. Code: https://github.com/damienbod/AspNet5ThemesSassGrunt 2016.07.01: Updated to ASP.NET Core 1.0 RTM 2016.05.16: […]

ASP.NET Core 1.0 Typescript AngularJS application with a Grunt production configuration

This article demonstrates how to implement an AngularJS application using Typescript and grunt in ASP.NET Core 1.0. The application is built using Typescript and based on this example. The application uses grunt as its task runner. The grunt task runner produces a production configuration and can also be used in a CI process on any […]