Authentication in Lightning Out by passing Session Id

Question

In below VF page

<apex:page showHeader="false" sidebar="false" cache="false" standardStylesheets="false">        
  <apex:includeLightning />
    <div id="lightningContainer"/>
    <script>
    $Lightning.use("c:testApp", function() {
            $Lightning.createComponent("c:testLWC", 
            {},
            "lightningContainer",
            function(newCmp, status, errorMessage) {
                if (status === "SUCCESS") {
                    console.log("Component Created Successfully");
                } else {
                    console.log("Component not created | " + errorMessage); 
                }
            }
        );
    },{!endpoint}
    ,{!sessionId});
    </script>
  </apex:page>

I am passing the session Id obtained from OAuth, but problem is that the session id is visible by viewing the page source.

Is there any way by which this can be avoided?

EDIT: This app will be hosted on an external website and session will be of an integration user.

Answer 1

The app will be hosted on an external website. The session will be of an integration user.

There is no way to do this without granting arbitrary users of your website the same rights as the integration user, meaning that they can perform any action and read or modify or destroy any data the integration user can see. A user could successfully take that Session ID to any Salesforce API client and perform queries or arbitrary API operations. If Salesforce Ids are exposed to them and under their control (as URL parameters, for example) they could walk the Id sequence to gain access to data readable to the integration user that you did not intend to expose.

Adequately securing such a user is very hard, which is one reason why the Site Guest User (which plays such a role out of the box) has had its permissions access dramatically curtailed over the past several Salesforce releases.