Choice of passkey or password for authentication

[JulienSansot]

Hi,
I've been following the passkey integration youtube video and it was super useful. Thanks for this project and that video.
When my users are clicking the link in the "Verify Account" email, they are now prompted to setup a WebAuthn authentication method.
I would like them to have the option to setup a password instead. So they can either use a password to login, or a passkey.
Would you have some advice on how to set that up?

[janko]

You could try always rendering the same verify account view, and require different things depending on a query param. I haven't tested this, but something like:

verify_account_view do
  view("verify-account", verify_account_page_title)
end

verify_account_set_password? { param("factor") == "password" }

<!-- app/views/rodauth/verify_account.html.erb -->
<% case params[:factor] %>
<% when "password" %>
  <%= form_with url: rodauth.verify_account_path, method: :post do |form| %>
    <%= form.password_field rodauth.password_param, ... %>
    <%= form.password_field rodauth.password_confirm_param, ... %>
    <%= form.submit "Set Password" %>
  <% end %>
<% when "webauthn" %>
  <%= rodauth.render("webauthn-setup") %> <!-- render WebAuthn setup form -->
<% else %>
  <%= link_to "Set Password", rodauth.verify_account_path(factor: "password") %>
  <%= link_to "Create Passkey", rodauth.verify_account_path(factor: "webauthn") %>
<% end %>

The verify account token should still be valid here, because it's stored into the session on initial page load (taken from the query param in the email link).

[JulienSansot]

Thanks @janko,
I ended up defining a new Rodauth feature similar to the webauthn_verify_account one. With your suggestions and a few extra changes:

Rodauth::Feature.define(:webauthn_or_password_verify_account, :WebauthnOrPasswordVerifyAccount) do
  depends :verify_account, :webauthn

  #
  # This rodauth feature is copied from the 'webauthn_verify_account' feature
  # https://github.com/jeremyevans/rodauth/blob/master/lib/rodauth/features/webauthn_verify_account.rb
  #
  # And slightly tweaked so it allows using password instead of webauthn
  #

  def verify_account_view
    view("verify-account", verify_account_page_title)
  end

  def create_account_set_password?
    false
  end

  def uses_two_factor_authentication?
    false
  end

  def verify_account_set_password?
    param("factor") == "password"
  end

  def autologin_session(autologin_type)
    super

    return if request.params.key?("password")

    return unless autologin_type == "verify_account"

    set_session_value(authenticated_by_session_key, ["webauthn"])
    remove_session_value(autologin_type_session_key)
    webauthn_update_session(@webauthn_credential.id)
  end

  private

  def before_verify_account
    super

    return if request.params.key?("password")

    if features.include?(:json) && use_json? && !param_or_nil(webauthn_setup_param)
      cred = new_webauthn_credential
      json_response[webauthn_setup_param] = cred.as_json
      json_response[webauthn_setup_challenge_param] = cred.challenge
      json_response[webauthn_setup_challenge_hmac_param] = compute_hmac(cred.challenge)
    end
    @webauthn_credential = webauthn_setup_credential_from_form_submission
    add_webauthn_credential(@webauthn_credential)
  end

  def webauthn_account_id
    super || account_id
  end
end

In the view, I did what you suggested but I also added a hidden field in the password form so it still shows the password form if there is some validation error:

<%= form_with url: rodauth.verify_account_path, method: :post do |form| %>
  ...
  <%= form.hidden_field "factor", value: "password" %>
  ...
<% end %>