---
schema_version: "1"
id: 2c4d32343fda6c88f7117f442ec08695d41631aa16f3a402ea2b76e56f9ad75d
title: 外部站点上的 Lightning Out
collection: architect
version: next
locale: zh-cn
portal_url: https://docs.salesforce.com/architect/next/zh-cn/reference-diagrams/guides/lightning-out-on-external-sites.md
canonical_url: https://staging.architect.salesforce.com/docs/architect/zh-cn/reference-diagrams/guide/lightning-out-on-external-sites.html
source_site: staging.architect.salesforce.com
content_type: documentation
content_hash: 4ec3a78dfb2b953faf1455fcc306100aec4b0735b6bcc0b567b922231469c10b
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 Out - 这是《建筑表单决策指南》中的示例解决方案架构，显示了如何通过 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)