--- title: Page node description: The Page node lets you combine multiple nodes that request input onto a single page for display to the user. For example, you can use it to create a single login page that requests a username and password. component: auth-node-ref version: latest page_id: auth-node-ref::page canonical_url: https://docs.pingidentity.com/auth-node-ref/latest/page.html keywords: ["Nodes & Trees", "Journeys", "Authentication"] superseded_by: https://docs.pingidentity.com/auth-node-ref/latest/page.html section_ids: example: Example example_1_simple_login_journey: "Example 1: Simple login journey" example_2_login_journey_with_multiple_standalone_nodes: "Example 2: Login journey with multiple standalone nodes" availability: Availability inputs: Inputs dependencies: Dependencies configuration: Configuration outputs: Outputs callbacks: Callbacks outcomes: Outcomes errors: Errors changelog: Changelog --- # Page node The Page node lets you combine multiple nodes that request input onto a single page for display to the user. For example, you can use it to create a single login page that requests a username and password. | | | | - | ------------------------------------------------------------------------- | | | The Page node can only include nodes that use callbacks to request input. | To use it, drag and drop compatible nodes onto the Page node in the journey editor. When designing a journey that includes a Page node, consider the following points: * A Page node must contain at least one node. * Page nodes can’t be nested inside each other. Similarly, you can’t include an [Inner Tree Evaluator node](inner-tree-evaluator.html) in a Page node. * Page nodes are designed to group nodes together that require user input. Non-interactive nodes, such as the [Data Store Decision node](data-store-decision.html) or [Push Sender node](push-sender.html), should be placed outside of Page nodes. * Scripted Decision nodes can be included in Page nodes but only if they handle callbacks. Scripts that use the `Action` class to set outcomes (using the `goTo` method), or set messages (using fields such as `lockoutMessage` or `errorMessage`), aren’t supported within a Page node. * Only the final node can have multiple outcomes. All preceding nodes must have a single outcome path. * AM only *(tooltip: Currently available only in AM 8.1)* **v2.0 Page nodes:** A Page node can contain one or more *standalone* nodes *after* the final multiple outcome node. Standalone nodes are self-contained and are processed separately to the other nodes in the Page node. > **Collapse: Which nodes are standalone nodes?** > > The following nodes are standalone nodes: > > * [Select Identity Provider node](select-identity-provider.html) > > * [WebAuthn Authentication node](webauthn-authentication.html) ## Example ### Example 1: Simple login journey The following example uses a Page node containing a [Platform Username node](platform-username.html), [Platform Password node](platform-password.html), and [Choice Collector node](choice-collector.html): ![Example journey showing Page node use](_images/trees-node-page-example-platform.png) The flow prompts the user for all input on a single page: ![User’s view of an example journey containing a Page node](_images/trees-node-page-example-output-platform.png) ### Example 2: Login journey with multiple standalone nodes AM only *(tooltip: Currently available only in AM 8.1)* The following example journey uses a Page node containing a [Platform Username node](platform-username.html), [Platform Password node](platform-password.html), [Select Identity Provider node](select-identity-provider.html), and a [WebAuthn Authentication node](webauthn-authentication.html): ![Journey with WebAuthn conditional UI and social authentication](_images/webauthn-conditional-ui-example-journey.png) The v2.0 [Page node](page.html) provides the user with different authentication options on the same page. The Page node contains the following nodes: * [Platform Username node](platform-username.html). This node uses the following configuration to provide users with relevant autofill suggestions, including passkeys if they’re available: * Autocomplete Values `username`\ `webauthn` The autocomplete values must be in this order. * [Platform Password node](platform-password.html) * [Select Identity Provider node](select-identity-provider.html). This node is configured to include local authentication. * [WebAuthn Authentication node](webauthn-authentication.html). This node is v2.0 and uses the following configuration to provide the WebAuthn conditional UI and Sign in with passkey button: * Username from device `Enabled` * Mediation `CONDITIONAL` * Authentication Button `Enabled` The standalone nodes must be added after the non-standalone nodes. This Page node configuration presents a Sign in page to the user similar to the following: ![Example Sign in page with passkey and social authentication options](_images/webauthn-conditional-ui-signin-page.png) * If the user chooses Google in this example, the [Social Provider Handler node](social-provider-handler.html) routes the user to Google to authenticate. If authentication is successful, the user follows the `Account exists` path. Otherwise, they can try a different authentication method. * If the user clicks in the User Name field, they are shown any relevant username and passkey autofill suggestions. * If they select a passkey and authenticate successfully, they follow the `Success` path. * If they enter their username and password (local authentication), they follow the `Outcome` path to the [Data Store Decision node](data-store-decision.html). This node validates their credentials and authenticates the user if they’re valid. * If they click the Sign in with passkey button, they can select a saved passkey to authenticate with. If authentication is successful, they follow the `Success` path. ## Availability | Product | Available? | | ------------------------------------- | ---------- | | PingOne Advanced Identity Cloud | Yes | | PingAM (self-managed) | Yes | | Ping Identity Platform (self-managed) | Yes | ## Inputs The inputs are determined by the collective inputs of the contained nodes. ## Dependencies This node has no dependencies. ## Configuration | Property | Usage | Availability | | ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------- | | Page Header | Optional. A localized title for the Page node and the nodes contained within it. Use this when components of an authentication journey need a title. For example, dividing a registration flow into labeled sections. | All node versions | | Page Description | Optional. A localized description for the Page node and the nodes contained within it. Use this when you need additional descriptive text in an authentication journey.You can use HTML code to format the description. | All node versions | | Stage | Optional. A stage name to pass to the client to aid in rendering. You can’t configure a Stage for this node if you configure a Page Footer, Theme or Submit Button Text. These properties overwrite the value of the Stage property. | All node versions | | Submit Button Text | Optional. Use the Key and Value fields to set the text of the Submit button. | All node versions | | Page Footer | Optional. A localized footer for the page node and the nodes contained within it. Use this when you need additional descriptive text in an authentication journey.You can use HTML code to format the description. | All node versions | | Theme | Optional. If using hosted pages, specify a theme to override this journey’s UI theme. | All node versions | | | | | - | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | | | This node’s optional properties are passed in the response, but a self-hosted or custom UI must support these properties to make them visible to the end user. | ## Outputs The outputs are determined by the collective outputs of the contained nodes. ## Callbacks This node doesn’t send any callbacks. ## Outcomes The outcomes depend on whether the Page node contains standalone nodes. Standalone nodes can only be included from v2.0 onwards. * Without standalone nodes The outcomes are determined by the final node in the Page node. - With standalone nodes AM only *(tooltip: Currently available only in AM 8.1)* The available outcomes include the following: * All outcomes from the standalone nodes. * The outcomes determined by the last node prior to the standalone nodes: * If this node has a single outcome path, a single outcome is available. This outcome is typically called `Outcome`. * If this node has multiple outcome paths, they’re all available. ## Errors This node can log the following error messages: | Message | Notes | | --------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------- | | `Failed to collect inputs of contained node: ` | The \ could not retrieve required properties from the shared node state | | `Failed to collect outputs of contained node: ` | The \ could not retrieve required properties to include in the shared node state | | `Could not find the identity based on the information available on context` | Failed to find the account profile with this `username` in this `realm` | | `An error occurred when trying to lock out the user account` | Failed to update the account status; applies when locking and unlocking the account | This node can throw exceptions with the following messages during operation: | Message | Notes | | ------------------------------------------------- | ---------------------------------------------------------------- | | `This page has no nodes in it, so cannot proceed` | A Page node must contain at least one other node | | `No outcome and only metadata callbacks found` | Failed to get to an outcome while processing the contained nodes | | `Node properties cannot be fetched` | Failed to access the properties of a contained node | This node can throw exceptions with the following messages when saving the journey: | Message | Notes | | ------------------------------------------------------------- | ------------------------------------------------------------ | | `Illegal child node type: ` | A Page node can’t contain a \ | | `Node does not have any outcomes: ` | The contained nodes must have at least a single outcome path | | `Only the last node in a page can have more than one outcome` | Consider rearranging the contained nodes | | `Node does not exist: ` | Use the journey editor to fix the problem | | `Could not load child node: ` | Use the journey editor to fix the problem | | `Could not obtain outcomes for node: ` | Use the journey editor to fix the problem | ## Changelog | Version | Changes | | --------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | | []()2.0 AM only *(tooltip: Currently available only in AM 8.1)* | Added support for standalone nodes within a Page node. Standalone nodes are self-contained and can be included *after* the final multiple outcome node. |