All our resources are in azure! Our Sitecore instance, front end codes are hosted as app-services!
We are trying to setup rendering host for experience editor. We are looking for ideal way for SSR headless option and not integrated mode.
Developer machine setup:
Below is our developer machine setup & its completely working fine, Following this official docs
CMS local Sitecore instance: Below is
jss
app config,<app name="exp-demo" layoutServiceConfiguration="default" sitecorePath="/sitecore/content/exp-demo" useLanguageSpecificLayout="true" graphQLEndpoint="/sitecore/api/graph/edge" inherits="defaults" serverSideRenderingEngine="http" serverSideRenderingEngineEndpointUrl="http://localhost:5000/api/editing/render" serverSideRenderingEngineApplicationUrl="http://localhost:5000" />
Rendering host: In local code tunnelling to the
localhost:5000
- In package.json we have
"tunnelUrl": "http://localhost:5000",
- Also we will build & run rendering host using this cmd
npm run build:rendering-host
&npm run start:rendering-host
. We are using ngrok tunnel url, only for front end resources testing. - Experience editor is working as expected!
- In package.json we have
Higher environment setup : (This is the area we are not able to up and running!)
Below options tried,
option1 : Pointing FrontEnd(SSR proxy) as serverSideRenderingEngineEndpointUrl.
- We have a headeless SSR proxy(URL:https://exp-demo-fe) followed by this article. This is our UAT website frontend endpoint with SSR.
CMS UAT Sitecore instance : Below is jss app config,
<app name="exp-demo" layoutServiceConfiguration="default" sitecorePath="/sitecore/content/exp-demo" useLanguageSpecificLayout="true" graphQLEndpoint="/sitecore/api/graph/edge" inherits="defaults" serverSideRenderingEngine="http" serverSideRenderingEngineEndpointUrl="https://exp-demo-fe/api/editing/render" serverSideRenderingEngineApplicationUrl="https://exp-demo-fe" />
This is failed with below error , when we try to open experience editor.
Error Rendering Sitecore.JavaScriptServices.ViewEngine.Presentation.JsLayoutRenderer: Unexpected character encountered while parsing value: <. Path '', line 0, position 0. at Newtonsoft.Json.JsonTextReader.ParseValue()
Note we already set JSSEDITING
secret in both client & server side. In CM No further logs!
- Even we try to change the
serverSideRenderingEngineEndpointUrl
as like below,
serverSideRenderingEngineEndpointUrl="https://exp-demo-fe/jss-render"
|serverSideRenderingEngineEndpointUrl="https://exp-demo-fe
|serverSideRenderingEngineEndpointUrl="https://exp-demo-fe/sitecore/api/editing/render"
but this is giving the below error,
Connection to your rendering host failed with a Not Found error. Ensure the POST endpoint at URL http://***/api/editing/render has been enabled.
Question 1 : This option 1 is right way to do? As a SSR proxy can act as a rendering host for CMS Experience editor? Then what we missed here ?
Question 2 : How to setup rendering host as per this article in APPSERVICE? When we try this , its no make sense to expose to ngrok first of all because we have public url already. Also when we try this we couldn't able to start rendering host server! Node js throwing below error
node:events:491
throw er; // Unhandled 'error' event
^
Error: spawn C:\home\site\wwwroot\node_modules\ngrok\bin\ngrok.exe ENOENT
at ChildProcess._handle.onexit (node:internal/child_process:283:19)
at onErrorNT (node:internal/child_process:476:16)
at process.processTicksAndRejections (node:internal/process/task_queues:82:21)
Emitted 'error' event on ChildProcess instance at:
at ChildProcess._handle.onexit (node:internal/child_process:289:12)
at onErrorNT (node:internal/child_process:476:16)
at process.processTicksAndRejections (node:internal/process/task_queues:82:21) {
errno: -4058,
code: 'ENOENT',
syscall: 'spawn C:\\home\\site\\wwwroot\\node_modules\\ngrok\\bin\\ngrok.exe',
path: 'C:\\home\\site\\wwwroot\\node_modules\\ngrok\\bin\\ngrok.exe',
spawnargs: [ 'authtoken', '***************************************' ]
}