Answers.Body: <p>Apparently, the answers are the following:</p>
  
  <ul>
  <li>Redactor doesn't know how to output slugs/URIs instead of full URLs</li>
  <li>Possibly a solution comes up with craft in the future</li>
  <li>My API setup is suboptimal: In fact, I did set the baseUrl including the language: <code>https://frontend.com/de</code>. The recommendation is to not do that at the moment but keep one "Site" for all endpoints in all languages. This can be added as another, separate site in craft! So we'd have 3 language sites in craft and a separate site for the endpoint. The language is then part of the endpoint's data. And the endpoint's URL is <code>https://endpoint.site/api/de/foo</code> instead of <code>https://backend.site/de/api/foo</code>. Yes, I guess that makes sense! Thanks again, Oli!</li>
  </ul>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-04-08T19:46:21.477Z
Answers.LastActivityDate: 2020-04-08T19:46:21.477Z
Answers.UserDisplayName: Urs
Body: <p>I am having an ongoing confusion in headless mode.</p>
  
  <p>Imagine a site with 2 servers:</p>
  
  <ul>
  <li>Backend (Craft with element API) on <code>https://backend.site</code></li>
  <li>Frontend (vue.js) on <code>https://frontend.site</code></li>
  </ul>
  
  <p>Editors pick internal links in the craft cp. In the source of redactor field, they are saved as something like <code>{entry:xxx@1:url}</code>.</p>
  
  <p>In the Backend's endpoint, they are rendered out using the domain specified in <code>baseUrl</code>.</p>
  
  <p>So let's say we have an endpoint on <code>backend.site/en/api/pages/somepage.json</code> which is consumed by the vue frontend.</p>
  
  <p>In the backend's JSON output, we have an internal link that should be rendered as such:</p>
  
  <pre><code>Go to our other terrific 
  &lt;a href="https://frontend.site/en/otherpage"&gt;Other Page&lt;/a&gt;
  # Using https://frontend.site as baseURL.
  </code></pre>
  
  <p>So the logical consequence is to set baseUrl to <code>https://frontend.site</code>. Naturally, because the website's baseUrl <em>is</em> frontend.site – not the craft backend. But, but. </p>
  
  <p>In my case, this has worked for the default language. But not for any other language – element API returned a 404 when I set the baseUrl to <code>frontend.site</code> </p>
  
  <ul>
  <li>backend.site/en/api/pages/somepage.json ✅   </li>
  <li>backend.site/de/api/pages/somepage.json </li>
  </ul>
  
  <p>When I reset baseUrl to backend.site, element API will again render all endpoints. But the links look like this:</p>
  
  <pre><code>Go to our other terrific 
  &lt;a href="https://backend.site/en/otherpage"&gt;Other Page&lt;/a&gt;
  # This link doesn't exist
  </code></pre>
  
  <p>What do you think? </p>
  
  <ul>
  <li>A misconfiguration, a bug in element api, or a misunderstanding on my side?</li>
  <li>Asked differently: which <code>baseUrl</code> do you have to set in headless mode?</li>
  </ul>
  
Tags: <plugin-elementapi><configuration><headless>
Title: Headless mode/ElementAPI: how to set the frontend's baseUrl in the backend endpoint?
ThreadText: # Headless mode/ElementAPI: how to set the frontend's baseUrl in the backend endpoint?
  
  (Asked by: username_0 on 2020-04-06)
  
  I am having an ongoing confusion in headless mode.
  
  Imagine a site with 2 servers:
  
  * Backend (Craft with element API) on `https://backend.site`
  * Frontend (vue.js) on `https://frontend.site`
  
  Editors pick internal links in the craft cp. In the source of redactor field, they are saved as something like `{entry:xxx@1:url}`.
  
  In the Backend's endpoint, they are rendered out using the domain specified in `baseUrl`.
  
  So let's say we have an endpoint on `backend.site/en/api/pages/somepage.json` which is consumed by the vue frontend.
  
  In the backend's JSON output, we have an internal link that should be rendered as such:
  
  ```
  Go to our other terrific 
  <a href="https://frontend.site/en/otherpage">Other Page</a>
  # Using https://frontend.site as baseURL.
  
  ```
  
  So the logical consequence is to set baseUrl to `https://frontend.site`. Naturally, because the website's baseUrl *is* frontend.site – not the craft backend. But, but.
  
  In my case, this has worked for the default language. But not for any other language – element API returned a 404 when I set the baseUrl to `frontend.site`
  
  * backend.site/en/api/pages/somepage.json ✅
  * backend.site/de/api/pages/somepage.json
  
  When I reset baseUrl to backend.site, element API will again render all endpoints. But the links look like this:
  
  ```
  Go to our other terrific 
  <a href="https://backend.site/en/otherpage">Other Page</a>
  # This link doesn't exist
  
  ```
  
  What do you think?
  
  * A misconfiguration, a bug in element api, or a misunderstanding on my side?
  * Asked differently: which `baseUrl` do you have to set in headless mode?
  
  **Tags:** plugin-elementapi, configuration, headless
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_0 on 2020-04-08. Score: 1
  
  Apparently, the answers are the following:
  
  * Redactor doesn't know how to output slugs/URIs instead of full URLs
  * Possibly a solution comes up with craft in the future
  * My API setup is suboptimal: In fact, I did set the baseUrl including the language: `https://frontend.com/de`. The recommendation is to not do that at the moment but keep one "Site" for all endpoints in all languages. This can be added as another, separate site in craft! So we'd have 3 language sites in craft and a separate site for the endpoint. The language is then part of the endpoint's data. And the endpoint's URL is `https://endpoint.site/api/de/foo` instead of `https://backend.site/de/api/foo`. Yes, I guess that makes sense! Thanks again, Oli!
  
  
  ---
  
  