アップロードしたファイルをPDF.jsビューワーで開きたい
解決したいこと
アップロードしたファイルをPDF.jsビューワーで開きたいです。
Flask、Python、htmlを使ってユーザーがアップロードしたファイルをPDF.jsで開くWebアプリをつくっています。
機能の実装中にエラーが発生しました。
プログラムを書くこと自体に慣れておらず、ChatGPTを活用しながら作っています。そのため優しく教えてくださると助かります。
解決方法を教えて下さい。
発生している問題・エラー
127.0.0.1 - - [15/Nov/2024 19:10:32] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [15/Nov/2024 19:10:41] "POST /upload HTTP/1.1" 200 -
127.0.0.1 - - [15/Nov/2024 19:10:41] "GET /web/viewer.html?file=test1.pdf HTTP/1.1" 304 -
127.0.0.1 - - [15/Nov/2024 19:10:41] "GET /build/pdf.js HTTP/1.1" 404 -
127.0.0.1 - - [15/Nov/2024 19:10:41] "GET /web/viewer.css HTTP/1.1" 304 -
ファイルのアップロードはうまくいっています。
PDF.jsのビルドで問題が起きているみたいです。
該当するソースコード
@app.route('/web/<path:filename>')
def serve_file(filename):
return send_from_directory('web', filename)
Webディレクトリにtest1.pdfファイルが入っています
<iframe title="pdfjs-default-viewer"
src="{{ url_for('serve_file', filename='viewer.html') }}?file={{ url_for('serve_file', filename='test1.pdf') }}"
width="400px"
height="500px">
</iframe>
自分で試したこと
VScodeで書いているのですが、LiveServerを使用して、
パスをsrc="../web/viewer.html?file=test2.pdf"にしているとちゃんとビューワーが表示されます。
しかしPythonを通して、src="{{ url_for('serve_file', filename='viewer.html') }}?file={{ url_for('serve_file', filename='test1.pdf') }}"
のパスを使ってアップロードしたファイルを開こうとするとビルドエラーが起きます。
ビューワーの形だけはページで表示されるのですが、中身のPDFは表示されません。
このパスの指定の仕方が間違っているのでしょうが、どうもわかりません。
元々できないことをしようとしているのでしょうか?