Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-27 12:36:14 +01:00
Code Issues Projects Releases Wiki Activity

Mobile WebAuthn connector updates (#1236)

Browse Source 
* support for returning to app via button press and updated mobile connector UI

* added client-driven header text and fixed lint issues
This commit is contained in:
Matt Portune 2021-10-14 11:53:34 -04:00 committed by GitHub
parent db9ab9f51e
commit df9733081b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 30 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/connectors/webauthn-mobile.html
View File

@ -6,13 +6,19 @@
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="HandheldFriendly" content="true"> <meta name="HandheldFriendly" content="true">
<title>Bitwarden Mobile WebAuthn Connector</title> <title>Bitwarden WebAuthn Connector</title>
</head> </head>
<body style="background: transparent;"> <body style="background: transparent;">
<img src="../images/u2fkey.jpg" class="rounded img-fluid mb-3"> <div class="row justify-content-md-center mt-5">
<div class="text-center"> <div>
<button id="webauthn-button" class="btn btn-primary"></button> <img src="../images/logo-dark@2x.png" class="logo mb-2" alt="Bitwarden">
<p id="webauthn-header" class="lead text-center mx-4 mb-4"></p>
<img src="../images/u2fkey-mobile.jpg" class="rounded img-fluid">
<div class="text-center mt-4">
<button id="webauthn-button" class="btn btn-primary btn-lg"></button>
</div>
</div>
</div> </div>
</body> </body>

21
src/connectors/webauthn.ts
View File

@ -6,7 +6,9 @@ require('./webauthn.scss');
let parsed = false; let parsed = false;
let webauthnJson: any; let webauthnJson: any;
let headerText: string = null;
let btnText: string = null; let btnText: string = null;
let btnReturnText: string = null;
let parentUrl: string = null; let parentUrl: string = null;
let parentOrigin: string = null; let parentOrigin: string = null;
let callbackUri: string = null; let callbackUri: string = null;
@ -18,6 +20,10 @@ document.addEventListener('DOMContentLoaded', () => {
init(); init();
parseParameters(); parseParameters();
if (headerText) {
const header = document.getElementById('webauthn-header');
header.innerText = decodeURI(headerText);
}
if (btnText) { if (btnText) {
const button = document.getElementById('webauthn-button'); const button = document.getElementById('webauthn-button');
button.innerText = decodeURI(btnText); button.innerText = decodeURI(btnText);
@ -63,11 +69,13 @@ function parseParametersV1() {
} }
webauthnJson = b64Decode(data); webauthnJson = b64Decode(data);
headerText = getQsParam('headerText');
btnText = getQsParam('btnText'); btnText = getQsParam('btnText');
btnReturnText = getQsParam('btnReturnText');
} }
function parseParametersV2() { function parseParametersV2() {
let dataObj: { data: any, btnText: string; callbackUri?: string } = null; let dataObj: { data: any, headerText: string; btnText: string; btnReturnText: string; callbackUri?: string } = null;
try { try {
dataObj = JSON.parse(b64Decode(getQsParam('data'))); dataObj = JSON.parse(b64Decode(getQsParam('data')));
} }
@ -78,7 +86,9 @@ function parseParametersV2() {
callbackUri = dataObj.callbackUri; callbackUri = dataObj.callbackUri;
webauthnJson = dataObj.data; webauthnJson = dataObj.data;
headerText = dataObj.headerText;
btnText = dataObj.btnText; btnText = dataObj.btnText;
btnReturnText = dataObj.btnReturnText;
} }
function start() { function start() {
@ -140,6 +150,7 @@ function onMessage() {
function error(message: string) { function error(message: string) {
if (callbackUri) { if (callbackUri) {
document.location.replace(callbackUri + '?error=' + encodeURIComponent(message)); document.location.replace(callbackUri + '?error=' + encodeURIComponent(message));
returnButton(callbackUri + '?error=' + encodeURIComponent(message));
} else { } else {
parent.postMessage('error|' + message, parentUrl); parent.postMessage('error|' + message, parentUrl);
} }
@ -154,6 +165,7 @@ function success(assertedCredential: PublicKeyCredential) {
if (callbackUri) { if (callbackUri) {
document.location.replace(callbackUri + '?data=' + encodeURIComponent(dataString)); document.location.replace(callbackUri + '?data=' + encodeURIComponent(dataString));
returnButton(callbackUri + '?data=' + encodeURIComponent(dataString));
} else { } else {
parent.postMessage('success|' + dataString, parentUrl); parent.postMessage('success|' + dataString, parentUrl);
sentSuccess = true; sentSuccess = true;
@ -168,3 +180,10 @@ function info(message: string) {
parent.postMessage('info|' + message, parentUrl); parent.postMessage('info|' + message, parentUrl);
} }
function returnButton(uri: string) {
// provides 'return' button in case scripted navigation is blocked
const button = document.getElementById('webauthn-button');
button.innerText = decodeURI(btnReturnText);
button.onclick = () => { document.location.replace(uri); };
}

BIN
src/images/u2fkey-mobile.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 352 KiB