Exposing Lightning app on force.com sites

Question

I am struggling on how to expose lightning apps in force.com sites

As per one of the answers in this link I should be able to expose lightning apps on force.com sites :

Expose Lightning .app publicly?

I get a 500 error when the site accesses the lightning app. The same app renders fine on the visualforce page. What am I missing here?

Is it even possible to expose a lightning app through a public sites without authentication?

Lightning App:

<aura:application extends="ltng:outApp" implements="ltng:allowGuestAccess" access="GLOBAL">
        <aura:dependency resource="c:caseSearchComponent"/>
</aura:application>

VF Page used in force.com site:

 <apex:page sidebar="false" showheader="false">
<apex:includeLightning />
<div id="lightning" />
<script>

    $Lightning.use("c:Lightningappforsite", function() {
      $Lightning.createComponent("c:caseSearchcomponent",
      "",
      "lightning",
      function(cmp) {
        // do some stuff
      });
    });

</script>
</apex:page>

Output of component inside the VF Page:

Looking further in the console i see invalid session, looks like salesforce is expecting authentication to access the lightning component.

Console shows invalid session when i try to look at the raw request:

while(1); {"defaultHandler":"function(token) {try{$A.clientService.invalidSession(token);}catch(e){window.location.reload(true);}}","event":{"descriptor":"markup://aura:invalidSession","attributes":{"values":{}},"eventDef":{"descriptor":"markup://aura:invalidSession","type":"APPLICATION","xs":"I","superDef":{"descriptor":"markup://aura:applicationEvent"},"attributes":{"newToken":{"name":"newToken","type":"aura://String","xs":"I"}}}},"exceptionEvent":true}

Answer 1

This worked for me I Implemented implements="ltng:allowGuestAccess" in my app, and after adding the dependency resource I called my component.

app

<aura:application access="GLOBAL" extends="ltng:outApp" implements="ltng:allowGuestAccess">
    <aura:dependency resource="c:Validar_Pedido" type="COMPONENT"/>
    <c:Validar_Pedido />
</aura:application>

Answer 2

This may not be the answer for you, as I can't confirm for myself, but I thought it may be helpful to add as an answer.

First the release doc states that:

The ltng:allowGuestAccess interface is only usable in orgs that have Communities enabled, and your Lightning Out app is associated with all community endpoints that you’ve defined in your org.

What is the end point you are using? The release doc also states:

This code is standard Lightning Out, with the important addition that you must use one of your org’s community URLs for the endpoint.

The release doc has this example, the endpoint is at the end of the script:

<script>
    $Lightning.use("c:locatorApp",    // name of the Lightning app
        function() {                  // Callback once framework and app loaded
            $Lightning.createComponent(
                "c:storeLocatorMain", // top-level component of your app
                { },                  // attributes to set on the component when created
                "lightningLocator",   // the DOM location to insert the component
                function(cmp) {
                    // callback when component is created and active on the page
                }
            );
        },
        'https://universalcontainers.force.com/ourstores/'  // Community endpoint
    );
</script>

Answer 3

You should be sure about all objects and pages and classes are added to Site Public Access Settings.

On Setup \ Sites > click label of your site on the list.

Your site page opens, and click "Public Access Settings" button.

Here all permissions should be set. First edit and give permissions for all related objects, and then add your all related classes to Enabled Apex Class Access and add all related VF Pages to Enabled Visualforce Page Access list.

Then your component should work.

Hint: Dont add your component inside apex:form it causes dropdown menus to refresh all pages when click to open.