Site icon UnofficialSF

From Faith Kindle, Mrityunjoy Chowdhury & Sunil Nandipati: Accessing Inbound Guest Appointment Scheduler Flow from External Websites by Un-authenticated users

Akshay

Context & Preface

Businesses and Organizations which provide services have to provide a way for their customers to request appointments with the provider’s service resources. These experiences are expected to be easy to access without any kind of account creation and no authentication involved. Examples can be booking an appointment with a hair stylist at your favorite Salon, looking up for a dentist for a regular cleaning, reaching out to a financial advisor at a bank near your home.

To implement un-authenticated user experiences, the best way in Salesforce is to use the Guest user profile that comes with any Experience Sites (Earlier Communities). Experience sites can be built with public pages where end-users can access the application built using these guest user access. Refer this knowledge article for more information around Guest users – https://help.salesforce.com/s/articleView?id=000327969&type=1

From a high level, there are three design options to allow un-authenticated Guest users to access Scheduler features and functionality. These design patterns are as follows and illustrated below.

  1. API level: this pattern offers the most flexibility but requires the most investment in time as everything is custom built. You will host and build your interface entirely on your (external to Salesforce) web site, and create a fully custom-developed user interface with custom code to accesses Scheduler on the back end via Scheduler REST APIs.
    If you are wondering about how all of this works in the context an UNAUTHENTICATED (or guest) user experience — that’s a great question! The Scheduler API can be accessed from an unauthenticated type perspective using the oAuth SAML bearer assertion flow, which uses connected app to request/grant an access token for that “guest user” (unauthenticated) type experience. You will use a connected app associated with a particular profile to grant that profile permissions to access what is needed. This is similar to the way Salesforce Experience Cloud Guest User leverages the Guest User Profile & Guest User to allow unauthenticated type access to Salesforce objects and the Scheduler Inbound flow.
  2. Component Level: this is the option that we will be going over in this blog. Using this pattern you will leverage Salesforce Experience Cloud/ public sites along with out-of-the-box or custom cloned versions of pre-built Scheduler flows. Scheduler flows are flexible and can be customized in a number of ways, including extending to the Scheduler APIs from within the flow. With this design pattern you will access Scheduler flows from your (external to Salesforce) business web site and remain on your web site’s URL.
  3. Page Level: this level of access offers a relatively quick time to market and can be achieved in a number of ways”:
    • Leveraging the end to end Salesforce footprint, offering Scheduler capability as part of an Experience Cloud community.
    • Hosting your Scheduler flow on a public-facing Salesforce Site, and pointing to that site from your site’s menu. You can register a customized domain within Salesforce to use with your site to make the user flow as seamless and branded as possible.

Most business prefer NOT to have too many websites / links and prefer to have everything hosted on their business websites. In such scenarios the appointment scheduling experience needs to be embedded into the business’s website. To implement such user experiences, components build in Salesforce application need to be used outside Salesforce. Salesforce offers a mechanism called LightningOut to provide such experiences.

Configuration steps to be executed

  1. First and foremost thing is to have a Guest user Profile. Create a Digital Experience Site and make the Site available for public access. This can be enabled by navigating to the Site → Builder settings → General and Turning this feature ON.
  1. Navigating to the ‘Guest User Profile’ by clicking on the Profile link and exploring the Object settings, you will notice that the System ONLY allows users to either CREATE or READ on most of the objects. Configure this ‘Guest User Profile’ as mentioned in the help article – https://help.salesforce.com/s/articleView?id=sf.ls_set_up_guest_users.htm&type=5
  2. Create a Flow using the ‘Scheduler Scheduler Flow Template – Inbound New Guest Appointment’. Customize the flow as per your needs or use the template as is. OOTB template will create a lead and assign the service appointment against the lead.
  1. Most of all, for everything to work perfectly, configuring the Scheduler application using the guided setup. Navigate to the hamburger icon to see all applications, look for ‘Salesforce Scheduler Setup Assistant’ and complete the configuration steps

Understanding the Setup

The appointment time slots are determined based on your Org Setup followed by Salesforce Scheduler configurations and data setup. Ensure you have validated all these and setup configurations and data correctly

  1. Organization Setup-
  1. Scheduler Application Setup – Ensure you have setup data for these objects
  1. Guest User Setup
  1. Optionally, configure field level security for the Asset field on the Service Resource object

External Website – Guest User Flow

As mentioned in the preface, to expose lightning components out of Salesforce, we will explore the LightningOut feature. External websites can be your business websites, and adding an experience for customers to request and schedule appointments we need to add a Lightning component to the external website.

Steps involved here

  1. Generate web-based html code that will include the details of the Experience site and the LightningOut component which launches the Guest user Flow. Here is a sample code and refer the demo video to know what changes to make to this sample code so that it works for you.
    1. <head></head>
      <body>
      <script src=”https://sandbox-234ss-cs1.cs1.stmfa.stm.force.com/lightning/lightning.out.js&#8221;></script>
      <script>
      $Lightning.use(“runtime_appointmentbooking:lightningOutGuest”, // name of the Lightning app
      function() {
      $Lightning.createComponent(
      “lightning:flow”, // top-level component of your app
      { }, // attributes to set on the component when created
      “lightningLocator”, // the DOM location to insert the component
      function(cmp) {
      console.log(‘Hi from callback’);// callback when component is created and active on the page
      cmp.startFlow(‘runtime_appointmentbooking__Guest_Flow‘);
      }
      );
      }, ‘https://sandbox-234ss-cs1.cs1.stmfa.stm.force.com&#8217; // Community endpoint
      );
      </script>

      <div id=”lightningLocator”>
      <p>Lightning Component mentioned in the Script is invoked from here</p>
      </div>
      </body>
  2. Work with your company’s external website administrators to embed the above component into your company’s external website where you plan to have it.
  3. Get the details of the page like URL where this is hosted, this will be required to let the external traffic into salesforce in the next step
  4. Setup CORS
    1. Typically this to whitelist the Origin URLs, so that Salesforce can allow these web browsers to communicate with Salesforce

Case Study

Demo Video – https://salesforce.vidyard.com/watch/bXDpEJUm5tDWeYxFNVh7sJ
Demo Video on W3Schools – https://partners.salesforce.com/0684V00000FsyJF

Exit mobile version
Skip to toolbar