LWC 컴포넌트 url로 호출하는 방법 - How to call with LWC component url

 

원래 불가능했는데 가능하게 수정되었다!

 

2024 summer

 

https://gsohclvs.tistory.com/entry/LWC-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8-url%EB%A1%9C-%ED%98%B8%EC%B6%9C%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95-How-to-call-with-LWC-component-url-1

LWC 컴포넌트 url로 호출하는 방법 - How to call with LWC component url

 

 

 

 

 

---

 

1. 결론

LWC 컴포넌트를 URL로 직접 호출하는 것은 불가능하다.

Salesforce 플랫폼의 보안 및 아키텍처 제한으로 인해 지원되지 않습니다.

 

 

---

 

2. LWC 표시 방법

1. Screen Flow를 활용하여 LWC 호출하여 표시
2. Visualforce 페이지 내에서 LWC 컴포넌트 표시
3. Lightning Page에서 LWC 구성요소 추가하여 표시
4. Aura Component를 활용하여 LWC 호출하여 표시

 

---

 

3. URL로 LWC 보여주는 방법 - Aura 컴포넌트 랩핑

 

동작원리

• URL로 AuraComponent를 호출하고
• 해당 AuraComponent에서 LWC 호출하여 표시

 

구현

1. aura component 생성
2. aura.cmp파일에서 implements 설정 및 lwc 컴포넌트 호출
   • <aura:component implements="lightning:isUrlAddressable" >
3. aura.cmp파일에서 LWC 컴포넌트 호출
   • <c: [LWC 컴포넌트명] > </ c: [LWC 컴포넌트명] >

<aura:component implements="lightning:isUrlAddressable">

      <c:zz_Clvs_MDE_Template_Main recordId="{!v.recordId}"></c:zz_Clvs_MDE_Template_Main>

</aura:component>

 

---

 

4. TIP - auraComponent URL로 호출하는 방법

• [내 도메인] /lightning/cmp/[c__LWC컴포넌트명]
  • https://salesforce26-dev-ed.lightning.force.com/lightning/cmp/c__auraComponent
• +@ 파라미터 전달 시 쿼리스트링으로 전달하는데 c__파라미터명 형식으로 전달해야 함
  • https://salesforce26-dev-ed.lightning.force.com/lightning/cmp/c__auraComponent?&c__userName=giggs