honeypot feature on register form

This commit is contained in:
tykayn 2021-01-05 17:18:53 +01:00 committed by Baptiste Lemoine
parent f3fc67da43
commit 2568db9bed
2 changed files with 104 additions and 12 deletions

View File

@ -8,8 +8,8 @@
title="Info" title="Info"
type="is-info" type="is-info"
:aria-close-label="$t('Close')" :aria-close-label="$t('Close')"
>{{ $t("You need to login.") }}</b-message >{{ $t("You need to login.") }}
> </b-message>
<b-message <b-message
v-else-if="errorCode === LoginError.LOGIN_PROVIDER_ERROR" v-else-if="errorCode === LoginError.LOGIN_PROVIDER_ERROR"
type="is-danger" type="is-danger"
@ -21,8 +21,8 @@
provider: $route.query.provider, provider: $route.query.provider,
} }
) )
}}</b-message }}
> </b-message>
<b-message <b-message
v-else-if="errorCode === LoginError.LOGIN_PROVIDER_NOT_FOUND" v-else-if="errorCode === LoginError.LOGIN_PROVIDER_NOT_FOUND"
type="is-danger" type="is-danger"
@ -34,8 +34,8 @@
provider: $route.query.provider, provider: $route.query.provider,
} }
) )
}}</b-message }}
> </b-message>
<b-message <b-message
:title="$t('Error')" :title="$t('Error')"
type="is-danger" type="is-danger"
@ -87,8 +87,8 @@
name: RouteName.SEND_PASSWORD_RESET, name: RouteName.SEND_PASSWORD_RESET,
params: { email: credentials.email }, params: { email: credentials.email },
}" }"
>{{ $t("Forgot your password ?") }}</router-link >{{ $t("Forgot your password ?") }}
> </router-link>
</p> </p>
<router-link <router-link
class="button is-text" class="button is-text"
@ -96,8 +96,8 @@
name: RouteName.RESEND_CONFIRMATION, name: RouteName.RESEND_CONFIRMATION,
params: { email: credentials.email }, params: { email: credentials.email },
}" }"
>{{ $t("Didn't receive the instructions?") }}</router-link >{{ $t("Didn't receive the instructions?") }}
> </router-link>
<p class="control" v-if="config && config.registrationsOpen"> <p class="control" v-if="config && config.registrationsOpen">
<router-link <router-link
class="button is-text" class="button is-text"
@ -108,8 +108,8 @@
default_password: credentials.password, default_password: credentials.password,
}, },
}" }"
>{{ $t("Create an account") }}</router-link >{{ $t("Create an account") }}
> </router-link>
</p> </p>
</form> </form>
</div> </div>

View File

@ -87,6 +87,21 @@
:message="errors.email" :message="errors.email"
label-for="email" label-for="email"
> >
<!-- honey pot fields to limit spam account creation on webpage -->
<b-field
class="bees-home"
:label="$t('Password')"
label-for="first_name"
>
<b-input
aria-required="true"
id="first_name"
required
type="text"
password-reveal
v-model="credentials.honey_potter"
/>
</b-field>
<b-input <b-input
aria-required="true" aria-required="true"
required required
@ -171,6 +186,35 @@
</p> </p>
<hr /> <hr />
<b-field
class="bees-home"
:label="$t('Password')"
label-for="middle_name"
>
<b-input
aria-required="true"
id="middle_name"
required
type="text"
password-reveal
v-model="credentials.honey_potter_two"
/>
</b-field>
<b-field
class="bees-home"
:label="$t('Password')"
label-for="last_name"
>
<b-input
aria-required="true"
id="last_name"
required
type="text"
password-reveal
v-model="credentials.honey_potter_nothing"
/>
</b-field>
<div <div
class="control" class="control"
v-if="config && config.auth.oauthProviders.length > 0" v-if="config && config.auth.oauthProviders.length > 0"
@ -224,6 +268,12 @@ export default class Register extends Vue {
email: this.email, email: this.email,
password: this.password, password: this.password,
locale: "en", locale: "en",
// honey pot antispam fields
honey_potter: "",
honey_potter_backup: "",
honey_potter_two: "",
honey_potter_two_backup: "",
honey_potter_nothing: "",
}; };
errors: Record<string, unknown> = {}; errors: Record<string, unknown> = {};
@ -243,7 +293,41 @@ export default class Register extends Vue {
return ""; return "";
} }
mounted() {
this.populate_honeypots();
}
/**
* generate random strings in honeypots
*/
populate_honeypots(): void {
this.credentials.honey_potter = Math.random().toString(16).substr(2, 128);
this.credentials.honey_potter_backup = Object.create(
this.credentials.honey_potter
);
this.credentials.honey_potter_two = Math.random()
.toString(16)
.substr(2, 128);
this.credentials.honey_potter_backup = Object.create(
this.credentials.honey_potter_two
);
}
/**
* checks that honeypots fields did not change
*/
validate_honeypots(): boolean {
return (
this.credentials.honey_potter_nothing === "" &&
this.credentials.honey_potter === this.credentials.honey_potter_backup &&
this.credentials.honey_potter_two ===
this.credentials.honey_potter_two_backup
);
}
async submit(): Promise<void> { async submit(): Promise<void> {
if (this.sendingForm || !this.validate_honeypots()) {
return;
}
this.sendingForm = true; this.sendingForm = true;
this.credentials.locale = this.$i18n.locale; this.credentials.locale = this.$i18n.locale;
try { try {
@ -304,4 +388,12 @@ p.create-account {
margin: 1rem auto 2rem; margin: 1rem auto 2rem;
} }
} }
.bees-home {
overflow: hidden;
width: 0;
height: 0;
display: block;
position: absolute;
}
</style> </style>