spa-auth-components
v0.3.29
Published
Installing with npm is recommended and it works seamlessly with webpack. ```sh npm i spa-auth-components ``` To external usage of this library we should modify webpack config firstly: ```javascript externals: { spa_auth: 'SpaAuthComponents' } `
Readme
Spa auth components
Installation
Installing with npm is recommended and it works seamlessly with webpack.
npm i spa-auth-componentsTo external usage of this library we should modify webpack config firstly:
externals: {
spa_auth: 'SpaAuthComponents'
}Next, we should add library source to your project page:
<!doctype html>
<html lang="en">
<head>
...
<link href="{{ config("app.mixBaseAssetUrl") . mix('css/app.css') }}" type="text/css" rel="stylesheet" />
<link href="https://unpkg.com/spa-auth-components/dist/SpaAuthComponents.css" type="text/css" rel="stylesheet" />
</head>
<body>
...
<script src="{{ config("app.mixBaseAssetUrl") . mix('js/vendor.js') }}"></script>
<script src="{{ config("app.mixBaseAssetUrl") . mix('js/manifest.js') }}"></script>
<script src="https://unpkg.com/spa-auth-components/dist/SpaAuthComponents.umd.min.js"></script>
<script src="{{ config("app.mixBaseAssetUrl") . mix('js/app.js') }}"></script>
</body>
</html>How to use
Auth library can be inited by code presented below:
import Vue from 'vue';
import TripUpAuth from 'spa_auth';
import store from '@/store';
import router from '@/router';
import i18n from '@/lang';
Vue.use(TripUpAuth, {
inject: {
store: store, // required
router: router, // required
i18n: i18n,
userStatusChanged: function(user) {
// any actions
},
},
pages: {
login: {
title: 'Sign In',
},
resetPassword: {
title: 'Reset password',
},
},
baseApiUrl: window.Ziggy.baseUrl + 'inventory',
});
You can change any field of default component config:
import { FakeAuthRepository } from '@/services/fake-auth-repository'
import { FakeUserRepository } from '@/services/fake-user-repository'
export default {
inject: {
store: null,
router: null,
authApi: new FakeAuthRepository(),
userApi: new FakeUserRepository(),
baseApiUrl: null
},
pages: {
login: {
title: 'Login Title',
name: 'login',
path: '/login'
},
resetPassword: {
title: 'Reset password',
path: '/reset',
name: 'reset.password'
},
setPassword: {
title: 'Set password',
name: 'set.password',
path: '/password/set'
}
}
}#Backend configuration
First of all we should add TripUpAuthService provider to config/app.php file:
'providers' => [
...
\Tripup\Auth\TripupServiceProvider::class,
...
],Next we should add SsoCookie middleware to App/Http/Kernal file:
use Tripup\Auth\Middlewares\SsoCookie;
class Kernel extends HttpKernel
{
...
protected $middleware = [
...
SsoCookie::class,
];
...
}After we should change config/auth.php configuiration:
[
...
'defaults' => [
'guard' => 'chain',
'passwords' => 'oauth2',
],
'guards' => [
"chain"=>[
'driver' => 'chain_guard',
'chain'=>['web', 'sso'],
],
'web' => [
'driver' => 'session',
'provider' => 'oauth2',
],
'api' => [
'driver' => 'tripup_api_guard',
'provider' => 'users',
'hash' => false,
],
'sso' => [
'driver' => 'tripup_guard'
],
],
'providers' => [
'oauth2'=>[
'driver'=>'oauth2'
]
],
...
]Next we should except TRIPUP_SSO and isLogged cookies from encription:
namespace App\Http\Middleware;
use Illuminate\Cookie\Middleware\EncryptCookies as Middleware;
class EncryptCookies extends Middleware
{
/**
* The names of the cookies that should not be encrypted.
*
* @var array
*/
protected $except = [
"TRIPUP_SSO",
"isLogged"
];
}