Authenticated users

[onyijne]

how do we detect authenticated users Okay it has been settled we go with Lumen, meaning we need a working approach on how to detect authenticated users at the frontend.

state management should work Just in case who will handle checking of authenticated users at any point in the development phases of our project isn’t familiar with state management, kindly help us with a brief guide on how state management can be achieved, using authentication check as an example.

[prominded]

Overview By adopting Lumen as our backend technology-of-choice, we intend for it to communicate with React as a service. This means Lumen won't return a "View" like Laravel MVC. Lumen will instead return JSON data that will be rendered by React in the DOM.

This service model approach ensures Lumen is lightweight, fast and performance driven, while only focusing on serving data request and not saddled with complicated frontend view creation.

This concept is central to how Lumen is used in detecting authenticated users and managing "state".

Though Lumen is a stateless micro framework, it can be configured to use cache services and in-memory stores for managing session state and detecting authenticated users. Two notable such services are:

1. Redis
2. Memcached

In our project, the code that performs user authentication and state mgt. will be written by the backend developers to output JSON data that will be passed through the response object which React can then render or store locally.

The state object is maintainted in the backend and is utilized between user requests to manage state.

I will be providing working approach on how we can enable user authetication in Lumen and use Redis to detect and manage these users data in relation to React frontend

[onyijne]

In our project, the code that performs user authentication and state mgt. will be written by the backend developers to output JSON data that will be passed through the response object which React can then render or store locally.

I will be providing working approach on how we can enable user authetication in Lumen and use Redis to detect and manage these users data in relation to React frontend

won't storing user authentication related data locally be a security threat? Okay @prominded thanks, that would be great.

[prominded]

won't storing user authentication related data locally be a security threat? Okay @prominded thanks, that would be great.

I did not mean persistence file storage.

I was referring to state mgt. by React to avoid too many api calls (roundtripping) to lumen when server data has not changed. React only then make api calls when notified by server to update its cache. Its much like what you see with football livescores etc

This is best practice for UI performance and real time data updates

[onyijne]

won't storing user authentication related data locally be a security threat? Okay @prominded thanks, that would be great.

I did not mean persistence file storage.

I was referring to state mgt. by React to avoid too many api calls (roundtripping) to lumen when server data has not changed. React only then make api calls when notified by server to update its cache. Its much like what you see with football livescores etc

This is best practice for UI performance and real time data updates

Okay that's cool, we are expecting your guide as promised. thanks

[prominded]

Okay, already working on it and the specification document you shared.

On Sun, 10 May 2020, 9:40 am Samuel Onyijne, notifications@github.com wrote:

won't storing user authentication related data locally be a security threat? Okay @prominded https://github.com/prominded thanks, that would be great.

I did not mean persistence file storage.

I was referring to state mgt. by React to avoid too many api calls (roundtripping) to lumen when server data has not changed. React only then make api calls when notified by server to update its cache. Its much like what you see with football livescores etc

This is best practice for UI performance and real time data updates

Okay that's cool, we are expecting your guide as promised. thanks

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/BuildForSDG/Phenom-Frontend/issues/6#issuecomment-626293448, or unsubscribe https://github.com/notifications/unsubscribe-auth/AMVNDFYLTRM3ZKGDBIKPS5LRQZSBFANCNFSM4M4YPSIQ .

[onyijne]

@prominded we are still waiting for your guide so close out on this

[prominded]

Detecting User Authentication in Lumen

This is primarily done in Lumen using an Http Middleware.

Lumen comes with an Authentication Middleware that verifies if users of your application are authenticated, otherwise redirects them to login page.

The steps are:

1. Define Authentication Middleware
2. Register the Middleware

[prominded]

1. Define Authentication Middleware

1a. Use the default Authentication Middleware in app/Http/Middleware directory,

OR

1b. Define your own Authentication middleware and save it with any name in app/Http/Middleware directory

[prominded]

Sample custom code to create Authentication Middleware: /*

namespace App\Http\Middleware;

use Closure;

class MyMiddleware {

public function handle($request, Closure $next) { if (!$request->user()) { return redirect('login'); }

return $next($request); }

*/

2. Register the Middleware

You register your Authentication Middleware in two steps:

a) Bind your Middleware to a reference in $app-> routeMiddleware method in the boostrap/app.php :

$app-> routeMiddleware([ 'auth' => App\Http\Middleware\MyMiddleware::class, ]);

OR

app->register ('App\Providers\AppServiceProvider::class'); app-> routeMiddleware([ 'auth' => App\Http\Middleware\Authentication::class, ]);

b) Assigning middleware to the http route.

$app->get('/Admin', ['middleware' => 'auth', ...your controller function here...]);

/ Ensure facades are enable in bootstrap/app.php by uncommenting the line: $app->withFacades() /

[prominded]

Using Redis to Manage cached state in Lumen

1. Install Redis
2. Register Redis
3. Configure Redis

**Install Redis Using composer, install redis packages:

-predis/predis -illuminate/redis

Type these CLI commands:

composer require predis/predis

composer require illuminate/redis

**Register Redis In boostrap/app.php, add the Redis service:

$app-> register('Illuminate\Redis\RedisServiceProvider::class');

**Configure Redis In the .env file, set the CACHE_DRIVER=Redis

/* You may choose to enable facades and Eloquent in bootstrap/app.php by uncommenting the lines:

$app->withFacades(); $app->withEloquent(); $app->configure('database');

*/

You can then call Redis in your Lumen code using any of these methods:

a) app('redis') b) $app['redis'] c) $this->app['redis']

Setting a key/value: app('redis')->set($key, $value)

Getting a value by key: app('redis')->get($key)

[onyijne]

okay this is would be great for @bhimbho @maryabik @AliyuAhmad and @uchennaibekwe working at the backend. Actually what we needed from you is how do we use state management (frontend) do detect a user that is authenticated, your guide is for the backend.

[prominded]

Okay I see. I recomnend Redux ( different from Redis) for frontend (React, Angular, Ionic etc). I ll work on it soonest but I ll advice u close this issue and raise a more specific issue targeting client side state management because d heading of this current issue apoears misleading.

[onyijne]

how do we detect authenticated users Okay it has been settled we go with Lumen, meaning we need a working approach on how to detect authenticated users at the frontend.

state management should work Just in case who will handle checking of authenticated users at any point in the development phases of our project isn’t familiar with state management, kindly help us with a brief guide on how state management can be achieved, using authentication check as an example.

It's about frontend authentication check

[prominded]

Okay I am on it

[prominded]

authstate.txt

Find attached demo code of how Redux state management is used to detect authenticated user in React.

[onyijne]

authstate.txt

Find attached demo code of how Redux state management is used to detect authenticated user in React.

Okay thanks.