add make login page functional using federation layer and enforce login in router

This commit is contained in:
j3d1 2024-04-08 20:58:44 +02:00
parent 8d64a3c528
commit c49a40df01
5 changed files with 111 additions and 29 deletions

View file

@ -44,6 +44,7 @@
<div :class="errors.email?['mb-3','is-invalid']:['mb-3']">
<label class="form-label">Email</label>
<input class="form-control form-control-lg" type="email"
:class="errors.email?['is-invalid']:[]"
v-model="form.email" placeholder="Enter your email"/>
<div class="invalid-feedback">{{ errors.email }}</div>
</div>
@ -51,6 +52,7 @@
<div :class="errors.password?['mb-3','is-invalid']:['mb-3']">
<label class="form-label">Password</label>
<input class="form-control form-control-lg" type="password"
:class="errors.password?['is-invalid']:[]"
v-model="form.password" placeholder="Enter your password"/>
<div class="invalid-feedback">{{ errors.password }}</div>
</div>
@ -58,6 +60,7 @@
<div :class="errors.password2?['mb-3','is-invalid']:['mb-3']">
<label class="form-label">Password Check</label>
<input class="form-control form-control-lg" type="password"
:class="errors.password2?['is-invalid']:[]"
v-model="password2" placeholder="Enter your password again"/>
<div class="invalid-feedback">{{ errors.password2 }}</div>
</div>
@ -86,6 +89,10 @@
</template>
<script>
import {mapActions} from 'vuex';
import {ServerSet, createNullAuth} from '../federation';
import NeighborsCache from '../neigbors';
export default {
name: 'Register',
data() {
@ -109,6 +116,7 @@ export default {
}
},
methods: {
...mapActions(['lookupServer']),
do_register() {
console.log('do_register');
console.log(this.form);
@ -118,36 +126,34 @@ export default {
} else {
this.errors.password2 = null;
}
fetch('/auth/register/', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(this.form)
})
.then(response => response.json())
.then(data => {
if (data.errors) {
console.error('Error:', data.errors);
this.errors = data.errors;
const user = this.form.username + '@' + this.form.domain;
var unreachable = new NeighborsCache();
var nullAuth = createNullAuth({})
this.lookupServer({username: user}).then(servers => new ServerSet(servers, unreachable))
.then(set => set.post(nullAuth, '/auth/register/', this.form))
.then(response => {
if (response.errors) {
console.error('Error:', response.errors);
this.errors = response.errors;
return;
}
console.log('Success:', data);
console.log('Success:', response);
this.msg = 'Success';
localStorage.setItem('user', user);
this.$router.push('/login');
})
.catch((error) => {
console.error('Error:', error);
this.msg = 'Error';
});
}
},
mounted() {
fetch('/api/domains/')
.then(response => response.json())
.then(data => {
this.domains = data;
});
try {
fetch('/local/domains')
.then(response => response.json())
.then(data => {
this.domains = data;
});
} catch (e) {
console.error('Error:', e);
}
}
}
</script>