Channel Sites and Routes

In the previous lab exercise, you inspected the Channel Site that was automatically created for your headless channel. Let’s take a closer look at the purpose of Channel Sites, as well as another critical concept for headless storefronts: Site Routes.

Channel Sites

A Channel Site associates a channel with specific information about the storefront’s URLs. There are three important URLs included in a Channel Site:

• primary - The primary URL is the “real” URL of the storefront. For a headless storefront, this is the domain of your own front-end application, outside of any BigCommerce-controlled DNS. Registering this with the Channel Site means BigCommerce “knows” where the actual storefront is found. The most critical are where this is important is for BigCommerce-generated links: In order confirmation emails, for example, or in any context where pages are served from the BigCommerce storefront (such as when using Redirected Checkout).
• canonical - The canonical URL is a permanent URL that will always resolve to the channel regardless of the primary domain, in a consistent format: https://store-{store-hash}-{channel-ID}.mybigcommerce.com. This is the most likely URL you will use for interacting with the GraphQL Storefront API, since the storefront’s primary URL does not resolve to BigCommerce.
• checkout - The checkout URL is particularly important when using Redirected Checkout, allowing BigCommerce to generate checkout redirect URLs on a domain different than the main storefront. This URL can also serve broader use cases, however, for any public URLs that should resolve to a BigCommerce storefront instead of your own front-end application.

Channel Sites can be managed via the Channels API. A Channel Site with a canonical URL should be created automatically when a channel is first created.

Site Routes

Site Routes define the URL path, or pattern, that BigCommerce should use to generate links to the storefront.

By default, BigCommerce will use the conventions of the default, hosted storefront when generating URLs of certain types. For example, a generated login link will be /login.php, and a generated cart link will be /cart.php.

Use Site Routes to override these conventions and inform BigCommerce of the URL paths and patterns on your own headless storefront. This will ensure proper navigation in any part of the shopping experience where BigCommerce has generated links - for example, on the checkout or order confirmation page when using Redirected Checkout, or in BigCommerce-generated order confirmation emails.

Site Routes can be managed via the Sites API.

Resources

• Channel Sites
• Site Routes