Lightning Aura Components Developer Guide (Lightning Aura コンポーネント開発者ガイド)
j未認証ユーザとの Lightning Out アプリケーションの共有
Lightning Out 連動関係アプリケーションに ltng:allowGuestAccess インターフェースを追加すると、ユーザは Salesforce の認証を行わずにそのアプリケーションにアクセスできます。このインターフェースでは、Aura コンポーネントを含むアプリケーションを作成してあらゆる場所およびあらゆるユーザにリリースできます。ユーザを Lightning Out エンドポイントで認証する場合は、セッションを $Lightning.use() で設定する必要があります。
ltng:allowGuestAccess インターフェースを持つ Lightning Out 連動関係アプリケーションは、Visualforce の Lightning コンポーネントおよび Lightning Out で使用できます。
- Visualforce の Lightning コンポーネントを使用すると、Lightning アプリケーションを Visualforce ページに追加してから、そのページを Salesforce タブ と Visualforce コミュニティで使用できます。その後、そのページへの公開アクセスを許可できます。
- Lightning Out を使用すると、Lightning Out がサポートされているすべての場所、つまり、ほぼすべての場所に Lightning アプリケーションをリリースできます。
ltng:allowGuestAccess インターフェースは、コミュニティが有効な組織でのみ使用可能で、Lightning Out アプリケーションは組織で定義したすべてのコミュニティエンドポイントに関連付けられています。
Lightning Out Visualforce の Lightning コンポーネント
使用方法
まず、ltng:allowGuestAccess インターフェースを Lightning Out 連動関係アプリケーションに追加します。次に例を示します。
1<aura:application access="GLOBAL" extends="ltng:outApp"
2 implements="ltng:allowGuestAccess">
3
4 <aura:dependency resource="c:storeLocatorMain"/>
5
6</aura:application>次に、Lightning Out JavaScript ライブラリをページに追加します。
- Visualforce の Lightning コンポーネントでは、<apex:includeLightning /> タグをページの任意の場所に追加するだけです。
- Lightning Out では、コミュニティのエンドポイント URL を使用して、ライブラリを直接参照する <script> タグを追加します。次に例を示します。
1<script src="https://yourCommunityDomain/communityURL/lightning/lightning.out.js"></script>例: https://universalcontainers.force.com/ourstores/lightning/lightning.out.js
最後に、Lightning アプリケーションを読み込んで有効化する JavaScript コードを追加します。このコードは標準の Lightning Out であり、エンドポイントに組織のいずれかのコミュニティ URL を使用する必要がある重要な追加が含まれています。エンドポイント URL は、https://yourCommunityDomain/communityURL/ の形式を取ります。次のサンプルでは、関連する行が強調表示されています。
1<script>
2 $Lightning.use("c:locatorApp", // name of the Lightning app
3 function() { // Callback once framework and app loaded
4 $Lightning.createComponent(
5 "c:storeLocatorMain", // top-level component of your app
6 { }, // attributes to set on the component when created
7 "lightningLocator", // the DOM location to insert the component
8 function(cmp) {
9 // callback when component is created and active on the page
10 }
11 );
12 },
13 'https://universalcontainers.force.com/ourstores/' // Community endpoint
14 );
15</script>