Authenticating Angular API Call to Laravel

Question

I am building an application using Laravel and Angular. I have defined the following route

Route::group(array('prefix' => 'api'), function() {
Route::resource('getdealsbymerchant/{merchant_id}', 'dealsController@getdealsbymerchant',
    array('only' => array('index')));
});

I have this route working. When I hit it I get a JSON response.

I have also been able to make API call in Angular to read the data and displayed it.

In my app.js I have defined

var app = angular.module('deals', [])
    .constant('API_URL', 'http://www.coupon.local/api/getdealsbymerchant/');

I am aware that I can protect routes by adding

'middleware' => 'auth',

to the route.

My question is how do I authenticate my Angular application to make sure that only the angular application has access to the API and not everyone else.

Do I pass username and password in the app.js or is there a better way of doing it? Also since app.js is in public folder, wouldn't everyone be able to see the username password I am passing?

Please help. Thanks.

My question is how do I authenticate my Angular application to make sure that only the angular application has access to the API and not everyone else. - use some token? domain lock? btw, even several api provider that uses a key to authenticate their client but the client actually exposes the api key, just like google api browser key, twitter api key, etc. — Bagus Tesa
– Bagus Tesa, Commented Dec 14, 2015 at 22:35
So does this mean that if my API allows update/delete, any user can see my key and use it to access API and update/delete records? Sorry I am not able to wrap my head around this authentication so asking. — Gaurav Mehta
– Gaurav Mehta, Commented Dec 14, 2015 at 22:55
actually, you could instead of authenticating your application - you could do this per-user basis. like explained in scotch.io token based authentication for angular js and laravel app, you could authenticate user instead - it's more secure and we only need a session key - that being generated on user login and discarded later (by inactivity or logout). ps and yes, it mean that if my API allows update/delete, any user can see my key and use it to access API if you use application key. — Bagus Tesa
– Bagus Tesa, Commented Dec 14, 2015 at 23:23
I use this tip: At logon, I send with https the username (plain) and password (sha-256) to server. The server returns an API key (stored on account data, something like current time millis with sha-256, generated for each password change), and I use some Angular Local Storage to store the basic auth information (Basic <apikey>=<password>). And then, I use a global resource configuration to send this for each call. — Joao Polo
– Joao Polo, Commented Dec 14, 2015 at 23:29

naguib · Accepted Answer · 2015-12-14 22:28:51Z

1

Storing any user or password , keys etc.. in angular is a bad idea because it makes it visible for the user.. The best way I know is to make a middle layer ... so instead of calling this endpoint : http://www.coupon.local/api/getdealsbymerchant/

angular should call : http://www.coupon.local/getdealsbymerchant which internally will do the call to the api and has all the private things in server side

answered Dec 14, 2015 at 22:28

naguib

858 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Gaurav Mehta Over a year ago

I am not sure I am following. Should I have a PHP file for this call coupon.local/getdealsbymerchant. If that's the case wouldn't everyone else be able to get to that path too? How does it differentiate between AngularJS application call vs. a regular user call?

naguib Over a year ago

You can create a controller in your laravel app that will just call your api. What you gain from this is that the call that goes to laravel is already authenticated, so no one else can call it unless authenticated

Collectives™ on Stack Overflow

Authenticating Angular API Call to Laravel

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related