Elixir에서 PDF 파일을 생성하고 Phoenix에서 정적 파일로 호스팅
시도한 것은 다음 라이브러리
wkhtmltopdf라는 라이브러리의 Wrapper라는 것
사용법은 매우 간단했다.
절차
wkhtmltopdf 설치
이하의 공식 사이트에서 OS에 맞춘 인스톨러를 사용한다.
필자는 Mac에서 실시
프로젝트 만들기
> mix phx.new pdf_sample --no-ecto --no-brunch
deps 추가
mix.exs def application do
[
mod: {PdfSample.Application, []},
extra_applications: [:logger, :runtime_tools, :pdf_generator] #<- :pdf_generator追加
]
end
defp deps do
[
{:phoenix, "~> 1.3.2"},
{:phoenix_pubsub, "~> 1.0"},
{:phoenix_html, "~> 2.10"},
{:phoenix_live_reload, "~> 1.0", only: :dev},
{:gettext, "~> 0.11"},
{:cowboy, "~> 1.0"},
{:pdf_generator, ">=0.3.7" }, #<- 追加
]
end
> mix .deps.get
코드 본체
이번에는 시험만 했으므로 모듈을 만들지 않고 iex로 실행했다.
iex(1)> source_html = "<html><body><p>Hi there!</p></body></html>"
# ページサイズA5とファイル名を任意指定
iex(2)> { :ok, filename } = PdfGenerator.generate source_html, page_size: "A5",
filepath: "/Users/tsuchiro/code/samples/pdf_sample/priv/static/pdf", filename: "sample_pdf"
# 結果は作成されたファイルのフルパスがタプルで返ってくる
iex(3)> {:ok, pdf_path} = {:ok, "/var/folders/pz/2847mdrn0gz51b2tctnfqc740000gn/T/sample_pdf.pdf"}
# 静的ファイルのパスにコピーする
iex(4)> File.copy(pdf_path,"./priv/static/pdf/sample_pdf.pdf")
```
## 画面にリンクを追加
```html:/pdf_sample_web/templates/page/index.html.eex
<div class="jumbotron">
<h2><%= gettext "Welcome to %{name}!", name: "Phoenix" %></h2>
<p class="lead">A productive web framework that<br />does not compromise speed and maintainability.</p>
</div>
<div class="row marketing">
<div class="col-lg-6">
<h4>Resources</h4>
<ul>
<li>
<a href="http://phoenixframework.org/docs/overview">Guides</a>
</li>
<li>
<a href="https://hexdocs.pm/phoenix">Docs</a>
</li>
<li>
<a href="https://github.com/phoenixframework/phoenix">Source</a>
</li>
<li>
<!-- ↓ PDFファイルへのリンクを追加 -->
<a href="<%= static_path(@conn, "/pdf/sample_pdf.pdf") %>">PDF Document</a>
</li>
</ul>
</div>
<div class="col-lg-6">
<h4>Help</h4>
<ul>
<li>
<a href="http://groups.google.com/group/phoenix-talk">Mailing list</a>
</li>
<li>
<a href="http://webchat.freenode.net/?channels=elixir-lang">#elixir-lang on freenode IRC</a>
</li>
<li>
<a href="https://twitter.com/elixirphoenix">@elixirphoenix</a>
</li>
</ul>
</div>
</div>
엔드포인트에 CSS를 추가합니다.
static_path는 priv/static 이하를 가리키지만, 디폴트에서는 액세스 할 수 있는 패스에 제한이 걸려 있으므로, pdf 폴더를 추가한다.
plug Plug.Static,
at: "/", from: :pdf_sample, gzip: false,
only: ~w(css fonts images js pdf favicon.ico robots.txt) # <- pdfを追加
방문해보기
쉽게 할 수있었습니다.
WebKit에서 HTML을 그려서 PDF로 하고 있는 것 같기 때문에, 원래의 HTML마저 만들면 정교한 PDF도 만들 수 있을 것 같네요.
Reference
이 문제에 관하여(Elixir에서 PDF 파일을 생성하고 Phoenix에서 정적 파일로 호스팅), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다
https://qiita.com/tuchiro/items/057b595e81f4dca80ab3
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
> mix phx.new pdf_sample --no-ecto --no-brunch
def application do
[
mod: {PdfSample.Application, []},
extra_applications: [:logger, :runtime_tools, :pdf_generator] #<- :pdf_generator追加
]
end
defp deps do
[
{:phoenix, "~> 1.3.2"},
{:phoenix_pubsub, "~> 1.0"},
{:phoenix_html, "~> 2.10"},
{:phoenix_live_reload, "~> 1.0", only: :dev},
{:gettext, "~> 0.11"},
{:cowboy, "~> 1.0"},
{:pdf_generator, ">=0.3.7" }, #<- 追加
]
end
> mix .deps.get
iex(1)> source_html = "<html><body><p>Hi there!</p></body></html>"
# ページサイズA5とファイル名を任意指定
iex(2)> { :ok, filename } = PdfGenerator.generate source_html, page_size: "A5",
filepath: "/Users/tsuchiro/code/samples/pdf_sample/priv/static/pdf", filename: "sample_pdf"
# 結果は作成されたファイルのフルパスがタプルで返ってくる
iex(3)> {:ok, pdf_path} = {:ok, "/var/folders/pz/2847mdrn0gz51b2tctnfqc740000gn/T/sample_pdf.pdf"}
# 静的ファイルのパスにコピーする
iex(4)> File.copy(pdf_path,"./priv/static/pdf/sample_pdf.pdf")
```
## 画面にリンクを追加
```html:/pdf_sample_web/templates/page/index.html.eex
<div class="jumbotron">
<h2><%= gettext "Welcome to %{name}!", name: "Phoenix" %></h2>
<p class="lead">A productive web framework that<br />does not compromise speed and maintainability.</p>
</div>
<div class="row marketing">
<div class="col-lg-6">
<h4>Resources</h4>
<ul>
<li>
<a href="http://phoenixframework.org/docs/overview">Guides</a>
</li>
<li>
<a href="https://hexdocs.pm/phoenix">Docs</a>
</li>
<li>
<a href="https://github.com/phoenixframework/phoenix">Source</a>
</li>
<li>
<!-- ↓ PDFファイルへのリンクを追加 -->
<a href="<%= static_path(@conn, "/pdf/sample_pdf.pdf") %>">PDF Document</a>
</li>
</ul>
</div>
<div class="col-lg-6">
<h4>Help</h4>
<ul>
<li>
<a href="http://groups.google.com/group/phoenix-talk">Mailing list</a>
</li>
<li>
<a href="http://webchat.freenode.net/?channels=elixir-lang">#elixir-lang on freenode IRC</a>
</li>
<li>
<a href="https://twitter.com/elixirphoenix">@elixirphoenix</a>
</li>
</ul>
</div>
</div>
plug Plug.Static,
at: "/", from: :pdf_sample, gzip: false,
only: ~w(css fonts images js pdf favicon.ico robots.txt) # <- pdfを追加
쉽게 할 수있었습니다.
WebKit에서 HTML을 그려서 PDF로 하고 있는 것 같기 때문에, 원래의 HTML마저 만들면 정교한 PDF도 만들 수 있을 것 같네요.
Reference
이 문제에 관하여(Elixir에서 PDF 파일을 생성하고 Phoenix에서 정적 파일로 호스팅), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/tuchiro/items/057b595e81f4dca80ab3텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)