従来の解決策FileReader を使用して UTF-8 形式のファイルを読み取り、ファイルの内容に文字化けした文字が含まれているかどうかに基づいて、ファイルが UTF-8 かどうかを判断します。 � が存在する場合、ファイルのエンコーディングは utf-8 ではありません。それ以外の場合は utf-8 です。 コードは次のとおりです。 const isUtf8 = async (ファイル: ファイル) => { 戻り、新しい Promise((resolve, reject) => { を待ちます。 const リーダー = 新しい FileReader(); reader.readAsText(ファイル); reader.onloadend = (e: 任意): void => { 定数コンテンツ = e.target.result; const encodingRight = content.indexOf("") === -1; if (encodingRight) { 解決(エンコーディング右); } それ以外 { 拒否(新しいエラー("エンコード形式エラーです。UTF-8形式のファイルをアップロードしてください")); } }; リーダー.onerror = () => { 拒否(新しいエラー("ファイルの内容の読み取りに失敗しました。ファイルが破損していないか確認してください")); }; }); }; この方法の問題点は、ファイルが数 GB など非常に大きい場合、ブラウザが読み取ったコンテンツが直接メモリに配置され、fileReader インスタンスが直接 onerror をトリガーしてエラーをスローし、場合によってはブラウザが直接クラッシュすることです。 大容量ファイルソリューション大きなファイルの場合は、ファイルの内容をサンプリングしてファイルをスライスすることができます。ここでは、100 個のスライスが使用されています。切り取ったファイルごとに、最初の 1kb セグメントを切り取り、文字列モードで読み取ります。 1024B が中国語文字エンコードの真ん中でカットされると、文字列として読み取るときにエラーが発生する可能性があります。つまり、� が先頭と末尾に出現し、非 UTF-8 セグメントとみなされる可能性があります。このとき、1kb に対応する文字列の前半部分を取得して、それが存在するかどうかを判断できます。 上記の定数は要件に応じて調整できます。 コードは次のとおりです。 const getSamples = (ファイル: ファイル) => { 定数ファイルサイズ = ファイル.サイズ; 定数パーツ: Blob[] = []; ファイルサイズが 50 * 1024 * 1024 未満の場合 parts.push(ファイル); } それ以外 { 合計を 100 とします。 定数サンプルサイズ = 1024 * 1024; const chunkSize = Math.floor(ファイルサイズ / 合計); 開始 = 0 とします。 end = sampleSize; とします。 (合計>1)の間{ parts.push(file.slice(start, end)); 開始 += チャンクサイズ; 終了 += チャンクサイズ; 合計 - ; } } 部品を返品する。 }; const isUtf8 = (ファイルパート: Blob) => { 新しい Promise を返します ((resolve, reject) => { 新しいFileReader()を作成します。 fileReader.readAsText(ファイルパート); ファイルリーダー.onload = (e) => { const str = e.target?.result を文字列として返します。 // およそ半分を取る const sampleStr = str?.slice(4, 4 + str?.length / 2); (sampleStr.indexOf("�") === -1)の場合{ 解決(void 0); } それ以外 { 拒否(新しいエラー(エンコード形式エラー、UTF-8形式のファイルをアップロードしてください")); } }; ファイルリーダー.onerror = () => { 拒否(新しいエラー(ファイルの内容の読み取りに失敗しました。ファイルが破損していないか確認してください")); }; }); }; デフォルトの非同期関数をエクスポートします(ファイル:File){ const サンプル = getSamples(ファイル); res = true とします。 for (const サンプルのファイル部分) { 試す { isUtf8(filePart) を待機します。 } キャッチ(エラー){ 戻り値: 壊す; } } res を返します。 } ファイルが utf-8 でエンコードされているかどうかを js がどのように判断するかについてのこの記事はこれで終わりです。より関連性の高い js 判断 utf-8 コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
<<: mysql5.6.zip形式の圧縮版インストールグラフィックチュートリアル
>>: Centos Docker ブリッジ モードでホスト Redis サービスにアクセスできないというトラブルシューティングの経験
目次序文入力ボックスコンポーネントレイアウトvモデルデータ検証ルール設計形状サブコンポーネントは検証...
「初心者向けソースコードからの MySQL デッドロック問題の理解」では、MySQL ソースコードを...
ドロップテーブルドロップはテーブル情報を直接削除するため、最も高速ですが、データを取得することはでき...
vue3.0 への最初の試みを記録します。プロジェクトを開始したときに、「モジュール 'wo...
最初のステップは、対応するデータベースモジュール(sql)をプロジェクトファイル( .pro )に追...
目次1. 本来の定義2. JS操作、幅の変更を例に3. 効果: 幅が変更されました 1. 本来の定義...
今日はベテランの貴重な経験を共有します。著者は技術管理の経験が7年あり、多い時は80人以上を率いてい...
Linux の seq コマンドは、数字のリストを非常に高速に生成でき、使いやすく柔軟性に優れてい...
この記事の例では、カルーセルカルーセルを実装するためのJSの具体的なコードを参考までに共有しています...
Vueはブール値でストレージを保存します今日、問題に遭遇しました。バックグラウンドから返された真偽の...
異なるブラウザ間でページの表示を一致させるためには、フロントエンド開発において CSS スタイルのク...
今日、redis をインストールしたところ、今までになかったいくつかのエラーが発生しました。ここで記...
この記事では、WeChatアプレットで星評価を実装するための具体的なコードを参考までに紹介します。具...
Vue+iview メニューとタブのリンク現在、vue+iview を使用してバックエンド管理システ...
リバースプロキシリバースプロキシとは、プロキシサーバーを介してユーザーのアクセス要求を受信し、ユーザ...