ファイルが存在するかどうかを判断する 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 解凍版のインストールと設定方法のグラフィックチュートリアル

推薦する

Confluence と jira-software を Docker にデプロイする方法

バージョン: セントロス==7.2 jdk==1.8 合流==6.15.4 jira-ソフトウェア=...

js に基づいて大きなファイルのアップロードとブレークポイントの再開を管理する方法

目次序文フロントエンド構造バックエンド構造(ノード+エクスプレス) FormDataに基づくファイル...

LinuxにMySQLデータベース5.6のソースコードをインストールし、ログインユーザーのパスワードを変更する

この記事では、主に Linux で MYSQL データベースをインストールする方法について説明し、M...

LinuxスレッドのPID(TID、LWP)を取得するいくつかの方法の詳細な説明

Linux C/C++ では、スレッド レベルの操作は通常、pthread ライブラリを通じて実行さ...

MySQLの起動失敗の解決策

MySQLの起動失敗の解決策MySQLを起動できませんmysqlを停止した後、いくつかの操作(ホスト...

フロントエンドJavaScript ES6の詳細について

目次1. はじめに1.1 Babel トランスコーダ1.2 ポリフィル2. let と const ...

仮想スクロールを簡単に実装するためのVueサンプルコード

目次序文ローリング原理成し遂げるソースコード参照する序文モバイル Web ページの日常的な開発では、...

Vue が DingTalk の出勤カレンダーを実装

この記事では、DingTalkの勤怠カレンダーを実装するためのVueの具体的なコードを参考までに共有...

Centos8 の Django プロジェクトに nginx+uwsgi をデプロイするチュートリアル

1. 仮想環境virtualenvのインストール1. virtualenvをインストールするpip3...

流星効果を実現する JavaScript キャンバス

この記事では、JavaScriptキャンバスで流星の特殊効果を表示するための具体的なコードを参考まで...

DockerをインストールしてAlibaba Cloud Image Acceleratorを構成する方法

DockerのインストールDocker はオープンソースなので、Windows システムへのインスト...

組み込み Linux 開発環境で ping と nfs を構築するためのソリューション

1. 組み込みソフトウェアレベル 1) ブートローダ -> ブートローダ組み込みシステム全体の...

フォームデータを取得するための Node.js メソッドの 3 つの例

序文Nodejs はサーバーサイド言語です。開発中、登録やログインなどでは、判断のためにフォームを通...

HTML と埋め込み Flash の両方におけるスクロールバーの分析と処理

開発を行う際に、次のような状況に遭遇することがよくあります。 a.swf が Web ページに追加さ...

デザイナーが再びハマーの公式サイトに不満を述べる

昨年、この公開書簡は大ヒットし、羅永浩氏を驚かせた。今日、著者が新しい章を発表するとは思ってもみなか...