Problem I have an application with a UI and a backend. The UI runs Angular, the backend Django. For PRs I create build previews with netlify. The build preview uses a backend deployed somewhere else. This works well for the normal deployments, since there the api is a subdomain of the UI (staging.openbadges.education and api.staging.openbadges.education). However, with netlify this is not the case anymore: there the UI url is something like deploy-preview-1015--openeducationalbadges.netlify.app. This means that authentication cookies from the backend are suddenly treated as 3rd party cookies and get blocked by the browser. Idea So to solve this I want to setup a relay with every deploy preview that relays API requests to api.staging.openbadges.education, e.g. under deploy-preview-1015--openeducationalbadges.netlify.app/api. Attempts First I attempted to change the domain name of the deploy preview, so that it could also run on openbadges.education. This requires netlify pro though, which I don't want Second I set up a separate netlify site which would relay the calls. However, cookies from different subdomains still seam to get treated as 3rd party cookies. I didn't find a source on this, I just observed that chrome blocked cookies from oeb-api.netlify.app on deploy-preview-1015--openeducationalbadges.netlify.app Then I attempted to use the _redirects file on the netlify Angular site. This doesn't work though because Angular uses SSR Next I tried setting up an Angular proxy. However, this only works with ng serve. Netlify however uses ng build Then I ran out of ideas. How can I solve this? How can I set up a proxy on netlify running Angular? Continue reading...
