Base attempt at using vuex to handle logins
This commit is contained in:
parent
cc58bc9bd5
commit
e948d81d8a
12 changed files with 218 additions and 202 deletions
16
app/Http/Controllers/Api/Client/AccountController.php
Normal file
16
app/Http/Controllers/Api/Client/AccountController.php
Normal file
|
@ -0,0 +1,16 @@
|
|||
<?php
|
||||
|
||||
namespace Pterodactyl\Http\Controllers\Api\Client;
|
||||
|
||||
use Illuminate\Http\Request;
|
||||
use Pterodactyl\Transformers\Api\Client\AccountTransformer;
|
||||
|
||||
class AccountController extends ClientApiController
|
||||
{
|
||||
public function index(Request $request): array
|
||||
{
|
||||
return $this->fractal->item($request->user())
|
||||
->transformWith($this->getTransformer(AccountTransformer::class))
|
||||
->toArray();
|
||||
}
|
||||
}
|
|
@ -2,7 +2,6 @@
|
|||
|
||||
namespace Pterodactyl\Http\Controllers\Auth;
|
||||
|
||||
use Cake\Chronos\Chronos;
|
||||
use Lcobucci\JWT\Builder;
|
||||
use Illuminate\Http\Request;
|
||||
use Pterodactyl\Models\User;
|
||||
|
@ -16,6 +15,7 @@ use Illuminate\Contracts\Auth\Authenticatable;
|
|||
use Illuminate\Contracts\Encryption\Encrypter;
|
||||
use Illuminate\Foundation\Auth\AuthenticatesUsers;
|
||||
use Pterodactyl\Traits\Helpers\ProvidesJWTServices;
|
||||
use Pterodactyl\Transformers\Api\Client\AccountTransformer;
|
||||
use Illuminate\Contracts\Cache\Repository as CacheRepository;
|
||||
use Pterodactyl\Contracts\Repository\UserRepositoryInterface;
|
||||
|
||||
|
@ -137,24 +137,18 @@ abstract class AbstractLoginController extends Controller
|
|||
$request->session()->regenerate();
|
||||
$this->clearLoginAttempts($request);
|
||||
|
||||
$token = $this->builder->setIssuer(config('app.url'))
|
||||
->setAudience(config('app.url'))
|
||||
->setId(str_random(12), true)
|
||||
->setIssuedAt(Chronos::now()->getTimestamp())
|
||||
->setNotBefore(Chronos::now()->getTimestamp())
|
||||
->setExpiration(Chronos::now()->addSeconds(config('session.lifetime'))->getTimestamp())
|
||||
->set('user', $user->only([
|
||||
'id', 'uuid', 'username', 'email', 'name_first', 'name_last', 'language', 'root_admin',
|
||||
]))
|
||||
->sign($this->getJWTSigner(), $this->getJWTSigningKey())
|
||||
->getToken();
|
||||
|
||||
$this->auth->guard()->login($user, true);
|
||||
|
||||
debug($request->cookies->all());
|
||||
|
||||
return response()->json([
|
||||
'complete' => true,
|
||||
'intended' => $this->redirectPath(),
|
||||
'token' => $token->__toString(),
|
||||
'cookie' => [
|
||||
'name' => config('session.cookie'),
|
||||
'value' => $this->encrypter->encrypt($request->cookie(config('session.cookie'))),
|
||||
],
|
||||
'user' => (new AccountTransformer())->transform($user),
|
||||
]);
|
||||
}
|
||||
|
||||
|
|
36
app/Transformers/Api/Client/AccountTransformer.php
Normal file
36
app/Transformers/Api/Client/AccountTransformer.php
Normal file
|
@ -0,0 +1,36 @@
|
|||
<?php
|
||||
|
||||
namespace Pterodactyl\Transformers\Api\Client;
|
||||
|
||||
use Pterodactyl\Models\User;
|
||||
|
||||
class AccountTransformer extends BaseClientTransformer
|
||||
{
|
||||
/**
|
||||
* Return the resource name for the JSONAPI output.
|
||||
*
|
||||
* @return string
|
||||
*/
|
||||
public function getResourceName(): string
|
||||
{
|
||||
return 'user';
|
||||
}
|
||||
|
||||
/**
|
||||
* Return basic information about the currently logged in user.
|
||||
*
|
||||
* @param \Pterodactyl\Models\User $model
|
||||
* @return array
|
||||
*/
|
||||
public function transform(User $model)
|
||||
{
|
||||
return [
|
||||
'admin' => $model->root_admin,
|
||||
'username' => $model->username,
|
||||
'email' => $model->email,
|
||||
'first_name' => $model->name_first,
|
||||
'last_name' => $model->name_last,
|
||||
'language' => $model->language,
|
||||
];
|
||||
}
|
||||
}
|
|
@ -8,16 +8,17 @@ import { Ziggy } from './helpers/ziggy';
|
|||
import Locales from './../../../resources/lang/locales';
|
||||
import { flash } from './mixins/flash';
|
||||
import { routes } from './routes';
|
||||
import { storeData } from './store';
|
||||
import storeData from './store/index.js';
|
||||
|
||||
window.events = new Vue;
|
||||
window.Ziggy = Ziggy;
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
Vue.use(Vuex);
|
||||
|
||||
const store = new Vuex.Store(storeData);
|
||||
const route = require('./../../../vendor/tightenco/ziggy/src/js/route').default;
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
Vue.mixin({ methods: { route } });
|
||||
Vue.mixin(flash);
|
||||
|
||||
|
|
|
@ -77,32 +77,21 @@
|
|||
this.$data.showSpinner = true;
|
||||
|
||||
this.clearFlashes();
|
||||
axios.post(this.route('auth.login'), {
|
||||
user: this.$props.user.email,
|
||||
password: this.$props.user.password,
|
||||
})
|
||||
.then(function (response) {
|
||||
// If there is a 302 redirect or some other odd behavior (basically, response that isnt
|
||||
// in JSON format) throw an error and don't try to continue with the login.
|
||||
if (!(response.data instanceof Object)) {
|
||||
throw new Error('An error was encountered while processing this request.');
|
||||
this.$store.dispatch('auth/login', { user: this.$props.user.email, password: this.$props.user.password })
|
||||
.then(response => {
|
||||
if (response.complete) {
|
||||
return window.location = response.intended;
|
||||
}
|
||||
|
||||
if (response.data.complete) {
|
||||
localStorage.setItem('token', response.data.token);
|
||||
self.$store.dispatch('login');
|
||||
return window.location = response.data.intended;
|
||||
}
|
||||
|
||||
self.$props.user.password = '';
|
||||
self.$data.showSpinner = false;
|
||||
self.$router.push({name: 'checkpoint', query: {token: response.data.login_token}});
|
||||
this.$props.user.password = '';
|
||||
this.$data.showSpinner = false;
|
||||
this.$router.push({name: 'checkpoint', query: {token: response.login_token}});
|
||||
})
|
||||
.catch(function (err) {
|
||||
self.$props.user.password = '';
|
||||
self.$data.showSpinner = false;
|
||||
self.$refs.password.focus();
|
||||
self.$store.dispatch('logout');
|
||||
.catch(err => {
|
||||
this.$props.user.password = '';
|
||||
this.$data.showSpinner = false;
|
||||
this.$refs.password.focus();
|
||||
this.$store.dispatch('auth/logout');
|
||||
|
||||
if (!err.response) {
|
||||
return console.error(err);
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
|
||||
<script>
|
||||
import { DateTime } from 'luxon';
|
||||
import { ServerCollection } from '../../models/server';
|
||||
import Server from '../../models/server';
|
||||
import _ from 'lodash';
|
||||
import Flash from '../Flash';
|
||||
import ServerBox from './ServerBox';
|
||||
|
@ -44,7 +44,7 @@
|
|||
documentVisible: true,
|
||||
loading: true,
|
||||
search: '',
|
||||
servers: new ServerCollection,
|
||||
servers: [],
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -83,14 +83,14 @@
|
|||
this.clearFlashes();
|
||||
})
|
||||
.then(response => {
|
||||
this.servers = new ServerCollection;
|
||||
this.servers = [];
|
||||
response.data.data.forEach(obj => {
|
||||
this.getResourceUse(
|
||||
this.servers.add(obj.attributes)
|
||||
);
|
||||
const s = new Server(obj.attributes);
|
||||
this.servers.push(s);
|
||||
this.getResourceUse(s);
|
||||
});
|
||||
|
||||
if (this.servers.models.length === 0) {
|
||||
if (this.servers.length === 0) {
|
||||
this.info(this.$t('dashboard.index.no_matches'));
|
||||
}
|
||||
})
|
||||
|
|
|
@ -1,114 +1,3 @@
|
|||
import { Collection, Model } from 'vue-mc';
|
||||
export default class Server {
|
||||
|
||||
/**
|
||||
* A generic server model used throughout the code base.
|
||||
*/
|
||||
export class Server extends Model {
|
||||
/**
|
||||
* Identifier the primary identifier for this model.
|
||||
*
|
||||
* @returns {{identifier: string}}
|
||||
*/
|
||||
static options() {
|
||||
return {
|
||||
identifier: 'identifier',
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Return the defaults for this model.
|
||||
*
|
||||
* @returns {object}
|
||||
*/
|
||||
static defaults() {
|
||||
return {
|
||||
uuid: null,
|
||||
identifier: null,
|
||||
name: '',
|
||||
description: '',
|
||||
node: '',
|
||||
limits: {
|
||||
memory: 0,
|
||||
swap: 0,
|
||||
disk: 0,
|
||||
io: 0,
|
||||
cpu: 0,
|
||||
},
|
||||
allocation: {
|
||||
ip: null,
|
||||
port: null,
|
||||
},
|
||||
feature_limits: {
|
||||
databases: 0,
|
||||
allocations: 0,
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Mutations to apply to items in this model.
|
||||
*
|
||||
* @returns {{name: StringConstructor, description: StringConstructor}}
|
||||
*/
|
||||
static mutations() {
|
||||
return {
|
||||
uuid: String,
|
||||
identifier: String,
|
||||
name: String,
|
||||
description: String,
|
||||
node: String,
|
||||
limits: {
|
||||
memory: Number,
|
||||
swap: Number,
|
||||
disk: Number,
|
||||
io: Number,
|
||||
cpu: Number,
|
||||
},
|
||||
allocation: {
|
||||
ip: String,
|
||||
port: Number,
|
||||
},
|
||||
feature_limits: {
|
||||
databases: Number,
|
||||
allocations: Number,
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Routes to use when building models.
|
||||
*
|
||||
* @returns {{fetch: string}}
|
||||
*/
|
||||
static routes() {
|
||||
return {
|
||||
fetch: '/api/client/servers/{identifier}',
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export class ServerCollection extends Collection {
|
||||
static model() {
|
||||
return Server;
|
||||
}
|
||||
|
||||
static defaults() {
|
||||
return {
|
||||
orderBy: identifier,
|
||||
};
|
||||
}
|
||||
|
||||
static routes() {
|
||||
return {
|
||||
fetch: '/api/client',
|
||||
};
|
||||
}
|
||||
|
||||
get todo() {
|
||||
return this.sum('done');
|
||||
}
|
||||
|
||||
get done() {
|
||||
return this.todo === 0;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,48 +1,51 @@
|
|||
import { Collection, Model } from 'vue-mc';
|
||||
import JwtDecode from 'jwt-decode';
|
||||
|
||||
export class User extends Model {
|
||||
static defaults() {
|
||||
return {
|
||||
id: null,
|
||||
uuid: '',
|
||||
username: '',
|
||||
email: '',
|
||||
name_first: '',
|
||||
name_last: '',
|
||||
language: 'en',
|
||||
root_admin: false,
|
||||
export default class User {
|
||||
/**
|
||||
* Get a new user model by hitting the Panel API using the authentication token
|
||||
* provided. If no user can be retrieved null will be returned.
|
||||
*
|
||||
* @param {string} token
|
||||
* @param {string} cookie
|
||||
* @return {User|null}
|
||||
*/
|
||||
static fromCookie(token, cookie = 'pterodactyl_session') {
|
||||
window.axios.get('/api/client/account', {
|
||||
headers: {
|
||||
Cookie: `${cookie}=${token}`,
|
||||
}
|
||||
})
|
||||
.then(response => {
|
||||
return new User(response.data.attributes);
|
||||
})
|
||||
.catch(err => {
|
||||
console.error(err);
|
||||
return null;
|
||||
})
|
||||
}
|
||||
|
||||
static mutations() {
|
||||
return {
|
||||
id: Number,
|
||||
uuid: String,
|
||||
username: String,
|
||||
email: String,
|
||||
name_first: String,
|
||||
name_last: String,
|
||||
language: String,
|
||||
root_admin: Boolean,
|
||||
}
|
||||
}
|
||||
|
||||
static fromJWT(token) {
|
||||
return new User(JwtDecode(token).user || {});
|
||||
}
|
||||
}
|
||||
|
||||
export class UserCollection extends Collection {
|
||||
static model() {
|
||||
return User;
|
||||
}
|
||||
|
||||
get todo() {
|
||||
return this.sum('done');
|
||||
}
|
||||
|
||||
get done() {
|
||||
return this.todo === 0;
|
||||
/**
|
||||
* Create a new user model.
|
||||
*
|
||||
* @param {Boolean} admin
|
||||
* @param {String} username
|
||||
* @param {String} email
|
||||
* @param {String} first_name
|
||||
* @param {String} last_name
|
||||
* @param {String} language
|
||||
*/
|
||||
constructor({
|
||||
admin,
|
||||
username,
|
||||
email,
|
||||
first_name,
|
||||
last_name,
|
||||
language,
|
||||
}) {
|
||||
this.admin = admin;
|
||||
this.username = username;
|
||||
this.email = email;
|
||||
this.name = `${first_name} ${last_name}`;
|
||||
this.first_name = first_name;
|
||||
this.last_name = last_name;
|
||||
this.language = language;
|
||||
}
|
||||
}
|
||||
|
|
6
resources/assets/scripts/store/index.js
Normal file
6
resources/assets/scripts/store/index.js
Normal file
|
@ -0,0 +1,6 @@
|
|||
import auth from './modules/auth';
|
||||
|
||||
export default {
|
||||
// strict: process.env.NODE_ENV !== 'production',
|
||||
modules: { auth },
|
||||
};
|
78
resources/assets/scripts/store/modules/auth.js
Normal file
78
resources/assets/scripts/store/modules/auth.js
Normal file
|
@ -0,0 +1,78 @@
|
|||
import User from './../../models/user';
|
||||
const route = require('./../../../../../vendor/tightenco/ziggy/src/js/route').default;
|
||||
|
||||
export default {
|
||||
namespaced: true,
|
||||
state: {
|
||||
user: () => {
|
||||
const data = JSON.parse(localStorage.getItem('token'));
|
||||
|
||||
return User.fromCookie(data.value, data.name);
|
||||
}
|
||||
},
|
||||
getters: {
|
||||
/**
|
||||
* Return the currently authenticated user.
|
||||
*
|
||||
* @param state
|
||||
* @returns {User|null}
|
||||
*/
|
||||
currentUser: function (state) {
|
||||
return state.user;
|
||||
}
|
||||
},
|
||||
setters: {},
|
||||
actions: {
|
||||
login: ({commit}, {user, password}) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
window.axios.post(route('auth.login'), {user, password})
|
||||
.then(response => {
|
||||
commit('logout');
|
||||
|
||||
// If there is a 302 redirect or some other odd behavior (basically, response that isnt
|
||||
// in JSON format) throw an error and don't try to continue with the login.
|
||||
if (!(response.data instanceof Object)) {
|
||||
return reject(new Error('An error was encountered while processing this request.'));
|
||||
}
|
||||
|
||||
if (response.data.complete) {
|
||||
commit('login', {cookie: response.data.cookie, user: response.data.user});
|
||||
return resolve({
|
||||
complete: true,
|
||||
intended: response.data.intended,
|
||||
});
|
||||
}
|
||||
|
||||
return resolve({
|
||||
complete: false,
|
||||
token: response.data.login_token,
|
||||
});
|
||||
})
|
||||
.catch(reject);
|
||||
});
|
||||
},
|
||||
logout: function ({commit}) {
|
||||
return new Promise((resolve, reject) => {
|
||||
window.axios.get(route('auth.logout'))
|
||||
.then(() => {
|
||||
commit('logout');
|
||||
return resolve();
|
||||
})
|
||||
.catch(reject);
|
||||
})
|
||||
},
|
||||
},
|
||||
mutations: {
|
||||
login: function (state, {cookie, user}) {
|
||||
state.user = new User(user);
|
||||
localStorage.setItem('token', JSON.stringify({
|
||||
name: cookie.name,
|
||||
value: cookie.value,
|
||||
}));
|
||||
},
|
||||
logout: function (state) {
|
||||
localStorage.removeItem('token');
|
||||
state.user = null;
|
||||
},
|
||||
},
|
||||
};
|
|
@ -12,6 +12,10 @@ use Pterodactyl\Http\Middleware\Api\Client\AuthenticateClientAccess;
|
|||
*/
|
||||
Route::get('/', 'ClientController@index')->name('api.client.index');
|
||||
|
||||
Route::group(['prefix' => '/account'], function () {
|
||||
Route::get('/', 'AccountController@index')->name('api.client.account');
|
||||
});
|
||||
|
||||
/*
|
||||
|--------------------------------------------------------------------------
|
||||
| Client Control API
|
||||
|
|
Loading…
Reference in a new issue