laravel: Login form on non Laravel page - javascript

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

Related

Using IdentityServer with ASP.NET + embedded SPA JS framework

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.

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.

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.

Single page application with login and search robots

In my work with a Javascript single page application, i have recently run into a problem.
The whole idea behind this project, is to avoid page reload. When the user comes to my application they won't need to make any reloads. This is done with jQuery and Backbone.js and PHP as service.
I have this static index.html file, where i hide my login container and application container. Then i show the login container, if the user is not recognize by my application, and if they have auth i show the application.
if auth:
application.show()
elif not auth:
login.show() // like Gmail or Facebook etc.: Information + login-form
I wan't to show users who aren't authenticated, both login-form and general info. Very important is also that the site can be found by robots as Google etc.
Can this only be done with 2 different files, giving me reload? A site.com and login.site.com. That solution irritates me, because my login, as it is by now, is quite instant.
Not sure I get the question completely but if you want to check if a user in authenticated, try to do an ajax call. If it fails with "401 unauthorized" the user needs to login...
You can achieve what you want by using ajax calls to authenticate (Although this is not a recommended approach, and people usually prefer the two page solution you have outlined).
What you can do, is have very skinny controllers that just exist to provide data to rich client UI.
Your gateway controller(A separate controller, with no model that acts as an entry point in the application) will just render the basic application structure to the client (without any user specific data, you dont know if the user is logged in, you dont need to know at this point). Then the client will query the UserController for identity of currently logged in user, if user is logged in server returns a json response containing information related to user and if not, server returns a response saying that user is not logged in. Then you can fetch a partial for the login form and then submit it again through ajax. As you see, creating the UI once and communicating with the server with lightweight ajax calls can solve your issue easily.

How do pass forms-based authentication form iphone app to website?

I am working on creating an iphone application which logins to we website and retrieves a table, and displays the content within the app. To view the table a Login is required. It seems the site is using Form-Baseds Authentication. WebSite's Login Screen
So How do I pass the login ID and pass from xcode to the to the site and retain the information so the user only needs to login once.
to remember the login credentials, the easiest way is to put them into a NSDictionary and write that to the application bundle, then read it later, when needed. Remember to give the users a chance to change their login credentials later on and at least think about encrypting the data.
As to the form-based login, the way to go would be to create a NSURLRequest to the login forms URL, if it is GET-based, simply do it like url.somewhere/form?user=foo&pass=bar, if it is POST-based, alter the created request and include the information needed in the POST-field.

Categories

Resources