This is an opinionated multi-project solution template, combining .NET Core and Vue.js.
The main objective is to provide scaffolding for an SPA web application, that incorporates SOLID design principles.
- localization
- validation
- global application state/event bus
- multiple optimized entry points
- token-based authentication
- support for local or external authentication providers
- HMR support for development
These instructions will get a copy of the project up and running on your local machine for development purposes.
- .NET Core SDK 2.0.0
- Visual Studio Code (or a similar text-based editor like Sublime)
- TypeScript
- Node.js
- PostgreSQL or SQL Server
via Yeoman
npm install generator-toucan
yo toucan
or using setup instructions
Be sure to check out README for details on MVC middleware and filters being used in the pipeline.
See the readme files for each project
See the readme file below
JWT Bearer tokens are issued by the server. These tokens contain profile data and claims relating to a user. Authentication can be done in two different ways.
This requires a user to create an account using the signup form. In this scenario, the server
- enforces a minimum password complexity rule when signing up
- generates a salt, and stores hashed password to the database
- retreives and maps user profile data and permissions when generating client tokens
This is performed using a variation on the implicit workflow. The sequence of events is as follows.
- browser obtains a one-use nonce from local server (which must be redeemed/used before it expires)
- the browser is redirected to external provider, and authenticated
- external provider issues a redirect, and returns the nonce and access token details via uri (ie. http://localhost:5000/#state=XYZ&access_token=4/P7q7W91&token_type=Bearer&expires_in=3600)
- the Vue.js application is bootstrapped, and checks the uri hash for nonce and access_token
- if present, these are passed to the local server
- the local server validates the nonce and access token, and if satisfied, issues the client with a local token (the external access token is also revoked)
If this is the first time a user has logged in using this external provider, a user account will be created for them based on data from external profile data APIs.
Before a site user can access restricted content they need to verify their account details using some form of two-factor authentication. They are redirected to the verification page when appropriate.
The default implementation is as follows
- user asks site to issue a verification code
- server returns verification code
- client browser outputs the verification code using
console.info()and displays form on page - the verification code is submitted, and a new access token (with updated details) is issued by the server
Server-side routes are protected via policies which provide more flexibility than traditional role-based models.
Client-side routes are protected via navigation guards, which check user claims contained in access tokens issued by the server.
If an authorization check on the web server fails, a challenge is issued to the client browser. Normally this results in a 302 redirect, but this behaviour has been modified using custom middleware in ./src/server/Startup.Auth.cs. This middleware instead returns a 401 Unauthorized response whilst setting Response header Location=XXX. The client-side Axios library then handles this appropriately, by way of a global http response interceptor.
Support for CSRF has been provided.
The site sets CSRF session cookies whenever an access token is issued
The Axios library automatically uses this cookie to append the anti-forgery token to outbound POST, PUT and DELETE requests.
For .NET Core, a sample XUnit test is provided as a starting point /test/ directory
- .NET Core - .NET Core is a general purpose development platform maintained by Microsoft and the .NET community on GitHub.
- Axios - Promise based HTTP client for the browser and node.js
- Bootstrap - Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
- StructureMap - IOC/DI container
- TypeScript - TypeScript is a typed superset of Javascript that compiles to plain JavaScript
- Vue.js - Simple yet powerful library for building modern web interfaces
- xUnit.net - xUnit.net is a free, open source, community-focused unit testing tool for the .NET Framework.
It is what it is.
This project is licensed under the MIT License - see the LICENSE file for details
- Wille Ristimäki for vue.js-starter-template
- Nate Barbettini for SimpleTokenProvider
- Monterail for Vuelidate
*[EF]: Entity Framework