mirror of
https://github.com/MHSanaei/3x-ui.git
synced 2026-06-08 06:04:10 +00:00
fix(login): reliably render turnstile on register tab
This commit is contained in:
parent
67e0fb62b4
commit
7db5b9e214
1 changed files with 22 additions and 16 deletions
|
|
@ -149,6 +149,7 @@
|
||||||
{{template "component/aThemeSwitch" .}}
|
{{template "component/aThemeSwitch" .}}
|
||||||
<script>
|
<script>
|
||||||
var turnstileToken = '';
|
var turnstileToken = '';
|
||||||
|
var turnstileWidgetId = null;
|
||||||
|
|
||||||
const app = new Vue({
|
const app = new Vue({
|
||||||
delimiters: ['[[', ']]'],
|
delimiters: ['[[', ']]'],
|
||||||
|
|
@ -169,7 +170,7 @@
|
||||||
this.twoFactorEnable = await this.getTwoFactorEnable();
|
this.twoFactorEnable = await this.getTwoFactorEnable();
|
||||||
this.turnstileSiteKey = await this.getTurnstileSiteKey();
|
this.turnstileSiteKey = await this.getTurnstileSiteKey();
|
||||||
if (this.turnstileSiteKey) {
|
if (this.turnstileSiteKey) {
|
||||||
this.renderTurnstile();
|
this.$nextTick(() => this.ensureTurnstileRendered());
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
@ -180,6 +181,9 @@
|
||||||
methods: {
|
methods: {
|
||||||
switchTab(key) {
|
switchTab(key) {
|
||||||
this.activeTab = key;
|
this.activeTab = key;
|
||||||
|
if (key === 'register') {
|
||||||
|
this.$nextTick(() => this.ensureTurnstileRendered());
|
||||||
|
}
|
||||||
},
|
},
|
||||||
async doLogin() {
|
async doLogin() {
|
||||||
this.loadingStates.spinning = true;
|
this.loadingStates.spinning = true;
|
||||||
|
|
@ -210,26 +214,28 @@
|
||||||
this.user.username = this.regUser.username;
|
this.user.username = this.regUser.username;
|
||||||
this.regUser = { username: "", password: "", confirmPassword: "" };
|
this.regUser = { username: "", password: "", confirmPassword: "" };
|
||||||
turnstileToken = '';
|
turnstileToken = '';
|
||||||
if (window.turnstile) {
|
if (window.turnstile && turnstileWidgetId !== null) {
|
||||||
var container = document.getElementById('turnstile-widget');
|
turnstile.reset(turnstileWidgetId);
|
||||||
if (container) {
|
|
||||||
turnstile.reset(container);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.loadingStates.registerSpinning = false;
|
this.loadingStates.registerSpinning = false;
|
||||||
},
|
},
|
||||||
renderTurnstile() {
|
ensureTurnstileRendered(retries = 20) {
|
||||||
if (window.turnstile) {
|
if (!this.turnstileSiteKey || turnstileWidgetId !== null) {
|
||||||
var container = document.getElementById('turnstile-widget');
|
return;
|
||||||
if (container) {
|
|
||||||
turnstile.render(container, {
|
|
||||||
sitekey: this.turnstileSiteKey,
|
|
||||||
callback: function(token) { turnstileToken = token; },
|
|
||||||
size: this.turnstileSize,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
var container = document.getElementById('turnstile-widget');
|
||||||
|
if (!container || !window.turnstile) {
|
||||||
|
if (retries > 0) {
|
||||||
|
setTimeout(() => this.ensureTurnstileRendered(retries - 1), 150);
|
||||||
|
}
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
turnstileWidgetId = turnstile.render(container, {
|
||||||
|
sitekey: this.turnstileSiteKey,
|
||||||
|
callback: function(token) { turnstileToken = token; },
|
||||||
|
size: this.turnstileSize,
|
||||||
|
});
|
||||||
},
|
},
|
||||||
async getTurnstileSiteKey() {
|
async getTurnstileSiteKey() {
|
||||||
const msg = await HttpUtil.post('/getTurnstileSiteKey');
|
const msg = await HttpUtil.post('/getTurnstileSiteKey');
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue