SPA Integration Best Practices
There are many ways in which an SPA could potentially be integrated with Bloomreach Experience Manager. This page intends to help front-end engineers with a set of best practices, such that their integration is as smooth as possible, and such that Bloomreach can optimally support them in their efforts.
Use the SDK
The first best practice is to use the SPA SDK. It reduces the amount of code to write and maintain for integrating with Bloomreach Experience Manager. Bloomreach maintains the SDK, so you can take advantage from fixes for bugs discovered by other users. If your SPA uses a different JS rendering framework or a version that is not supported by the SDK, you may want to fork the SDK and adjust it to your specific needs, in such a way that you can keep up with the evolution of the SDK.
Use the URL Rewriter for Reverse Proxying
In most real-world scenarios, your SPA lives separate from the Bloomreach Experience Manager instance. The integration of your SPA into the Experience manager's previewing and editing capabilities require you to access your SPA on the Experience manager's host on the front-end, which requires reverse proxying on the server side. We recommend to use the URL Rewriter enterprise plugin for this mechanism, because it is available also in a Bloomreach Cloud environment. There is a page describing how to set up the URL Rewriter.
Use Absolute URLs for Static Resources
By default, your SPA may refer to static resources (such as icons or styling) through host-relative links such as /images/icon.svg. This will break when the SPA is served over the Experience manager's host. In order to keep these links working in all situations, your SPA should use absolute URLs for its static resources.