1

مساعدة بخصوص قراءة ملفات نصية متعددة بواسطة File System Access API

السلام عليكم...لدي سؤال بخصوص File System Access API

اود من خلال الاداة اعلاه ان اوفر خاصية قراءة ملفات نصية متعددة. قمت بذلك على النحو التالي:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tweet</title>
</head>
<body>
    <button onclick="getFile();">My Butten</button>
    <pre id="textarea" contenteditable></pre>

<script>
let fileHandle;
const pickerOpts = {
    multiple: true
  };
async function getFile() {
    [fileHandle] = await window.showOpenFilePicker(pickerOpts);
    //console.log(fileHandle);
    let fileContent = await fileHandle.getFile();
    let content = await fileContent.text();
    textarea.innerText = content;
}
</script>
</body>
</html>

من خلال الشيفرة اعلاه يمكنني اختيار ملفات متعددة ولكن المشكلة ان الادة تقوم بعرض ملف واحد من الملفات المختارة، بحثت كثيرا ولم اجد حل، قرأت التوثيق الخاص بالأداة فلم استفد كثيرا في ما يخص هذا الامر.

كيف يمكنني الوصول لمحتوى جميع الملفات التي اقوم بإختيارها؟

ملاحظة: اعلم ان هناك طرق اخرى لفعل ذلك ولكنني اود استخدام الاداة اعلاه.

شكرا لكم...

يرجى الدخول لحسابك أو تسجيل حساب لتستطيع إضافة تعليق
حساب جديد دخول

التعليقات

1
waelaljamal أضف ردا

إن showOpenFilePicker يعيد أكثر من ملف عند تمرير multiple وهذا صحيح، نستقبلها بمتغير وهذا المتغير سيكون عبارة عن مصفوفة، ثم علينا المرور بحلقة for مثلا على المصفوفة التي هي مصفوفة ملفات ثم نقرأ كل ملف منها

    <script>
      let fileHandle;
      const pickerOpts = {
        multiple: true,
      };
      async function getFile() {
        fileHandle = await window.showOpenFilePicker(pickerOpts);
        for (f of fileHandle) {   // قراءة ملف في كل مرور
          let fileContent = await f.getFile();
          let content = await fileContent.text();
          textarea.innerText += content + " ";    // تجميع المحتوى
        }
      }
    </script>
0
مجهول أضف ردا

كان هذا سريعاً بشكل مثير للإعجاب... شكرا جزيلا نفع الله بك ووفقك :)