---
schema_version: "1"
id: 95b7fedfeaa610a0fc496c64e4f8fa6ad321c51288020c3a9ab4bbb527759710
title: 外部網站上的 Lightning Out
collection: architect
version: next
locale: zh-tw
portal_url: https://docs.salesforce.com/architect/next/zh-tw/reference-diagrams/guides/lightning-out-on-external-sites.md
canonical_url: https://staging.architect.salesforce.com/docs/architect/zh-tw/reference-diagrams/guide/lightning-out-on-external-sites.html
source_site: staging.architect.salesforce.com
content_type: documentation
content_hash: 00c03502cf0325d540ac785b9a780a6c038fea31f9fe7efa389e69812226133e
products:
  - 參考圖表
  - Architect Site Content Repo
---
# 外部網站上的 Lightning Out

<img style="border:1px solid #e5e5e5;margin:2rem 0rem" src="https://architect.salesforce.com/ns-assets/reference-architectures/lightning-out-on-external-sites.webp" alt="外部網站上的 Lightning - 此為「建置表單決策指南」中的範例解決方案結構,顯示如何透過 Lightning Out 將 LWC 元件內嵌在外部網站內。若要設定 Lightning Out 應用程式,請在來源伺服器的頁面中包含 Lightning Out JavaScript 程式庫。然後新增標記以載入您的 Lightning Out 應用程式及其元件。您的 Lightning Out 應用程式會透過安全連線初始化,並插入頁面的 DOM。">

## 描述

這是「建立表單決策指南」中的範例解決方案結構,顯示如何透過 Lightning Out 將 LWC 元件內嵌在外部網站內。若要設定 Lightning Out 應用程式,請在原始伺服器的頁面中包含 Lightning Out JavaScript 程式庫。然後新增可載入 Lightning Out 應用程式及其元件的標記。您的 Lightning Out 應用程式會透過安全連線初始化,並插入頁面的 DOM。

## 可下載連結:

- [透明](https://lucid.app/lucidchart/editNew/ecd1a401-ee27-4f75-86f5-d5a1cabb1a4d)
- [影像](https://architect.salesforce.com/ns-assets/legacy/location.png)