---
schema_version: "1"
id: fb5a8a31922adbd9960c19917ea73b306a17edf485472c8172968e0afe4919ea
title: 외부 사이트에서 Lightning Out
collection: architect
version: next
locale: ko-kr
portal_url: https://docs.salesforce.com/architect/next/ko-kr/reference-diagrams/guides/lightning-out-on-external-sites.md
canonical_url: https://staging.architect.salesforce.com/docs/architect/ko-kr/reference-diagrams/guide/lightning-out-on-external-sites.html
source_site: staging.architect.salesforce.com
content_type: documentation
content_hash: d59b8892a17957badff3428a8dfac4f6f7225f410662057121b35781395feb20
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 앱을 구성하려면 원본 서버의 페이지에 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)