View Source WebauthnComponents.TokenComponent (WebauthnComponents v0.3.1)

A LiveComponent for handling session tokens.

TokenComponent manages the client-side session token, allowing the parent LiveView to do the following:

  • Redirect when a user is already signed in.
  • Store a new token upon registration or authentication.
  • Clear a token upon sign-out.

See USAGE.md for example code.

assigns

Assigns

  • @id (Optional) An HTML element ID.
  • @token: A Base64-encoded session token to be stored in the client.

The parent LiveView may use Phoenix.LiveView.send_update/3 to set or clear a token in the client.

clear-a-token

Clear a Token

send_update(TokenComponent, id: "token-component", token: :clear)

store-a-token

Store a Token

send_update(TokenComponent, id: "token-component", token: base64_encoded_token)

events

Events

The following events are handled internally by TokenComponent:

  • "token-exists": Sent by the client when sessionStorage contains a userToken.
  • "token-stored": Sent by the client when a token has been stored in sessionStorage.
  • "token-cleared": Sent by the client when a token has been cleared frmo sessionStorage.
  • "error": Sent by the client when an error occurs.

messages

Messages

  • {:token_exists, token: token}
    • :token is a Base64-encoded token found by the client.
    • The parent LiveView may use this token to authenticate users.
  • {:token_stored, token: token}
    • :token is a Base64-encoded token stored by the client.
    • The parent LiveView may compare the returned token against the token sent to the component to ensure there has been no tampering.
  • {:token_cleared}
    • A token has been cleared from the client.
  • {:error, payload}
    • payload contains the message, name, and stack returned by the browser upon timeout or other client-side errors.

Link to this section Summary

Functions

Callback implementation for Phoenix.LiveComponent.mount/1.

Callback implementation for Phoenix.LiveComponent.render/1.

Stores or clears a session token.

Link to this section Functions

Link to this function

handle_event(event, payload, socket)

View Source

Callback implementation for Phoenix.LiveComponent.handle_event/3.

Callback implementation for Phoenix.LiveComponent.mount/1.

Callback implementation for Phoenix.LiveComponent.render/1.

Stores or clears a session token.

When a :token assign is received, this function will either clear or store the user's token.

  • Assign token: :clear to remove a user's token.
  • Assign a binary token (typically a base64-encoded crypto hash) to persist a user's token to the browser's sessionStorage.
  • Invalid token assigns will be logged and the socket will be returned unchanged.