commit 85218ab024f03b68e077c4a5076ce2a2250b50c3 Author: Fabio Date: Thu Nov 27 01:23:00 2025 +0100 first commit diff --git a/README.md b/README.md new file mode 100644 index 0000000..dd7585b --- /dev/null +++ b/README.md @@ -0,0 +1,39 @@ +# Client Webauthn con vite +```sh +npm create vite@latest webauthn-clien +``` +scegliere + +vanilla js no yes + +entrare nellaa cartella salvare con altro nome i file index.html src/main.js + +ed inserire quelli nuovi compreso vite.config.js con quelli del git +```sh +cd webauthn-client +mv index.html index.html.old +mv src/main.js src/main.js.old + +nano index.html +nano src/main.js +nano vite.config.json +``` + +in vite.config.js ci sono host e porta + +installare +```sh +npm install @simplewebauthn/browser +``` + +poi lanciare in modalità sviluppo + + npm run dev + +oppure costruirlo + + npm run build + +e poi avviarlo + + npm run preview diff --git a/index.html b/index.html new file mode 100644 index 0000000..a289bc3 --- /dev/null +++ b/index.html @@ -0,0 +1,18 @@ + + + + + WebAuthn Client + + +

Demo WebAuthn

+ + Username: + + + + + + + + diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..e4c8389 --- /dev/null +++ b/src/main.js @@ -0,0 +1,73 @@ +import { startRegistration, startAuthentication } from '@simplewebauthn/browser'; +/*import { + startRegistration, + startAuthentication +} from 'https://cdn.jsdelivr.net/npm/@simplewebauthn/browser/+esm'; +*/ +const API_BASE = 'https://auth.patachina.it'; + +function getUsername() { + return document.getElementById('username').value.trim(); +} + +async function registerUser() { + try { + const username = getUsername(); + + const resp = await fetch(`${API_BASE}/my/register-options`, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ username }), + credentials: 'include', + }); + const options = await resp.json(); + if (!resp.ok) throw new Error(options.message || 'Errore sconosciuto'); + + const attResp = await startRegistration(options); + + const payload = { username, attestationResponse: attResp }; + const verif = await fetch(`${API_BASE}/my/register-verify`, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(payload), + credentials: 'include', + }); + const verification = await verif.json(); + alert(`Registrazione: ${verification.success ? 'OK' : 'Fallita'}`); + } catch (err) { + console.error(err); + alert(`Errore nella registrazione: ${err.message}`); + } +} + +async function loginUser() { + try { + const username = getUsername(); + + const resp = await fetch(`${API_BASE}/my/login-options`, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ username }), + credentials: 'include', + }); + const options = await resp.json(); + if (!resp.ok) throw new Error(options.message || 'Errore sconosciuto'); + + const authResp = await startAuthentication(options); + + const verif = await fetch(`${API_BASE}/my/login-verify`, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ username, assertionResponse: authResp }), + credentials: 'include', + }); + const verification = await verif.json(); + alert(`Login: ${verification.success ? 'OK' : 'Fallito'}`); + } catch (err) { + console.error(err); + alert(`Login fallito: ${err.message}`); + } +} + +document.getElementById('registerBtn').addEventListener('click', registerUser); +document.getElementById('loginBtn').addEventListener('click', loginUser); diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..e1cd10e --- /dev/null +++ b/vite.config.js @@ -0,0 +1,25 @@ +import { defineConfig } from 'vite'; + +export default defineConfig({ + server: { + host: '192.168.1.3', // ascolta su tutte le interfacce (LAN, localhost) + port: 3000, + strictPort: true, + allowedHosts: [ + 'my.patachina2.casacam.net' // autorizza questo host + ], + proxy: { + // tutte le chiamate a /my/... vengono inoltrate al backend remoto + '/my': { + target: 'https://auth.patachina.it', + changeOrigin: true, + secure: true + } + } + }, + preview: { + host: '192.168.1.3', // oppure '192.168.1.3' + port: 3000, + strictPort: true + } +});