🖥

Web画面でファイル解析をフロントエンドでやるかバックエンドでやるか ( アップロード処理の例 ) ( エクセル/PDF/CSVなど )

2024/03/08に公開

要件

  • Webの画面からファイルを選択して、その内容をサーバー(バックエンド)に送信したい

フロントエンド方式

  • 例えばエクセルであれば exceljs などのライブラリを使う
  • ブラウザでファイルを選択したタイミング、もしくはバックエンドに送信する前段階でファイルの解析をする
  • 読み取ったファイルの解析内容からバックエンドに送る内容をJSONなどで組み立て、バックエンドに対してリクエストを行う
  • バックエンドはシンプルなリクエストを受け取って、必要な処理をおこなう

メリット

  • 「ユーザーがファイルを選択したタイミングでファイル内容を解析し、画面に何らかデータを表示する、エラーを返す」などインタラクティブなハンドリングが出来る

デメリット

  • ユーザーのスペックはブラウザに依存するので、大きなファイルや複雑な処理の負荷があると辛いかも
  • 挙動がユーザー依存なので、思わぬ不具合が起きた時に原因を特定しづらいかもしれない

バックエンド方式

  • フロントからバックエンドにファイル本体を送信する
  • バックエンドではライブラリを使ってファイルを解析し、必要な処理をおこなう

メリット

  • ファイル解析にサーバーのスペックを使えるので、ユーザー環境の負担が少ない

デメリット

  • フロント方式のようなインタラクティブな処理がしづらい

チャットメンバー募集

何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ

プロフィール・経歴

https://github.com/YumaInaura/YumaInaura

公開日時

2024-03-08

Discussion