Zoom advanced app heroku deployment

Wondering if someone could give me some insight into the best way to deploy the GitHub - zoom/zoomapps-advancedsample-react: This repository contains an Advanced Zoom Apps Sample. It should serve as a starting point for you to build and test your own Zoom App in development. on heroku. I am currently deploying the frontend and backend separately with a different heroku.yml pointing to the Dockerfiles, since I feel like I’ve tried everything possible to get both in the same deployment.

The issue that I run into with deploying them separately is that I set the ZOOM_APP_CLIENT_URL variable in the backend app to my frontend deployment url, but when I launch the app I get a couple errors because it is looking for the manifest.json and bundle.js within the root of my backend instead of the frontend.

If anyone could give me some recommendations, it would be greatly appreciated.

@brett When deploying a frontend and backend on heroku, the easiest method may be to build out the static files for the react site and place them in a folder to be served by the backend.

Let me know if that helps. If not, I can reach out to the authors of this sample to see if they have any exact steps on deploying to heroku but I’m not sure if they’ve tested this yet.

Hi @MaxM, I’ve tried your suggested solution but that doesn’t seem to working either. If you have any other ideas, I am open and grateful for any suggestions that you may have.

Hi @MaxM, I wasn’t sure if you saw my reply a while back and just wanted to follow up. I tried building the static files to serve up on the backend but didn’t have any luck. Currently I have the frontend and backend split into two different repos. Both deployments build fine but when opening the application in the zoom client, I get this error:
Refused to execute …./api/zoomapp/proxy/static/js/bundle.js as script because “X-Content-Type-Options: nosniff” was given and its Content-Type is not a script MIME type.

Thanks for following up! It sounds like your server needs to set the content type to be application/javascript for those files.

When nosniff is set, then it does not sniff the MIME type and instead relies on content-type headers only. Here are some threads on the topic:

Let me know if that helps!