Added support for JavaScript FormData

As preparation for 2FA plugins and easier Fetch calls
This commit is contained in:
djmaze 2021-07-23 11:40:03 +02:00
parent 5a0f6c2b9f
commit 0a69c6410d
5 changed files with 26 additions and 31 deletions

View file

@ -47,7 +47,11 @@ abort = (sAction, bClearOnly) => {
fetchJSON = (action, sGetAdd, params, timeout, jsonCallback) => { fetchJSON = (action, sGetAdd, params, timeout, jsonCallback) => {
sGetAdd = pString(sGetAdd); sGetAdd = pString(sGetAdd);
params = params || {}; params = params || {};
params.Action = action; if (params instanceof FormData) {
params.set('Action', action);
} else {
params.Action = action;
}
let init = {}; let init = {};
if (window.AbortController) { if (window.AbortController) {
abort(action); abort(action);

View file

@ -50,20 +50,10 @@ class RemoteUserFetch extends AbstractFetchRemote {
/** /**
* @param {?Function} fCallback * @param {?Function} fCallback
* @param {string} sEmail * @param {FormData} oData
* @param {string} sLogin
* @param {string} sPassword
* @param {boolean} bSignMe
* @param {string=} sLanguage
*/ */
login(fCallback, sEmail, sPassword, bSignMe, sLanguage) { login(fCallback, oData) {
this.defaultRequest(fCallback, 'Login', { this.defaultRequest(fCallback, 'Login', oData);
Email: sEmail,
Login: '',
Password: sPassword,
Language: sLanguage || '',
SignMe: bSignMe ? 1 : 0
});
} }
/** /**

View file

@ -104,17 +104,19 @@ class LoginUserView extends AbstractViewCenter {
} }
submitCommand(self, event) { submitCommand(self, event) {
let email = this.email().trim(), let form = event.target.form,
valid = event.target.form.reportValidity() && email, data = new FormData(form),
pass = this.password(); email = this.email().trim(),
valid = form.reportValidity() && email;
this.emailError(!email); this.emailError(!email);
this.passwordError(!pass); this.passwordError(!this.password());
this.formError(!valid); this.formError(!valid);
if (valid) { if (valid) {
this.submitRequest(true); this.submitRequest(true);
data.set('Language', this.bSendLanguage ? this.language() : '');
data.set('SignMe', this.signMe() ? 1 : 0);
Remote.login( Remote.login(
(iError, oData) => { (iError, oData) => {
if (iError) { if (iError) {
@ -129,10 +131,7 @@ class LoginUserView extends AbstractViewCenter {
rl.route.reload(); rl.route.reload();
} }
}, },
email, data
pass,
!!this.signMe(),
this.bSendLanguage ? this.language() : ''
); );
Local.set(ClientSideKeyName.LastSignMe, this.signMe() ? '-1-' : '-0-'); Local.set(ClientSideKeyName.LastSignMe, this.signMe() ? '-1-' : '-0-');

14
dev/bootstrap.js vendored
View file

@ -94,10 +94,7 @@ export default App => {
if (postData) { if (postData) {
init.method = 'POST'; init.method = 'POST';
init.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8'; init.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';
postData.XToken = Settings.app('token'); const buildFormData = (formData, data, parentKey) => {
// init.body = JSON.stringify(postData);
const formData = new FormData(),
buildFormData = (formData, data, parentKey) => {
if (data && typeof data === 'object' && !(data instanceof Date || data instanceof File)) { if (data && typeof data === 'object' && !(data instanceof Date || data instanceof File)) {
Object.keys(data).forEach(key => Object.keys(data).forEach(key =>
buildFormData(formData, data[key], parentKey ? `${parentKey}[${key}]` : key) buildFormData(formData, data[key], parentKey ? `${parentKey}[${key}]` : key)
@ -105,9 +102,14 @@ export default App => {
} else { } else {
formData.set(parentKey, data == null ? '' : data); formData.set(parentKey, data == null ? '' : data);
} }
return formData;
}; };
buildFormData(formData, postData); postData = (postData instanceof FormData)
init.body = new URLSearchParams(formData); ? postData
: buildFormData(new FormData(), postData);
postData.set('XToken', Settings.app('token'));
// init.body = JSON.stringify(Object.fromEntries(postData));
init.body = new URLSearchParams(postData);
} }
return fetch(resource, init).then(response => { return fetch(resource, init).then(response => {

View file

@ -9,7 +9,7 @@
data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}"> data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}">
<div class="controls" data-bind="css: {'error': emailError}"> <div class="controls" data-bind="css: {'error': emailError}">
<div class="input-append"> <div class="input-append">
<input required="" type="text" class="input-block-level inputIcon" pattern="[^@\s]+(@[^\s]+)?" inputmode="email" <input name="Email" required="" type="text" class="input-block-level inputIcon" pattern="[^@\s]+(@[^\s]+)?" inputmode="email"
autofocus="" autocomplete="email" autocorrect="off" autocapitalize="off" spellcheck="false" autofocus="" autocomplete="email" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: email, disable: submitRequest" data-bind="textInput: email, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/EMAIL" /> data-i18n="[placeholder]GLOBAL/EMAIL" />
@ -18,7 +18,7 @@
</div> </div>
<div class="controls" data-bind="css: {'error': passwordError}"> <div class="controls" data-bind="css: {'error': passwordError}">
<div class="input-append"> <div class="input-append">
<input required="" type="password" class="input-block-level inputIcon" <input name="Password" required="" type="password" class="input-block-level inputIcon"
autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false" autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: password, disable: submitRequest" data-bind="textInput: password, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/PASSWORD" /> data-i18n="[placeholder]GLOBAL/PASSWORD" />