ファイルが存在するかどうかを判断する JavaScript サンプルコード

ファイルが存在するかどうかを判断する JavaScript サンプルコード

1. ビジネスシナリオ

最近はファイルのアップロードやダウンロードに関する開発をしています。ダウンロードに関しては、以下の方法でダウンロードしています。

   //ダウンロード パスを取得または割り当てます let downUrl;
   //次のメソッドを使用してファイルを直接ダウンロードします。window.location.href = downUrl;

ビジネス上の問題: このファイルが存在しない場合は、ページがジャンプします。

例: 1. ファイルストレージサーバーがダウンしている 2. またはファイルストレージサーバー上のファイルが削除されている

上記のような異常なアクセスはダウンロード機能に問題を引き起こし、ページジャンプはユーザーにとって不親切です。

ここで、ダウンロード時にファイルが存在するかどうかがわかれば、この問題をうまく解決できます。

2. 解決策

2つの解決策を提供する

1. バックエンドソリューション: 一般的に、ファイルは専用のキーを持つファイルストレージサーバーに保存されます。ファイルが存在するかどうかを照会するための別のインターフェイスがあるかどうかを確認します。つまり、ダウンロードする前に、ファイルの一意のキーに基づいてファイルが存在するかどうかを照会します。存在する場合は、ダウンロードステートメントを実行します。存在しない場合は、ユーザーに対応するプロンプトを表示します。

             もし(){
             //ファイルが存在する場合はダウンロードします }else{
             //それ以外の場合は対応するプロンプトを表示します}

2. フロントエンドソリューション: フロントエンド方式は、ファイルストリームが存在するかどうかを判断します。

実用的な参考として、Vueでのメソッド記述方法を紹介します。

            /**
             * サービスファイルが存在するかどうかを判断します* @param filepath ファイルアドレス* @param filename
             * @returns {ブール値}  
             */
         isExistFile(ファイルパス、ファイル名){
              if(ファイルパス == null || ファイル名 == null || ファイルパス === "" || ファイル名 ===""){
                偽を返す
               }
              var xmlhttp;
              if (window.XMLHttpRequest){
                xmlhttp = 新しい XMLHttpRequest();
              }それ以外{
                xmlhttp = 新しい ActiveXObject("Microsoft.XMLHTTP");
             }
              xmlhttp.open("GET",ファイルパス,false);
              xmlhttp.send();
              xmlhttp.readyState === 4の場合{
              if(xmlhttp.status === 200) return true; //URL が存在する else if(xmlhttp.status === 404) return false; //URL が存在しない else return false;//その他のステータス}
       }

後続のロジックは自分で補足できます。上記のように、ファイル ストリームが存在するかどうかをテストできます。存在する場合はダウンロードします。存在しない場合は、対応するプロンプトを表示します。これにより、ファイル パスが存在しない場合に空白ページにジャンプする問題が解決されます。

補足: 「ストリーム」は抽象的な概念であり、入出力デバイスを抽象的に理解したものです。Java では、データの入出力操作は「ストリーム」方式で実行されます。

要約:

ビジネス上の問題に遭遇したとき、フロントエンドとバックエンドの両方の観点から考え、学び、共有して新しい知識を獲得し、さらなる進歩を期待することができます...

これで、ファイルが存在するかどうかを判定する JavaScript に関するこの記事は終了です。ファイルが存在するかどうかを判定する JavaScript に関する関連記事については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript を使用してファイルが存在するかどうかを判断する
  • JavaScriptはファイルが存在するかどうかを判定するインスタンスコード
  • Javascript はファイルが存在するかどうかを判断します (クライアント/サーバー)
  • JavaScript で fso を使用してファイルが存在するかどうかを判断するコード

<<:  Nginxを再コンパイルしてモジュールを追加する方法

>>:  MySQL 5.7.21 解凍版のインストールと設定方法のグラフィックチュートリアル

推薦する

DockerはMysql、.Net6、Sqlserverなどのコンテナをデプロイします

目次CentOS 8にDockerをインストールする1. yumを更新する2. containerd...

Linux 構成 SSH パスワードフリーログイン「ssh-keygen」の基本的な使い方

目次1 SSHとは何か2 SSHパスワードフリーログインを設定する2.1 必要なソフトウェアのインス...

システム CD をマウントして yum ウェアハウスを構築する VMware 15.5 バージョンのグラフィック チュートリアル

1. CentOS 7 仮想マシンを開きます。 2. 仮想マシンにログインし、リストにないユーザー名...

GoのDockerデプロイメント用の基本イメージ2つの実装

1. golang:最新のベースイメージ mkdir gotest タッチメイン.go Docker...

Tomcat プロセスの CPU 使用率が高い場合の解決策

目次場合コンテキスト切り替えのオーバーヘッド?要約するCPU は多くの場合、システム パフォーマンス...

画像ファイルの形式とその選択方法

1. どの 3 つの形式ですか?それぞれ、gif、jpg、png です。画像ファイルを最適化すること...

HTML テーブル_Powernode Java アカデミー

HTMLで表を描くには、表タグを使用します。 trは行を意味しますtdは列を示すth はテーブ...

複数人チャットルームを実現する js コード

この記事の例では、多人数チャットルームを実装するためのjsコードの具体的なコードを参考までに共有して...

CSS3 弾性拡張ボックスの詳細な説明

使用フレキシブル ボックスはフロントエンドの Web ページ レイアウトで重要な役割を果たしますが、...

Windows Server 2008 R2 に MySQL 5.7.10 をインストールする手順

MSIインストールパッケージを使用してインストールするご使用のオペレーティング システムに応じて、対...

nginxディレクトリパスをリダイレクトする方法

ドメイン名に続くパスがデフォルトの Web ディレクトリではなく、ローカル ディスク上の他のディレク...

Pengyou.com モバイル クライアントのダウンロード ページのデザイン共有 (画像とテキスト)

まずは簡単なデータを見てみましょう。 Googleが発表したレポートによると、 ①中国の都市の97%...

SSM VUE Axios の詳細な説明

目次SQL ログを表示するにはどうすればいいですか? ? SpringMVC でのパラメータ渡しの説...

スタイルをより標準化するための CSS の書き方に関する 5 つのヒント

1. CSSをアルファベット順に並べるアルファベット順ではありません:コードをコピーコードは次のとお...

PostgreSQL マテリアライズドビュープロセス分析

この記事は主にPostgreSQLマテリアライズドビューのプロセス分析について紹介します。サンプルコ...