Merge pull request #27537 from nextcloud/fix/noid/webauthn-localhost

Allow WebAuthn on localhost as well
nextcloud · Jun 17, 2021 · 18ff261 · 18ff261
2 parents ae331de + 86080e6
commit 18ff261
Show file tree

Hide file tree

Showing 10 changed files with 37 additions and 15 deletions.
diff --git a/apps/settings/js/vue-settings-personal-webauthn.js b/apps/settings/js/vue-settings-personal-webauthn.js
diff --git a/apps/settings/js/vue-settings-personal-webauthn.js.map b/apps/settings/js/vue-settings-personal-webauthn.js.map
diff --git a/apps/settings/src/components/WebAuthn/AddDevice.vue b/apps/settings/src/components/WebAuthn/AddDevice.vue
@@ -20,7 +20,7 @@
   -->
 
 <template>
-	<div v-if="!isHttps">
+	<div v-if="!isHttps && !isLocalhost">
 		{{ t('settings', 'Passwordless authentication requires a secure connection.') }}
 	</div>
 	<div v-else>
@@ -89,6 +89,10 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		isLocalhost: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	data() {
 		return {

diff --git a/apps/settings/src/components/WebAuthn/Section.vue b/apps/settings/src/components/WebAuthn/Section.vue
@@ -40,7 +40,10 @@
 			{{ t('settings', 'Your browser does not support WebAuthn.') }}
 		</p>
 
-		<AddDevice v-if="hasPublicKeyCredential" :is-https="isHttps" @added="deviceAdded" />
+		<AddDevice v-if="hasPublicKeyCredential"
+			:is-https="isHttps"
+			:is-localhost="isLocalhost"
+			@added="deviceAdded" />
 	</div>
 </template>
 
@@ -69,6 +72,10 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		isLocalhost: {
+			type: Boolean,
+			default: false,
+		},
 		hasPublicKeyCredential: {
 			type: Boolean,
 			default: false,

diff --git a/apps/settings/src/main-personal-webauth.js b/apps/settings/src/main-personal-webauth.js
@@ -36,6 +36,7 @@ new View({
 	propsData: {
 		initialDevices: devices,
 		isHttps: window.location.protocol === 'https:',
+		isLocalhost: window.location.hostname === 'localhost',
 		hasPublicKeyCredential: typeof (window.PublicKeyCredential) !== 'undefined',
 	},
 }).$mount('#security-webauthn')
diff --git a/core/js/dist/login.js b/core/js/dist/login.js
diff --git a/core/js/dist/login.js.map b/core/js/dist/login.js.map
diff --git a/core/src/components/login/PasswordLessLoginForm.vue b/core/src/components/login/PasswordLessLoginForm.vue
@@ -1,5 +1,5 @@
 <template>
-	<form v-if="isHttps && hasPublicKeyCredential"
+	<form v-if="(isHttps || isLocalhost) && hasPublicKeyCredential"
 		ref="loginForm"
 		method="post"
 		name="login"
@@ -32,7 +32,7 @@
 	<div v-else-if="!hasPublicKeyCredential">
 		{{ t('core', 'Passwordless authentication is not supported in your browser.') }}
 	</div>
-	<div v-else-if="!isHttps">
+	<div v-else-if="!isHttps && !isLocalhost">
 		{{ t('core', 'Passwordless authentication is only available over a secure connection.') }}
 	</div>
 </template>
@@ -73,6 +73,10 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		isLocalhost: {
+			type: Boolean,
+			default: false,
+		},
 		hasPublicKeyCredential: {
 			type: Boolean,
 			default: false,

diff --git a/core/src/login.js b/core/src/login.js
@@ -71,6 +71,7 @@ new View({
 		hasPasswordless: fromStateOr('webauthn-available', false),
 		countAlternativeLogins: fromStateOr('countAlternativeLogins', false),
 		isHttps: window.location.protocol === 'https:',
+		isLocalhost: window.location.hostname === 'localhost',
 		hasPublicKeyCredential: typeof (window.PublicKeyCredential) !== 'undefined',
 		hideLoginForm: fromStateOr('hideLoginForm', false),
 	},

diff --git a/core/src/views/Login.vue b/core/src/views/Login.vue
@@ -73,6 +73,7 @@
 					:inverted-colors="invertedColors"
 					:auto-complete-allowed="autoCompleteAllowed"
 					:is-https="isHttps"
+					:is-localhost="isLocalhost"
 					:has-public-key-credential="hasPublicKeyCredential"
 					@submit="loading = true" />
 				<a href="#" @click.prevent="passwordlessLogin = false">
@@ -176,6 +177,10 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		isLocalhost: {
+			type: Boolean,
+			default: false,
+		},
 		hasPublicKeyCredential: {
 			type: Boolean,
 			default: false,