I've got a Next.js-based app that uses custom fonts. On the Rendering host the fonts are accessible via the following url:


Experience Editor tries to load fonts from CM but the fonts are not found and 404 is returned:


In the same time, the webpack.js file is requested from the Rendering host and successfully received:


How to make Experience Editor request fonts from the Rendering host?

1 Answer 1


Tell your NextJS app to render the fonts using absolute URL.

We did it in our app by setting the PUBLIC_URL variable to the base URL of our app, which in your case, https://www.myapp.localhost.

You will also need to configure your NextJS app to allow cross domain request from your CM hostname. See this doc to see how you can modify http headers in NextJS.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.