@things-factory/auth-ui 7.0.1-rc.7 → 7.0.1-rc.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/client/components/abstract-sign.ts +30 -72
- package/client/components/profile-component.ts +27 -87
- package/dist-client/components/abstract-sign.d.ts +1 -1
- package/dist-client/components/abstract-sign.js +26 -60
- package/dist-client/components/abstract-sign.js.map +1 -1
- package/dist-client/components/profile-component.d.ts +1 -1
- package/dist-client/components/profile-component.js +25 -76
- package/dist-client/components/profile-component.js.map +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/package.json +4 -4
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { html, nothing } from 'lit'
|
|
2
|
-
import base64url from 'base64url'
|
|
3
|
-
|
|
4
1
|
import '@operato/i18n/ox-i18n.js'
|
|
5
2
|
|
|
3
|
+
import { html, nothing } from 'lit'
|
|
4
|
+
import { startAuthentication } from '@simplewebauthn/browser'
|
|
5
|
+
|
|
6
6
|
import { i18next } from '@operato/i18n'
|
|
7
7
|
import { notify } from '@operato/layout'
|
|
8
8
|
|
|
@@ -85,84 +85,42 @@ export abstract class AbstractSign extends AbstractAuthPage {
|
|
|
85
85
|
<ox-i18n msgid="field.${this.pageName}"> </ox-i18n>
|
|
86
86
|
</md-elevated-button>
|
|
87
87
|
${isAvailableWebauthn
|
|
88
|
-
? html` <md-icon class="fingerprint" raised @click=${e => this.
|
|
88
|
+
? html` <md-icon class="fingerprint" raised @click=${e => this.authenticateUser()}> fingerprint </md-icon>`
|
|
89
89
|
: nothing}
|
|
90
90
|
</div>
|
|
91
91
|
`
|
|
92
92
|
}
|
|
93
93
|
|
|
94
|
-
async
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
}
|
|
118
|
-
})) as PublicKeyCredential
|
|
119
|
-
|
|
120
|
-
if (!credential) {
|
|
121
|
-
notify({
|
|
122
|
-
level: 'error',
|
|
123
|
-
message: 'can not get user credential'
|
|
124
|
-
})
|
|
125
|
-
|
|
126
|
-
return
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
const assertionResponse = {
|
|
130
|
-
id: credential.id,
|
|
131
|
-
response: {
|
|
132
|
-
clientDataJSON: base64url.encode(Buffer.from(credential.response.clientDataJSON)),
|
|
133
|
-
authenticatorData: base64url.encode((credential.response as any).authenticatorData),
|
|
134
|
-
signature: base64url.encode((credential.response as any).signature),
|
|
135
|
-
userHandle: (credential.response as any).userHandle
|
|
136
|
-
? base64url.encode((credential.response as any).userHandle)
|
|
137
|
-
: null
|
|
94
|
+
async authenticateUser() {
|
|
95
|
+
try {
|
|
96
|
+
const options = await fetch('/auth/signin-webauthn/challenge').then(res => res.json())
|
|
97
|
+
const assertionResp = await startAuthentication(options)
|
|
98
|
+
const verification = await fetch('/auth/signin-webauthn', {
|
|
99
|
+
method: 'POST',
|
|
100
|
+
headers: {
|
|
101
|
+
'Content-Type': 'application/json'
|
|
102
|
+
},
|
|
103
|
+
body: JSON.stringify(assertionResp)
|
|
104
|
+
}).then(res => res.json())
|
|
105
|
+
|
|
106
|
+
if (verification.verified) {
|
|
107
|
+
const { redirectURL } = verification
|
|
108
|
+
|
|
109
|
+
if (redirectURL) {
|
|
110
|
+
window.location.href = redirectURL
|
|
111
|
+
}
|
|
112
|
+
} else {
|
|
113
|
+
notify({
|
|
114
|
+
level: 'error',
|
|
115
|
+
message: verification.message
|
|
116
|
+
})
|
|
138
117
|
}
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
if (credential.authenticatorAttachment) {
|
|
142
|
-
assertionResponse.authenticatorAttachment = credential.authenticatorAttachment as AuthenticatorAttachment
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
const signinResponse = await fetch('/auth/signin-webauthn', {
|
|
146
|
-
method: 'POST',
|
|
147
|
-
headers: {
|
|
148
|
-
'Content-Type': 'application/json',
|
|
149
|
-
Accept: 'application/json'
|
|
150
|
-
},
|
|
151
|
-
body: JSON.stringify(assertionResponse),
|
|
152
|
-
credentials: 'include'
|
|
153
|
-
})
|
|
154
|
-
|
|
155
|
-
if (!signinResponse.ok) {
|
|
118
|
+
|
|
119
|
+
} catch (error) {
|
|
156
120
|
notify({
|
|
157
121
|
level: 'error',
|
|
158
|
-
message:
|
|
122
|
+
message: i18next.t('error.authn verification failed')
|
|
159
123
|
})
|
|
160
|
-
} else {
|
|
161
|
-
const { redirectURL } = await signinResponse.json()
|
|
162
|
-
|
|
163
|
-
if (redirectURL) {
|
|
164
|
-
window.location.href = redirectURL
|
|
165
|
-
}
|
|
166
124
|
}
|
|
167
125
|
}
|
|
168
126
|
}
|
|
@@ -7,6 +7,7 @@ import './my-login-history'
|
|
|
7
7
|
import base64url from 'base64url'
|
|
8
8
|
import { css, html, LitElement, nothing } from 'lit'
|
|
9
9
|
import { customElement, property, query, state } from 'lit/decorators.js'
|
|
10
|
+
import { startRegistration } from '@simplewebauthn/browser'
|
|
10
11
|
|
|
11
12
|
import { i18next, localize } from '@operato/i18n'
|
|
12
13
|
import { notify, openPopup } from '@operato/layout'
|
|
@@ -164,7 +165,7 @@ export class ProfileComponent extends localize(i18next)(LitElement) {
|
|
|
164
165
|
|
|
165
166
|
${isAvailableWebauthn
|
|
166
167
|
? html`
|
|
167
|
-
<md-text-button @click=${() => this.
|
|
168
|
+
<md-text-button @click=${() => this.registerUser()}
|
|
168
169
|
>${i18next.t('button.security-key registration')}</md-text-button
|
|
169
170
|
>
|
|
170
171
|
`
|
|
@@ -244,96 +245,35 @@ export class ProfileComponent extends localize(i18next)(LitElement) {
|
|
|
244
245
|
})
|
|
245
246
|
}
|
|
246
247
|
|
|
247
|
-
async
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
credentials: 'include'
|
|
256
|
-
})
|
|
257
|
-
|
|
258
|
-
if (!challenge.ok) {
|
|
259
|
-
notify({
|
|
260
|
-
level: 'error',
|
|
261
|
-
message: await challenge.text()
|
|
262
|
-
})
|
|
263
|
-
|
|
264
|
-
return
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
const options = await challenge.json()
|
|
268
|
-
|
|
269
|
-
const credential = (await navigator.credentials.create({
|
|
270
|
-
publicKey: {
|
|
271
|
-
rp: {
|
|
272
|
-
name: this.applicationMeta.title
|
|
273
|
-
},
|
|
274
|
-
user: {
|
|
275
|
-
id: Uint8Array.from(base64url.toBuffer(options.user.id)).buffer,
|
|
276
|
-
name: options.user.name,
|
|
277
|
-
displayName: options.user.displayName
|
|
248
|
+
async registerUser() {
|
|
249
|
+
try {
|
|
250
|
+
const options = await fetch('/auth/register-webauthn/challenge').then(res => res.json())
|
|
251
|
+
const attResp = await startRegistration(options)
|
|
252
|
+
const verification = await fetch('/auth/verify-registration', {
|
|
253
|
+
method: 'POST',
|
|
254
|
+
headers: {
|
|
255
|
+
'Content-Type': 'application/json'
|
|
278
256
|
},
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
257
|
+
body: JSON.stringify(attResp)
|
|
258
|
+
}).then(res => res.json())
|
|
259
|
+
|
|
260
|
+
if (verification.verified) {
|
|
261
|
+
notify({
|
|
262
|
+
level: 'info',
|
|
263
|
+
message: i18next.t('text.user credential registered successfully')
|
|
264
|
+
})
|
|
265
|
+
} else {
|
|
266
|
+
console.error(await verification.text())
|
|
267
|
+
|
|
268
|
+
notify({
|
|
269
|
+
level: 'error',
|
|
270
|
+
message: i18next.t('error.user credential registeration not allowed')
|
|
271
|
+
})
|
|
293
272
|
}
|
|
294
|
-
})
|
|
295
|
-
|
|
296
|
-
if (!credential) {
|
|
273
|
+
} catch (error) {
|
|
297
274
|
notify({
|
|
298
275
|
level: 'error',
|
|
299
|
-
message: '
|
|
300
|
-
})
|
|
301
|
-
|
|
302
|
-
return
|
|
303
|
-
}
|
|
304
|
-
|
|
305
|
-
const response = credential.response as AuthenticatorAttestationResponse
|
|
306
|
-
|
|
307
|
-
var body = {
|
|
308
|
-
response: {
|
|
309
|
-
clientDataJSON: Buffer.from(response.clientDataJSON).toString('base64'),
|
|
310
|
-
attestationObject: Buffer.from(response.attestationObject).toString('base64')
|
|
311
|
-
} as any
|
|
312
|
-
}
|
|
313
|
-
|
|
314
|
-
if (response.getTransports) {
|
|
315
|
-
body.response.transports = response.getTransports()
|
|
316
|
-
}
|
|
317
|
-
|
|
318
|
-
const signinResponse = await fetch('/auth/signin-webauthn', {
|
|
319
|
-
method: 'POST',
|
|
320
|
-
headers: {
|
|
321
|
-
'Content-Type': 'application/json',
|
|
322
|
-
Accept: 'application/json'
|
|
323
|
-
},
|
|
324
|
-
body: JSON.stringify(body),
|
|
325
|
-
credentials: 'include'
|
|
326
|
-
})
|
|
327
|
-
|
|
328
|
-
if (!signinResponse.ok) {
|
|
329
|
-
notify({
|
|
330
|
-
level: 'error',
|
|
331
|
-
message: await signinResponse.text()
|
|
332
|
-
})
|
|
333
|
-
} else {
|
|
334
|
-
notify({
|
|
335
|
-
level: 'info',
|
|
336
|
-
message: i18next.t('text.user credential registered successfully')
|
|
276
|
+
message: i18next.t('error.user credential registeration failed')
|
|
337
277
|
})
|
|
338
278
|
}
|
|
339
279
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { html, nothing } from 'lit';
|
|
2
|
-
import base64url from 'base64url';
|
|
3
1
|
import '@operato/i18n/ox-i18n.js';
|
|
2
|
+
import { html, nothing } from 'lit';
|
|
3
|
+
import { startAuthentication } from '@simplewebauthn/browser';
|
|
4
4
|
import { i18next } from '@operato/i18n';
|
|
5
5
|
import { notify } from '@operato/layout';
|
|
6
6
|
import { AbstractAuthPage } from './abstract-auth-page.js';
|
|
@@ -66,75 +66,41 @@ export class AbstractSign extends AbstractAuthPage {
|
|
|
66
66
|
<ox-i18n msgid="field.${this.pageName}"> </ox-i18n>
|
|
67
67
|
</md-elevated-button>
|
|
68
68
|
${isAvailableWebauthn
|
|
69
|
-
? html ` <md-icon class="fingerprint" raised @click=${e => this.
|
|
69
|
+
? html ` <md-icon class="fingerprint" raised @click=${e => this.authenticateUser()}> fingerprint </md-icon>`
|
|
70
70
|
: nothing}
|
|
71
71
|
</div>
|
|
72
72
|
`;
|
|
73
73
|
}
|
|
74
|
-
async
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
const options = await response.json();
|
|
91
|
-
const credential = (await navigator.credentials.get({
|
|
92
|
-
publicKey: {
|
|
93
|
-
challenge: Buffer.from(options.challenge, 'base64')
|
|
74
|
+
async authenticateUser() {
|
|
75
|
+
try {
|
|
76
|
+
const options = await fetch('/auth/signin-webauthn/challenge').then(res => res.json());
|
|
77
|
+
const assertionResp = await startAuthentication(options);
|
|
78
|
+
const verification = await fetch('/auth/signin-webauthn', {
|
|
79
|
+
method: 'POST',
|
|
80
|
+
headers: {
|
|
81
|
+
'Content-Type': 'application/json'
|
|
82
|
+
},
|
|
83
|
+
body: JSON.stringify(assertionResp)
|
|
84
|
+
}).then(res => res.json());
|
|
85
|
+
if (verification.verified) {
|
|
86
|
+
const { redirectURL } = verification;
|
|
87
|
+
if (redirectURL) {
|
|
88
|
+
window.location.href = redirectURL;
|
|
89
|
+
}
|
|
94
90
|
}
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
});
|
|
101
|
-
return;
|
|
102
|
-
}
|
|
103
|
-
const assertionResponse = {
|
|
104
|
-
id: credential.id,
|
|
105
|
-
response: {
|
|
106
|
-
clientDataJSON: base64url.encode(Buffer.from(credential.response.clientDataJSON)),
|
|
107
|
-
authenticatorData: base64url.encode(credential.response.authenticatorData),
|
|
108
|
-
signature: base64url.encode(credential.response.signature),
|
|
109
|
-
userHandle: credential.response.userHandle
|
|
110
|
-
? base64url.encode(credential.response.userHandle)
|
|
111
|
-
: null
|
|
91
|
+
else {
|
|
92
|
+
notify({
|
|
93
|
+
level: 'error',
|
|
94
|
+
message: verification.message
|
|
95
|
+
});
|
|
112
96
|
}
|
|
113
|
-
};
|
|
114
|
-
if (credential.authenticatorAttachment) {
|
|
115
|
-
assertionResponse.authenticatorAttachment = credential.authenticatorAttachment;
|
|
116
97
|
}
|
|
117
|
-
|
|
118
|
-
method: 'POST',
|
|
119
|
-
headers: {
|
|
120
|
-
'Content-Type': 'application/json',
|
|
121
|
-
Accept: 'application/json'
|
|
122
|
-
},
|
|
123
|
-
body: JSON.stringify(assertionResponse),
|
|
124
|
-
credentials: 'include'
|
|
125
|
-
});
|
|
126
|
-
if (!signinResponse.ok) {
|
|
98
|
+
catch (error) {
|
|
127
99
|
notify({
|
|
128
100
|
level: 'error',
|
|
129
|
-
message:
|
|
101
|
+
message: i18next.t('error.authn verification failed')
|
|
130
102
|
});
|
|
131
103
|
}
|
|
132
|
-
else {
|
|
133
|
-
const { redirectURL } = await signinResponse.json();
|
|
134
|
-
if (redirectURL) {
|
|
135
|
-
window.location.href = redirectURL;
|
|
136
|
-
}
|
|
137
|
-
}
|
|
138
104
|
}
|
|
139
105
|
}
|
|
140
106
|
//# sourceMappingURL=abstract-sign.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"abstract-sign.js","sourceRoot":"","sources":["../../client/components/abstract-sign.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AACnC,OAAO,
|
|
1
|
+
{"version":3,"file":"abstract-sign.js","sourceRoot":"","sources":["../../client/components/abstract-sign.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/i18n/ox-i18n.js'\n\nimport { html, nothing } from 'lit'\nimport { startAuthentication } from '@simplewebauthn/browser'\n\nimport { i18next } from '@operato/i18n'\nimport { notify } from '@operato/layout'\n\nimport { AbstractAuthPage } from './abstract-auth-page.js'\n\nconst isAvailableWebauthn = 'PublicKeyCredential' in window\n\ninterface AssertionResponse {\n id: string\n rawId?: number[]\n response: {\n authenticatorData: string\n clientDataJSON: string\n signature: string\n userHandle: string | null\n }\n type: PublicKeyCredentialType\n authenticatorAttachment?: AuthenticatorAttachment\n}\n\nexport abstract class AbstractSign extends AbstractAuthPage {\n async submit() {\n this.formEl.submit()\n }\n\n updated(changed) {\n super.updated(changed)\n\n if (changed.has('message')) {\n if (!this.message) {\n this.hideSnackbar()\n } else {\n this.showSnackbar({\n level: 'error',\n timer: -1\n })\n }\n }\n }\n\n get formfields() {\n const email = this.data?.email || ''\n\n return html`\n <input id=\"redirectTo\" type=\"hidden\" name=\"redirectTo\" .value=${this.redirectTo || '/'} />\n\n <div class=\"field\">\n <md-filled-text-field\n name=\"email\"\n type=\"email\"\n label=${String(i18next.t('field.email'))}\n required\n .value=${email}\n autocomplete=\"username\"\n autocapitalize=\"off\"\n @input=${(e: Event) => {\n const target = e.target as HTMLInputElement\n if (target.validity.typeMismatch) {\n target.setCustomValidity(i18next.t('text.invalid-email'))\n } else {\n target.setCustomValidity('')\n }\n }}\n ><md-icon slot=\"leading-icon\">mail</md-icon></md-filled-text-field\n >\n </div>\n <div class=\"field\">\n <md-filled-text-field\n name=\"password\"\n type=\"password\"\n label=${String(i18next.t('field.password'))}\n autocomplete=\"current-password\"\n required\n ><md-icon slot=\"leading-icon\">vpn_key</md-icon></md-filled-text-field\n >\n </div>\n\n <div class=\"submit-buttons-container\">\n <md-elevated-button class=\"submit-button\" type=\"submit\" raised @click=${e => this._onSubmit(e)}>\n <ox-i18n msgid=\"field.${this.pageName}\"> </ox-i18n>\n </md-elevated-button>\n ${isAvailableWebauthn\n ? html` <md-icon class=\"fingerprint\" raised @click=${e => this.authenticateUser()}> fingerprint </md-icon>`\n : nothing}\n </div>\n `\n }\n\n async authenticateUser() {\n try {\n const options = await fetch('/auth/signin-webauthn/challenge').then(res => res.json())\n const assertionResp = await startAuthentication(options)\n const verification = await fetch('/auth/signin-webauthn', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify(assertionResp)\n }).then(res => res.json())\n\n if (verification.verified) {\n const { redirectURL } = verification\n \n if (redirectURL) {\n window.location.href = redirectURL\n }\n } else {\n notify({\n level: 'error',\n message: verification.message\n })\n }\n \n } catch (error) {\n notify({\n level: 'error',\n message: i18next.t('error.authn verification failed')\n })\n }\n }\n}\n"]}
|
|
@@ -23,7 +23,7 @@ export declare class ProfileComponent extends ProfileComponent_base {
|
|
|
23
23
|
onLocaleChanged(value: any): Promise<void>;
|
|
24
24
|
openLoginHistory(): void;
|
|
25
25
|
deleteUser(): void;
|
|
26
|
-
|
|
26
|
+
registerUser(): Promise<void>;
|
|
27
27
|
get applicationMeta(): {
|
|
28
28
|
icon: string;
|
|
29
29
|
title: string;
|
|
@@ -4,9 +4,9 @@ import '@operato/i18n/ox-i18n-selector.js';
|
|
|
4
4
|
import './change-password';
|
|
5
5
|
import './delete-user-popup';
|
|
6
6
|
import './my-login-history';
|
|
7
|
-
import base64url from 'base64url';
|
|
8
7
|
import { css, html, LitElement, nothing } from 'lit';
|
|
9
8
|
import { customElement, property, query, state } from 'lit/decorators.js';
|
|
9
|
+
import { startRegistration } from '@simplewebauthn/browser';
|
|
10
10
|
import { i18next, localize } from '@operato/i18n';
|
|
11
11
|
import { notify, openPopup } from '@operato/layout';
|
|
12
12
|
import { auth, getLanguages } from '@things-factory/auth-base/dist-client';
|
|
@@ -63,7 +63,7 @@ let ProfileComponent = class ProfileComponent extends localize(i18next)(LitEleme
|
|
|
63
63
|
|
|
64
64
|
${isAvailableWebauthn
|
|
65
65
|
? html `
|
|
66
|
-
<md-text-button @click=${() => this.
|
|
66
|
+
<md-text-button @click=${() => this.registerUser()}
|
|
67
67
|
>${i18next.t('button.security-key registration')}</md-text-button
|
|
68
68
|
>
|
|
69
69
|
`
|
|
@@ -133,86 +133,35 @@ let ProfileComponent = class ProfileComponent extends localize(i18next)(LitEleme
|
|
|
133
133
|
title: i18next.t('label.delete account')
|
|
134
134
|
});
|
|
135
135
|
}
|
|
136
|
-
async
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
credentials: 'include'
|
|
145
|
-
});
|
|
146
|
-
if (!challenge.ok) {
|
|
147
|
-
notify({
|
|
148
|
-
level: 'error',
|
|
149
|
-
message: await challenge.text()
|
|
150
|
-
});
|
|
151
|
-
return;
|
|
152
|
-
}
|
|
153
|
-
const options = await challenge.json();
|
|
154
|
-
const credential = (await navigator.credentials.create({
|
|
155
|
-
publicKey: {
|
|
156
|
-
rp: {
|
|
157
|
-
name: this.applicationMeta.title
|
|
158
|
-
},
|
|
159
|
-
user: {
|
|
160
|
-
id: Uint8Array.from(base64url.toBuffer(options.user.id)).buffer,
|
|
161
|
-
name: options.user.name,
|
|
162
|
-
displayName: options.user.displayName
|
|
136
|
+
async registerUser() {
|
|
137
|
+
try {
|
|
138
|
+
const options = await fetch('/auth/register-webauthn/challenge').then(res => res.json());
|
|
139
|
+
const attResp = await startRegistration(options);
|
|
140
|
+
const verification = await fetch('/auth/verify-registration', {
|
|
141
|
+
method: 'POST',
|
|
142
|
+
headers: {
|
|
143
|
+
'Content-Type': 'application/json'
|
|
163
144
|
},
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
type: 'public-key',
|
|
172
|
-
alg: -257 // RS256
|
|
173
|
-
}
|
|
174
|
-
],
|
|
175
|
-
authenticatorSelection: {
|
|
176
|
-
userVerification: 'preferred'
|
|
177
|
-
}
|
|
145
|
+
body: JSON.stringify(attResp)
|
|
146
|
+
}).then(res => res.json());
|
|
147
|
+
if (verification.verified) {
|
|
148
|
+
notify({
|
|
149
|
+
level: 'info',
|
|
150
|
+
message: i18next.t('text.user credential registered successfully')
|
|
151
|
+
});
|
|
178
152
|
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
return;
|
|
186
|
-
}
|
|
187
|
-
const response = credential.response;
|
|
188
|
-
var body = {
|
|
189
|
-
response: {
|
|
190
|
-
clientDataJSON: Buffer.from(response.clientDataJSON).toString('base64'),
|
|
191
|
-
attestationObject: Buffer.from(response.attestationObject).toString('base64')
|
|
153
|
+
else {
|
|
154
|
+
console.error(await verification.text());
|
|
155
|
+
notify({
|
|
156
|
+
level: 'error',
|
|
157
|
+
message: i18next.t('error.user credential registeration not allowed')
|
|
158
|
+
});
|
|
192
159
|
}
|
|
193
|
-
};
|
|
194
|
-
if (response.getTransports) {
|
|
195
|
-
body.response.transports = response.getTransports();
|
|
196
160
|
}
|
|
197
|
-
|
|
198
|
-
method: 'POST',
|
|
199
|
-
headers: {
|
|
200
|
-
'Content-Type': 'application/json',
|
|
201
|
-
Accept: 'application/json'
|
|
202
|
-
},
|
|
203
|
-
body: JSON.stringify(body),
|
|
204
|
-
credentials: 'include'
|
|
205
|
-
});
|
|
206
|
-
if (!signinResponse.ok) {
|
|
161
|
+
catch (error) {
|
|
207
162
|
notify({
|
|
208
163
|
level: 'error',
|
|
209
|
-
message:
|
|
210
|
-
});
|
|
211
|
-
}
|
|
212
|
-
else {
|
|
213
|
-
notify({
|
|
214
|
-
level: 'info',
|
|
215
|
-
message: i18next.t('text.user credential registered successfully')
|
|
164
|
+
message: i18next.t('error.user credential registeration failed')
|
|
216
165
|
});
|
|
217
166
|
}
|
|
218
167
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"profile-component.js","sourceRoot":"","sources":["../../client/components/profile-component.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/i18n/ox-i18n.js'\nimport '@operato/i18n/ox-i18n-selector.js'\nimport './change-password'\nimport './delete-user-popup'\nimport './my-login-history'\n\nimport base64url from 'base64url'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { notify, openPopup } from '@operato/layout'\nimport { auth, getLanguages } from '@things-factory/auth-base/dist-client'\n\nconst isAvailableWebauthn = 'PublicKeyCredential' in window\n@customElement('profile-component')\nexport class ProfileComponent extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: block;\n background-color: var(--md-sys-color-background);\n padding: 15px 0;\n }\n .wrap {\n max-width: var(--profile-wrap-max-width, 400px);\n margin: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n }\n\n * {\n box-sizing: border-box;\n }\n\n *:focus {\n outline: none;\n }\n\n input {\n margin: var(--margin-narrow) 0;\n border: 1px solid rgba(0, 0, 0, 0.2);\n padding: 9px;\n border-radius: var(--border-radius);\n font: var(--auth-input-field-font);\n width: var(--auth-input-field-width);\n }\n input:focus {\n border: 1px solid var(--focus-background-color);\n }\n\n .user {\n background: url(/assets/images/icon-profile.png) center top no-repeat;\n margin: var(--profile-icon-margin);\n padding: 180px 20px 20px 20px;\n color: var(--md-sys-color-secondary);\n font: var(--header-bar-title);\n text-align: center;\n }\n\n hr {\n width: 100%;\n border: dotted 1px rgba(0, 0, 0, 0.1);\n }\n\n .wrap * {\n grid-column: span 2;\n }\n\n label {\n font: bold 14px var(--theme-font);\n color: var(--md-sys-color-primary);\n text-transform: capitalize;\n grid-column: 1;\n }\n\n .wrap *.inline {\n grid-column: unset;\n }\n\n ox-i18n-selector {\n --i18n-selector-field-width: var(--auth-input-field-width);\n --i18n-selector-field-margin: var(--change-password-field-margin);\n --i18n-selector-field-padding: var(--padding-default);\n --i18n-selector-field-border-radius: var(--border-radius);\n margin: var(--change-password-field-margin);\n }\n\n footer {\n padding: 20px;\n text-align: center;\n }\n\n footer p {\n font-size: 14px;\n margin-bottom: 5px;\n color: var(--md-sys-color-on-background);\n }\n\n footer a {\n color: var(--md-sys-color-primary);\n text-decoration: none;\n font-weight: bold;\n }\n `\n ]\n\n @property({ type: String }) userId?: string\n @property({ type: String }) email?: string\n @property({ type: String }) name?: string\n\n @state() languages: { code: string; display: string }[] = []\n\n @query('#name') nameEl!: HTMLInputElement\n @query('#locale') localeEl!: HTMLInputElement\n\n async firstUpdated() {\n auth.on('profile', ({ credential }) => {\n this.setCredential(credential)\n })\n\n this.setCredential(auth.credential)\n\n this.languages = await getLanguages()\n }\n\n setCredential(credential) {\n if (credential) {\n this.userId = credential.id\n this.name = credential.name\n this.email = credential.email\n } else {\n this.userId = ''\n this.name = ''\n this.email = ''\n }\n }\n\n render() {\n return html`\n <div class=\"wrap\">\n <div class=\"user\">${this.email || ''}</div>\n\n <label for=\"name\"><ox-i18n slot=\"title\" msgid=\"label.name\"></ox-i18n></label>\n <input id=\"name\" @change=${e => this.onNameChanged(e.target.value)} .value=${this.name || ''} />\n\n <hr />\n\n <label for=\"locale\"><ox-i18n slot=\"title\" msgid=\"label.language\"></ox-i18n></label>\n <ox-i18n-selector\n id=\"locale\"\n @change=${e => this.onLocaleChanged(e.detail)}\n value=${i18next.language || 'en-US'}\n .languages=${this.languages}\n ></ox-i18n-selector>\n\n <hr />\n\n <label for=\"change-password\">\n <ox-i18n msgid=\"label.password\"></ox-i18n>\n </label>\n\n <change-password id=\"change-password\"></change-password>\n\n ${isAvailableWebauthn\n ? html`\n <md-text-button @click=${() => this.registerWebAuthn()}\n >${i18next.t('button.security-key registration')}</md-text-button\n >\n `\n : nothing}\n\n <footer>\n <p>\n ${i18next.t('text.click login history')}\n <a href=\"javascript:void(0);\" @click=${this.openLoginHistory.bind(this)}\n >${i18next.t('label.login_history')}</a\n >\n </p>\n </footer>\n </div>\n `\n }\n\n async onNameChanged(name) {\n if (!name) return\n\n var oldName = this.name\n\n try {\n const message = await auth.updateProfile({\n name\n })\n\n notify({\n level: 'info',\n message\n })\n } catch (e: any) {\n this.nameEl.value = oldName || ''\n\n notify({\n level: 'error',\n message: 'message' in e ? e.message : e\n })\n }\n }\n\n async onLocaleChanged(value) {\n if (!value) return\n\n var oldLocale = i18next.language\n\n try {\n const message = await auth.updateProfile({\n locale: value\n })\n\n i18next.changeLanguage(value)\n\n notify({\n level: 'info',\n message\n })\n } catch (e: any) {\n this.localeEl.value = oldLocale\n\n notify({\n level: 'error',\n message: 'message' in e ? e.message : e\n })\n }\n }\n\n openLoginHistory() {\n openPopup(html` <my-login-history></my-login-history> `, {\n title: i18next.t('label.login_history')\n })\n }\n\n deleteUser() {\n openPopup(html` <delete-user-popup></delete-user-popup> `, {\n title: i18next.t('label.delete account')\n })\n }\n\n async registerWebAuthn() {\n const challenge = await fetch('/auth/register-webauthn/challenge', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n Accept: 'application/json'\n },\n body: JSON.stringify({ id: this.userId }),\n credentials: 'include'\n })\n\n if (!challenge.ok) {\n notify({\n level: 'error',\n message: await challenge.text()\n })\n\n return\n }\n\n const options = await challenge.json()\n\n const credential = (await navigator.credentials.create({\n publicKey: {\n rp: {\n name: this.applicationMeta.title\n },\n user: {\n id: Uint8Array.from(base64url.toBuffer(options.user.id)).buffer,\n name: options.user.name,\n displayName: options.user.displayName\n },\n challenge: Uint8Array.from(atob(options.challenge), c => c.charCodeAt(0)),\n pubKeyCredParams: [\n {\n type: 'public-key',\n alg: -7 // ES256\n },\n {\n type: 'public-key',\n alg: -257 // RS256\n }\n ],\n authenticatorSelection: {\n userVerification: 'preferred'\n }\n }\n })) as PublicKeyCredential\n\n if (!credential) {\n notify({\n level: 'error',\n message: 'can not get user credential'\n })\n\n return\n }\n\n const response = credential.response as AuthenticatorAttestationResponse\n\n var body = {\n response: {\n clientDataJSON: Buffer.from(response.clientDataJSON).toString('base64'),\n attestationObject: Buffer.from(response.attestationObject).toString('base64')\n } as any\n }\n\n if (response.getTransports) {\n body.response.transports = response.getTransports()\n }\n\n const signinResponse = await fetch('/auth/signin-webauthn', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n Accept: 'application/json'\n },\n body: JSON.stringify(body),\n credentials: 'include'\n })\n\n if (!signinResponse.ok) {\n notify({\n level: 'error',\n message: await signinResponse.text()\n })\n } else {\n notify({\n level: 'info',\n message: i18next.t('text.user credential registered successfully')\n })\n }\n }\n\n get applicationMeta() {\n var iconLink: HTMLLinkElement | null = document.querySelector('link[rel=\"application-icon\"]')\n var titleMeta: HTMLMetaElement | null = document.querySelector('meta[name=\"application-name\"]')\n var descriptionMeta: HTMLMetaElement | null = document.querySelector('meta[name=\"application-description\"]')\n\n return {\n icon: iconLink?.href || '',\n title: titleMeta?.content || 'Things Factory',\n description: descriptionMeta?.content || 'Reimagining Software'\n }\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"profile-component.js","sourceRoot":"","sources":["../../client/components/profile-component.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/i18n/ox-i18n.js'\nimport '@operato/i18n/ox-i18n-selector.js'\nimport './change-password'\nimport './delete-user-popup'\nimport './my-login-history'\n\nimport base64url from 'base64url'\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { startRegistration } from '@simplewebauthn/browser'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { notify, openPopup } from '@operato/layout'\nimport { auth, getLanguages } from '@things-factory/auth-base/dist-client'\n\nconst isAvailableWebauthn = 'PublicKeyCredential' in window\n@customElement('profile-component')\nexport class ProfileComponent extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: block;\n background-color: var(--md-sys-color-background);\n padding: 15px 0;\n }\n .wrap {\n max-width: var(--profile-wrap-max-width, 400px);\n margin: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n }\n\n * {\n box-sizing: border-box;\n }\n\n *:focus {\n outline: none;\n }\n\n input {\n margin: var(--margin-narrow) 0;\n border: 1px solid rgba(0, 0, 0, 0.2);\n padding: 9px;\n border-radius: var(--border-radius);\n font: var(--auth-input-field-font);\n width: var(--auth-input-field-width);\n }\n input:focus {\n border: 1px solid var(--focus-background-color);\n }\n\n .user {\n background: url(/assets/images/icon-profile.png) center top no-repeat;\n margin: var(--profile-icon-margin);\n padding: 180px 20px 20px 20px;\n color: var(--md-sys-color-secondary);\n font: var(--header-bar-title);\n text-align: center;\n }\n\n hr {\n width: 100%;\n border: dotted 1px rgba(0, 0, 0, 0.1);\n }\n\n .wrap * {\n grid-column: span 2;\n }\n\n label {\n font: bold 14px var(--theme-font);\n color: var(--md-sys-color-primary);\n text-transform: capitalize;\n grid-column: 1;\n }\n\n .wrap *.inline {\n grid-column: unset;\n }\n\n ox-i18n-selector {\n --i18n-selector-field-width: var(--auth-input-field-width);\n --i18n-selector-field-margin: var(--change-password-field-margin);\n --i18n-selector-field-padding: var(--padding-default);\n --i18n-selector-field-border-radius: var(--border-radius);\n margin: var(--change-password-field-margin);\n }\n\n footer {\n padding: 20px;\n text-align: center;\n }\n\n footer p {\n font-size: 14px;\n margin-bottom: 5px;\n color: var(--md-sys-color-on-background);\n }\n\n footer a {\n color: var(--md-sys-color-primary);\n text-decoration: none;\n font-weight: bold;\n }\n `\n ]\n\n @property({ type: String }) userId?: string\n @property({ type: String }) email?: string\n @property({ type: String }) name?: string\n\n @state() languages: { code: string; display: string }[] = []\n\n @query('#name') nameEl!: HTMLInputElement\n @query('#locale') localeEl!: HTMLInputElement\n\n async firstUpdated() {\n auth.on('profile', ({ credential }) => {\n this.setCredential(credential)\n })\n\n this.setCredential(auth.credential)\n\n this.languages = await getLanguages()\n }\n\n setCredential(credential) {\n if (credential) {\n this.userId = credential.id\n this.name = credential.name\n this.email = credential.email\n } else {\n this.userId = ''\n this.name = ''\n this.email = ''\n }\n }\n\n render() {\n return html`\n <div class=\"wrap\">\n <div class=\"user\">${this.email || ''}</div>\n\n <label for=\"name\"><ox-i18n slot=\"title\" msgid=\"label.name\"></ox-i18n></label>\n <input id=\"name\" @change=${e => this.onNameChanged(e.target.value)} .value=${this.name || ''} />\n\n <hr />\n\n <label for=\"locale\"><ox-i18n slot=\"title\" msgid=\"label.language\"></ox-i18n></label>\n <ox-i18n-selector\n id=\"locale\"\n @change=${e => this.onLocaleChanged(e.detail)}\n value=${i18next.language || 'en-US'}\n .languages=${this.languages}\n ></ox-i18n-selector>\n\n <hr />\n\n <label for=\"change-password\">\n <ox-i18n msgid=\"label.password\"></ox-i18n>\n </label>\n\n <change-password id=\"change-password\"></change-password>\n\n ${isAvailableWebauthn\n ? html`\n <md-text-button @click=${() => this.registerUser()}\n >${i18next.t('button.security-key registration')}</md-text-button\n >\n `\n : nothing}\n\n <footer>\n <p>\n ${i18next.t('text.click login history')}\n <a href=\"javascript:void(0);\" @click=${this.openLoginHistory.bind(this)}\n >${i18next.t('label.login_history')}</a\n >\n </p>\n </footer>\n </div>\n `\n }\n\n async onNameChanged(name) {\n if (!name) return\n\n var oldName = this.name\n\n try {\n const message = await auth.updateProfile({\n name\n })\n\n notify({\n level: 'info',\n message\n })\n } catch (e: any) {\n this.nameEl.value = oldName || ''\n\n notify({\n level: 'error',\n message: 'message' in e ? e.message : e\n })\n }\n }\n\n async onLocaleChanged(value) {\n if (!value) return\n\n var oldLocale = i18next.language\n\n try {\n const message = await auth.updateProfile({\n locale: value\n })\n\n i18next.changeLanguage(value)\n\n notify({\n level: 'info',\n message\n })\n } catch (e: any) {\n this.localeEl.value = oldLocale\n\n notify({\n level: 'error',\n message: 'message' in e ? e.message : e\n })\n }\n }\n\n openLoginHistory() {\n openPopup(html` <my-login-history></my-login-history> `, {\n title: i18next.t('label.login_history')\n })\n }\n\n deleteUser() {\n openPopup(html` <delete-user-popup></delete-user-popup> `, {\n title: i18next.t('label.delete account')\n })\n }\n\n async registerUser() {\n try {\n const options = await fetch('/auth/register-webauthn/challenge').then(res => res.json())\n const attResp = await startRegistration(options)\n const verification = await fetch('/auth/verify-registration', {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json'\n },\n body: JSON.stringify(attResp)\n }).then(res => res.json())\n\n if (verification.verified) {\n notify({\n level: 'info',\n message: i18next.t('text.user credential registered successfully')\n })\n } else {\n console.error(await verification.text())\n\n notify({\n level: 'error',\n message: i18next.t('error.user credential registeration not allowed')\n })\n }\n } catch (error) {\n notify({\n level: 'error',\n message: i18next.t('error.user credential registeration failed')\n })\n }\n }\n\n get applicationMeta() {\n var iconLink: HTMLLinkElement | null = document.querySelector('link[rel=\"application-icon\"]')\n var titleMeta: HTMLMetaElement | null = document.querySelector('meta[name=\"application-name\"]')\n var descriptionMeta: HTMLMetaElement | null = document.querySelector('meta[name=\"application-description\"]')\n\n return {\n icon: iconLink?.href || '',\n title: titleMeta?.content || 'Things Factory',\n description: descriptionMeta?.content || 'Reimagining Software'\n }\n }\n}\n"]}
|