Include the otpauth url when retrieving the QR svg

[JanMisker]

This small change adds the otpauth:// url to the json output when retrieving the QR code svg image.

On some devices, notably iOS 15 and macOS Monterey, it is possible to add the 2 step verification code directly in the system keychain. This allows for autofilling the verification code, so no need for switch to another app. Note that the input for the verification code has to be marked with autocomplete="one-time-token".

However, this nice feature is difficult if not impossible to use when only showing the QR code image, because the camera can not see it's own screen if you know what I mean 👀.
Adding the url makes it possible to show a button 'Add on this device', that simply is a link to the otpauth url. Clicking it will open the system dialog to confirm and add it to a specific account. I tested on both iOS and macOS and it works.

See also the Apple documentation, the mention an apple specific prefix, but it works also without the prefix.

[jradtilbrook]

I was just coming here for a similar reason as I use the bitwarden browser extension which expects the secret key text because it doesn't support scanning a QR from the browser. The bitwarden iOS app does but I'd like to save a few steps and make it easier to do straight from the browser.

The browser extension could probably be improved to support this - no question there. But other services also display this code in case you can't scan the code.

So @JanMisker even displaying the secret at creation time along with a button would be really handy to me. I can follow up with something like that though if desirable.

Update: I found an existing issue that applies more to myself with the default livewire/inertia UIs laravel/jetstream#74 (comment)