Using IdentityServer with ASP.NET + embedded SPA JS framework - javascript

I'm sorry if the title is not very clear.
What I have: ASP.NET application with "embedded" Vue.js 2 from this repo: https://github.com/MarkPieszak/aspnetcore-Vue-starter
I already studied Identity Server 4 manuals so I tried hybrid flow with pure ASP.NET and implicit flow using oidc-client with pure JS. Both flows work for me.
But what I want is using JS page that hosted in ASP.NET to get access token and refresh token and store them in ASP.NET. ASP.NET in this case acts as a backend (but not the Resource API!).
Maybe (optional) there is a way to create custom login form. User fill this form, JS sends login and password to ASP.NET backend and than in turn transmits them to Identity Server and retrieves tokens.
I wonder if it is possible to use such a scenario at all and whether it is viable and sufficiently safe.
Any assumptions are welcome!
EDIT:
What I really want is to use Vue just for display my data while using ASP.NET as a backend-client which gathers information from resource API.

Regarding the Login page - no, you can't. Reason - when using OIDC authentication, you are delegating the login functionality to the provider (in your case Identity Server), and it takes care for the login page and etc.
Now regarding your Vue app. Vue is a SPA. SPA's can only use Implicit grant type and by this - they are not being issued a refresh token.
Your solution here is to use the oidc-client-js library with your Vue app. We have this scenario implemented (Vue on top of aspnet core) and it works perfectly fine.

Related

Laravel authentication in nativescript-vue app, anyone has done it?

I'm fairly new to nativescript-vue dev and I'd like to set authentication for my native app, I have been thinking about using firebase auth but I'd rather go the laravel route (if it's a good choice at all).
How I think I'd handle this is to send a post request to my backend (which is a laravel app) into my custom auth controller, then in the success callback I'd change isLogged in the vuex store to true or false, since I'm suing also vuex-persistedstate to persist some data into my localStorage (actually it's Application Settings in natviescript afaik).
Is my way of doing this okk? has anyone done it?
I was using a Laravel API before, but decided to switch back to Firebase, I think it’s a better choice for mobile.
But if you want to use Laravel, take a look at Laravel Passport (https://laravel.com/docs/6.x/passport).
You can use the Password Grant (https://laravel.com/docs/6.x/passport#password-grant-tokens) to generate a token from your mobile application, by creating a login endpoint that will generate the token for you.

laravel: Login form on non Laravel page

I'm building a web application which is accompanied by a small website that uses Jekyll. Reason for this being that the website will almost never change and this way it is able to run fast (pure HTML+CSS and some JavaScript) and semi-independent of the application.
The Jekyll site is placed inside the Laravel public folder and runs fine. As it stands a user that wants to use our application needs to visit the default Laravel auth route to login (/login).
I would like to add a login form on one of my site pages that enables the user to login without visiting the application first.
Of course I tried adding a simple form and posting it to /login (the default Laravel route) but this won't work because Laravel expects a csrf token to be set.
I know Laravel sets a cookie containing the encrypted token but I'm not sure if (and how) I'm able to use this.
Is there any (simple) way of adding a login form to a NON-Laravel page? And is it possible to do so using only HTML & JavaScript (maybe using Ajax)?
You have a couple of options.
1- Cheapest option: disable csrf_token on the login route only. Some will recommend this, others will say you shouldn't. You can research online if you want to go this way or not.
2- Make an ajax GET request to a route that will return you the csrf_token so you can use it in your form. In your Laravel controller you simply return the session token
public function getToken() {
return session()->token();
}
3 - Go the passport road for API requests the same as SPAs. https://laravel.com/docs/5.4/passport

Authentication setup using HTML and Javascript or Angularjs

In my project, I implemented CRUD using Asp.net Web API 2 and consumed that using Angularjs. Now I want to build user and admin authentication as two location of the application be authorized to both accordingly. I am already familiar with PHP and ASP.net authentication, but this time I am building my application with HTML and Angularjs only, and I am asked (by a test) to implement user and admin authentication by HTML and Javascript.
1) Please guide me whether to use pure js or angularjs authentication, and what good step by step references.
2) please explain to me how can I secure two locations of the application, first of for registered users and second is for admins only.
I actually did basic search and got confused, I came here for guidance.
Thank you in advance.
Backend: ASP.Net Web API
Frontend: Angular/HTML
You can create a service endpoint for logging - something like this:
public partial class ContainerController
{
[AllowAnonymous]
public ActionResult Login (string success, string error, string returnUrl)
{
//Authenticate User
}
}
Once you've authenticated the user you can redirect the user to a new cshtml page (which is visible only to authenticated users).
Please note that since you're passing your username and id from JavaScript they can be easily detected from a third part intercepting your calls to the server. If you don't want that then you need to run your login page on https. Configuring security certificates and https is a bigger topic and I'll not be able to explain it here.

asp.net authentication for application + web api

I'm developing a MVC web application.
I need to check authentication for the following purposes:
Entering the application (users must be logged in).
Web api calls from javascript (from within the application).
I created a web api project with the ASP.Net users tables.
On the login of the client side i'm posting a webrequest to get the token.
I store the token in a cookie for the javascript usage (for purpose 2).
It works well.
What is the standard way to get the application to know that the user is logged in (for purpose 1)?
Isn't there an implementation for all of it in the asp.net Identity?

How to properly decouple Django from an AJAX application?

I'm using TastyPie and Django to build out my backend for an application that will have browser and mobile (native iOS) clients.
I have been through the TastyPie and Django docs, can authenticate successfully either using the TastyPie resources I set up, or using Djangos built in views. I see a lot of examples on including the CSRF token on the page and grabbing it with your JavaScript, and that works, but I don't understand now to actually determine whether a user is logged in on initial page load (from JavaScript).
Example:
If I want to serve static HTML from a separate, fast web server, and cache my application JavaScript, and only interact with Django through TastyPie views, how do I determine if the user is logged in (and know to render a login form or the app views using JavaScript), and after logout, is there any session information I need to remove from the client browser?
If I were to serve up HTML through Django's template engine, I could render the login form through there appropriately, but that seems not ideal if I want to truly decouple my JavaScript app from Django (and behave like a mobile client).
Edit: I am using Backbone.js, but I don't think that should matter.
UPDATE:
I think I figured it out reading through Django's CSRF documentation again.
If your view is not rendering a template containing the csrf_token template tag, Django might not set the CSRF token cookie. This is common in cases where forms are dynamically added to the page. To address this case, Django provides a view decorator which forces setting of the cookie: ensure_csrf_cookie().
If I do not want to render Django templates, this reads like I can still use the cookie and pull that into my Backbone or jQuery AJAX methods. I'm not sure if TastyPie ensures the cookie will be sent or how to tie into it.
If I use AJAX to logout, will the cookie automatically be removed or does it become invalid? Are these CSRF tokens unique to each user session? I'll have to test some things tomorrow with it. Is it possible to use Django decorators on TastyPie views?
A mobile client doesn't care if the Javascript comes from Django or any other web server. So go ahead and put all your JavaScript and static HTML on another server.
If you want your mobile app to see if the user is logged in, it should make an AJAX call to your Django backend (where the request is authenticated). The data returned should indicate if the session is active (user is logged in).
Another AJAX call can perform the Django logout function.

Categories

Resources