update login

update_chat
adb 4 years ago
parent c57d32c450
commit 4821e08b80

@ -4,6 +4,7 @@ export class cookieHandler {
this.reload(); this.reload();
} }
getCookie(key){ getCookie(key){
if (!this.cookies) return undefined;
let cookie = this.cookies.find(cookie => cookie.split('=')[0] === key); let cookie = this.cookies.find(cookie => cookie.split('=')[0] === key);
return cookie ? cookie.split('=')[1] : false; return cookie ? cookie.split('=')[1] : false;
} }
@ -21,7 +22,7 @@ export class cookieHandler {
return cookies; return cookies;
} }
reload(){ reload(){
this.cookies = this.parseCookie(document.cookie) if (document.cookie) this.cookies = this.parseCookie(document.cookie);
} }
store(){ store(){
document.cookie = this.toString(); document.cookie = this.toString();

@ -1,16 +1,15 @@
import matrix from 'matrix-js-sdk'; import matrix from 'matrix-js-sdk';
import {cookieHandler} from '@/lib/cookieHandler.js';
export let client = undefined;
export class MatrixHandler { export class MatrixHandler {
constructor(clientDisplayName = 'matrix-chat') { constructor(clientDisplayName = 'matrix-chat') {
this.clientDisplayName = clientDisplayName; this.clientDisplayName = clientDisplayName;
this.accessToken; this.accessToken;
let cookie = new cookieHandler().getCookie();
this.client = undefined; this.client = undefined;
if (cookie.baseUrl && cookie.accessToken && cookie.userId) this.rooms = undefined;
this.tokenLogin(cookie.baseUrl, cookie.accessToken, cookie.userId);
} }
login(user, password, baseUrl, onError){ login(user, password, baseUrl, onError, callback = ()=>{}){
if (this.client){ console.log('there is already an active session'); return; } if (this.client){ console.log('there is already an active session'); return; }
this.client = new matrix.createClient({ this.client = new matrix.createClient({
baseUrl: baseUrl baseUrl: baseUrl
@ -20,19 +19,34 @@ export class MatrixHandler {
password: password, password: password,
initial_device_display_name: this.clientDisplayName, initial_device_display_name: this.clientDisplayName,
}).then((response) => { }).then((response) => {
console.log(`access token => ${response.access_token}`);
if (response.error) { if (response.error) {
this.logout();
console.log(`login error => ${response.error}`); console.log(`login error => ${response.error}`);
onError(response.error); onError(response.error);
} }
if (response.access_token){
console.log(`access token => ${response.access_token}`);
console.log(this.client.getRooms());
callback(response.access_token);
}
}).catch(error => {
this.logout();
console.log(error);
onError(error.toString());
}) })
} }
tokenLogin(baseUrl, accessToken, userId){ tokenLogin(baseUrl, accessToken, userId){
if (this.client){ console.log('there is already an active session'); return; } if (this.client){ console.log('there is already an active session'); return; }
this.client = new matrix.createClient({baseUrl, accessToken, userId}); this.client = new matrix.createClient({baseUrl, accessToken, userId}).then(response => {
console.log(response);
});
this.client.startClient(); this.client.startClient();
this.client.once('sync', (state) => { this.client.once('sync', (state) => {
console.log(state); console.log(state);
}); });
} }
logout(){
this.client.stopClient();
this.client = undefined;
}
} }

@ -2,16 +2,18 @@ import Vue from 'vue'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
import App from './App.vue' import App from './App.vue'
import {router} from './router.js' import {router} from './router.js'
import {MatrixHandler} from './lib/matrixHandler.js'
import {cookieHandler} from './lib/cookieHandler.js';
Vue.config.productionTip = false Vue.config.productionTip = false;
Vue.use(VueRouter) Vue.use(VueRouter);
export let matrix = new MatrixHandler();
let cookie = new cookieHandler().getCookie();
export default { console.log(`cookie => ${cookie}`)
methods: { if (cookie && cookie.baseUrl && cookie.accessToken && cookie.userId) {
router(route){router.push(route)} matrix.tokenLogin(cookie.baseUrl, cookie.accessToken, cookie.userId);
}
} }
new Vue({ new Vue({
@ -19,8 +21,7 @@ new Vue({
router, router,
template: '<App/>', template: '<App/>',
components: {App}, components: {App},
data(){ data() {
return { return {}
}
} }
}).$mount('#app') }).$mount('#app');

@ -1,8 +1,8 @@
import matrix from 'matrix-js-sdk'; /*import matrix from 'matrix-js-sdk';
import main from '@/main.js'; import main from '@/main.js';
// import Vue from 'vue'; // import Vue from 'vue';
let client = matrix.createClient({}); let client = undefined;
let session = { let session = {
user: '', user: '',
baseUrl: '', baseUrl: '',
@ -44,23 +44,12 @@ export default {
data() { data() {
return { return {
session, session,
client
}; };
}, },
methods: { methods: {
login() { login() {
if (session.accessToken !== '') {
main.methods.error('you are already logged in');
return;
} if (session.login.user === '') {
main.methods.error('username is empty');
return;
} if (session.login.password === '') {
main.methods.error('password is empty');
return;
} if (!(session.login.user.includes('@') && session.login.user.includes(':'))) {
main.methods.error('username is in wrong style');
return;
}
client = matrix.createClient({ client = matrix.createClient({
baseUrl: session.login.baseUrl baseUrl: session.login.baseUrl
}); });
@ -72,6 +61,7 @@ export default {
document.cookie = `accessToken=${response.access_token}`; document.cookie = `accessToken=${response.access_token}`;
document.cookie = `userId=${session.login.user}`; document.cookie = `userId=${session.login.user}`;
document.cookie = `baseUrl=${session.login.baseUrl}`; document.cookie = `baseUrl=${session.login.baseUrl}`;
document.cookie = `SameSite=Strict`;
document.cookie = `expires=${new Date(Date.now() + 86400 * 10 * 1000)}`; document.cookie = `expires=${new Date(Date.now() + 86400 * 10 * 1000)}`;
session = { session = {
user: session.login.user, user: session.login.user,
@ -86,12 +76,12 @@ export default {
console.log(`login error => ${response.error}`); console.log(`login error => ${response.error}`);
} }
window.location.href = '/#/rooms/'; window.location.href = '/#/rooms/';
window.location.reload(); window.location.reload();*/
/*client.startClient(); /*client.startClient();
client.once('sync', (state) => { client.once('sync', (state) => {
console.log(state); console.log(state);
});*/ });*/
}); /* });
}, },
logout(){ logout(){
document.cookie = `accessToken=`; document.cookie = `accessToken=`;
@ -124,7 +114,7 @@ function getCookie(key) {
return cookie ? cookie.split('=')[1] : false; return cookie ? cookie.split('=')[1] : false;
} }
client.on('event', (event) => { /*client.on('event', (event) => {
//console.log(event.getType()); //console.log(event.getType());
//console.log(event); //console.log(event);
if (event.getType() === 'm.room.name') { if (event.getType() === 'm.room.name') {
@ -175,4 +165,4 @@ client.on('Room.timeline', (event, room) => {
} else document.getElementById('scrollDown').style.display = 'block'; } else document.getElementById('scrollDown').style.display = 'block';
} }
} }
}); });*/

@ -1,15 +1,16 @@
<template> <template>
<div id="login"> <div id="login">
<h1 class="title">[chat]</h1> <h1 class="title">[chat]</h1>
<form v-if="session.login" @submit.prevent="login()"> <form v-if="showLogin" @submit.prevent="login()">
<input v-model="session.login.user" class="input" name="user" type="text" maxlength="30" placeholder="@user:adb.sh"><br> <input v-model="user" class="input" name="user" type="text" maxlength="30" placeholder="@user:adb.sh"><br>
<input v-model="session.login.password" class="input" name="password" type="password" maxlength="30" placeholder="password"><br> <input v-model="password" class="input" name="password" type="password" maxlength="30" placeholder="password"><br>
<input v-model="session.login.baseUrl" class="input" name="homeserver" maxlength="50" placeholder="https://matrix.org"><br> <input v-model="homeServer" class="input" name="homeserver" maxlength="50" placeholder="https://matrix.org"><br>
<div v-if="loginError" class="info">{{loginError}}</div>
<textbtn type="submit" text="login" /> <textbtn type="submit" text="login" />
</form> </form>
<div v-else> <div v-else>
<p>you are already logged in</p> <p>you are already logged in</p>
<textbtn @click.native="$router.push('room')" text="chat" /> <textbtn @click.native="$router.push('rooms')" text="chat" />
<textbtn @click.native="logout()" text="logout" /> <textbtn @click.native="logout()" text="logout" />
</div> </div>
</div> </div>
@ -17,7 +18,7 @@
<script> <script>
import textbtn from '@/components/textbtn'; import textbtn from '@/components/textbtn';
import matrix from '@/matrix.js'; import {matrix} from '@/main.js';
export default { export default {
name: "login.vue", name: "login.vue",
@ -26,15 +27,34 @@ export default {
}, },
methods: { methods: {
login(){ login(){
matrix.methods.login(); if (matrix.client !== undefined) {
this.loginError = 'you are already logged in';
return;
} if (this.user === '') {
this.loginError = 'username is empty';
return;
} if (this.password === '') {
this.loginError = 'password is empty';
return;
} if (!(this.user.match(/^@[a-zA-Z0-9]+:[a-z0-9]+\.[a-z]/))) {
this.loginError = 'username is in wrong style';
return;
}
matrix.login(this.user, this.password, this.homeServer, (error) => {
this.loginError = `login failed: ${error}`;
}, ()=> this.$router.push('/rooms/'));
}, },
logout(){ logout(){
matrix.methods.logout(); matrix.logout();
} }
}, },
data(){ data(){
return { return {
session: matrix.data().session user: "",
password: "",
homeServer: "https://adb.sh",
loginError: "",
showLogin: (matrix.client === undefined)
} }
} }
} }
@ -59,7 +79,7 @@ input{
border: 1px solid #fff; border: 1px solid #fff;
text-align: center; text-align: center;
font-size: 1.1rem; font-size: 1.1rem;
margin-top: 1rem; margin: 0.5rem;
appearance: none; appearance: none;
outline: none; outline: none;
} }

Loading…
Cancel
Save