How to serve a pre-created pdf file with Phoenix

I have a very simple site which must simply serve a bunch of pdfs that I have created. So I have two questions:

a) where should I locate the pdf files? Should they be in the “assets” directory or in the “priv” directory? I assume in either case I would create a “pdfs” subdirectory (please tell me if not).

b) How do I reference them in html in my index.html.eex file? Here is what W3schools says I should do for downloadable files:

<a href="/images/myw3schoolsimage.jpg" download>
  <img src="/images/myw3schoolsimage.jpg" alt="W3Schools">
</a>

but but I don’t know how to reference the /pdfs directory (nor indeed the /images directory) shown in that example. How do I translate those fixed paths to the relevant relative pdf file and images directories?

The recommended way is to put all pdfs under assets/static/pdfs so they would be copied to priv/static/pdfs by webpack copy plugin.

Then You still need to modify your endpoint to allow Plug.Static to serve pdfs…

only: ~w(css fonts images js favicon.ico robots.txt pdfs)

What is under priv/static is served by Plug.Static (if configured in the endpoint) but usually You don’t touch this folder… You put stuff in assets/static and they will be copied.

You should note that priv/static is not under git supervision, so the content is not persisted when You commit…

If You look at your application layout You find this kind of line, but I guess using the path is ok too (I did not test).

<script type="text/javascript" src="<%= Routes.static_path(@conn, "/js/app.js") %>"></script>
4 Likes