Skip to main content
Level 2
July 21, 2023
Solved

Remote SPA - component not rendered on AEM page

Hello,

 

We have set up Remote Spa by following:

https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/spa-editor/remote-spa/aem-configure.html?lang=en

https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/spa-editor/remote-spa/spa-bootstrap.html?lang=en 

 

On React App, the result looks like:

 

But, in AEM

 

 

 

 

Error in log: 21.07.2023 10:27:39.484 *ERROR* [[0:0:0:0:0:0:0:1] [1689915459446] GET /editor.html/content/wknd-app/us/en/home.html HTTP/1.1] com.adobe.cq.msm.ui.servlet.IsSourceRenderCondition path /content/wknd-app/us/en/home.html to check render condition is not valid

 

Requesting guidance on how to resolve this

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
EstebanBustamante
EstebanBustamanteAccepted solution
Adobe Champion and Community Advisor
July 21, 2023

Do you see any errors in the browser console? Usually, that may be caused by 2 reasons:

1.  The resourceType of the page/components was not updated, if so, refer to this section https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/spa-editor/remote-spa/aem-configure.html?lang=en#set-aem-page-as-remote-spa-page-template 

2. CORS are not set correctly, if so, refer to this section: https://experienceleague.adobe.com/docs/experience-manager-learn/getting-started-with-aem-headless/spa-editor/remote-spa/aem-configure.html?lang=en#cross-origin-resource-sharing-security-policies 

Esteban Bustamante

1 reply

EstebanBustamante
Adobe Champion and Community Advisor
EstebanBustamanteAdobe Champion and Community AdvisorAccepted solution
Adobe Champion and Community Advisor
July 21, 2023
Esteban Bustamante