ファイルが存在するかどうかを判断する 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 をよろしくお願いいたします。