diff --git a/README.md b/README.md index 676c839..443c36b 100644 --- a/README.md +++ b/README.md @@ -156,25 +156,37 @@ This package includes a simple but convenient script to handle WebAuthn Attestat php artisan vendor:publish --provider="Laragear\WebAuthn\WebAuthnServiceProvider" --tag="js" ``` -You will receive the `resources/js/vendor/webauthn/webauthn.js` file which you can include into your authentication views and use it programmatically, anyway you want. For example, [compiling it through Vite](https://laravel.com/docs/9.x/vite#loading-your-scripts-and-styles) into your application global JavaScript. +You will receive the `resources/js/vendor/webauthn/webauthn.js` file which you can include into your authentication views and use it programmatically ```html {{-- ... --}} - - @vite(['resources/js/app.js', 'resources/js/vendor/webauthn/webauthn.js']) + + + + @vite(['resources/js/app.js']) ``` -Once done, you can easily start registering and login in users. For example, for a logged-in user, you may show a registration view in HTML with the following code: +> **Note** +> +> You can also edit the script file to transform it into a module so it can be bundled in your Vite frontend, exporting the class as `export default class WebAuthn { ... }`, and add it to the `@vite` assets. +> +> ```html +> @vite(['resources/js/vendor/webauthn/webauthn.js', 'resources/js/app.js']) +> ``` + +Once done, you can easily start registering an user device, and login in users that registered a device previusly. + +For example, let's imagine an user logs in normally, and enters its profile view. You may show a WebAuthn registration HTML with the following code: ```html