Have nginx serve static assets with Phoenix 1.4 deployed using distillery

Phoenix Forum Questions / Help
, , ,
1

Hello, everyone. I am new to Phoenix and am working to get a basic Phoenix 1.4 app deployed to production. I am using distillery and I have successfully created a release. I can access my webapp from a web browser, and it is working correctly, however I want to have nginx serve the static assets (instead of phoenix).

In my current nginx configuration, I have a root specified, but it doesn’t seem to matter what the path is. Without specifying the root, the nginx default page shows instead of my app (that’s another thing I’d like to understand).

I think my question boils down to “Where does distillery put static assets so that I can point nginx to that directory?”

Thanks in advance for any assistance!

2

make sure nginx only serve static files so match only static files something along these lines should be sufficient

    location ~* ^.+\.(css|js|ico|jpg|jpeg|png|svg|woff|woff2)$ {
      root /path/to/myapp/priv/static;
      etag off;
      expires max;
      add_header Cache-Control public;
    }

I have not deployed phoenix with distillery but I assume assets will remain under priv/assets directory that should not change.

3 Likes
3

Thank you, @allyraza. I was able to put a similar version of that into my NGINX config. My static assets are now being served by NGINX! The key to resolving this issue was the path to the static assets in the distillery release. For anyone who is looking for this in the future, Distillery puts the static assets for your project in /lib/{appname-version}/priv/static. So, if your app name is exampleapp and the version of your app is 0.1.0, and put the release in /srv/exampleapp then the path would be /srv/exampleapp/lib/exampleapp-0.1.0/priv/static. @hauleth helped me out with this info in the elixir Slack group. Thanks to both of you!

2 Likes
4

You can copy the static assets out of the phx app lib dir to some path that nginx knows about via distillery’s {:copy, ..., ...} overlay directive.

https://hexdocs.pm/distillery/config/distillery.html#environmentrelease-settings

2 Likes
5

Hi everyone,

How about the new mix release command?

bin/RELEASE_NAME version (prints the release name and version to be booted) could help to find the path of the priv directory.

Here the directory structure of a release

bin/
  RELEASE_NAME
erts-ERTS_VSN/
lib/
  APP_NAME-APP_VSN/
    ebin/
    include/
    priv/

Then a simple cp linux command to some path nginx knows about?
This approach isn’t too much naive?

6

Hi @allyraza! quick question (newb in nginx): /app-three is still not serving assets, what did i miss?:

    location /app-two {
        proxy_pass http://127.0.0.1:8898;
        #...
    }

    location /app-three {
        proxy_pass http://127.0.0.1:8899;
        #...

        location ~* ^.+\.(css|cur|gif|gz|ico|jpg|jpeg|js|png|svg|woff|woff2)$ {
            root /home/user/folder/test_app/priv/static;
            etag off;
            expires max;
            add_header Cache-Control public;
        }
    }