Javascript nhận đường dẫn tệp cục bộ

Như bạn có thể thấy, cả hai đều hoạt động khác nhau;

Gói hệ thống tệp để đọc tệp trên máy tính để bàn của bạn

Gói hệ thống tệp đi kèm với môi trường nút mặc định cho các chương trình JavaScript được lưu trữ cục bộ. Tuy nhiên, bạn vẫn cần đưa gói Hệ thống tệp vào mã javascript của mình bằng cách sử dụng từ khóa bắt buộc. Sau đó, hàm readFile() có trong gói này cho phép bạn đọc dữ liệu từ một tệp

Cú pháp của phương thức readFile()
Cú pháp của phương thức readFile() là

FileSystemVar. readFile( PathToTheFile , Tùy chọn , CallbackFunction);

Các chi tiết của cú pháp này là như

• FileSystamVar. Đây là biến đã được đặt bằng gói hệ thống tập tin yêu cầu
• Đường dẫn đến tập tin. Đây là đường dẫn đến tệp mà bạn muốn đọc
• Tùy chọn. Đây là các tùy chọn tùy chọn có thể lọc mã hóa và các thuộc tính khác của tệp
• Chức năng gọi lại. Hàm gọi lại sẽ được thực thi khi đọc thành công tệp

ví dụ 1. Đọc tệp với Gói hệ thống tệp

Bắt đầu bằng cách tạo một tệp văn bản mới trên máy tính của bạn và đặt một số văn bản bên trong nó như

Sau đó, vào bên trong tệp javascript của bạn và bao gồm gói hệ thống tệp bằng cách sử dụng từ khóa yêu cầu

const fs = yêu cầu ("fs");

Sau đó sử dụng các dòng sau

fs. readFile("demo. txt", ( err , data) => {
  nếu ( err ) throw err;

  bảng điều khiển. log( dữ liệu. toString());
});

Các bước sau đây đang được thực hiện trong đoạn mã được đề cập ở trên

• Đọc file “demo. txt”
• Nếu có lỗi thì ném thông báo lỗi đó vào thiết bị đầu cuối
• Trường hợp không có lỗi thì lưu dữ liệu đọc được từ tệp vào biến dữ liệu
• In nội dung của biến dữ liệu sau khi chuyển thành chuỗi bằng phương thức toString()

Khi thực thi mã, bạn sẽ quan sát đầu ra sau trên thiết bị đầu cuối của mình

Dữ liệu từ tệp đã được in lên thiết bị đầu cuối

API Web FileReader để đọc tệp trên trang web HTML

File reader API only works with HTML web pages, and one of the restrictions of this API is that it works on the files that have been read by tag. It has multiple functions that allow the user to read the file in different encodings.

ví dụ 2. Đọc tệp văn bản cục bộ từ trang web HTML

Bắt đầu bằng cách thiết lập một trang web HTML, để sử dụng các dòng sau

< trung tâm >
        < loại đầu vào ="tệp" name="inputFileToRead" id="inputFileToRead" />
      < br />
trung tâm>center>

Bạn sẽ nhận được trang web sau trên trình duyệt của mình

Sau đó, đi tới tệp javascript và viết ra những dòng mã sau

tài liệu. getElementById("inputFileToRead")
  .addEventListener("thay đổi", function () {
    var fr = new FileReader();
    fr. readAsText(này . tệp[0]);
    fr. đang tải = chức năng () {
    bảng điều khiển. log( fr. kết quả);
    };  
  });

Các bước sau đây đang được thực hiện trong đoạn mã được đề cập ở trên

• An action listener is being applied on your with the id “inputFileToRead”
• Sau đó, một đối tượng của trình đọc tệp (fr) đã được tạo bằng hàm tạo FileReader()
• Then the first file on the is being read as a text using the fr variable
• Sau khi đọc thành công tệp, dữ liệu đang được in trên bảng điều khiển

Để chứng minh điều này, hãy chọn cùng một tệp đã được chọn trong ví dụ đầu tiên và bạn sẽ nhận được kết quả sau trên bảng điều khiển của trình duyệt của mình

Kết quả cho thấy tệp đã được đọc thành công bởi trang web HTML

Phần kết luận

Để đọc tệp văn bản được đặt cục bộ, chúng tôi có hai tùy chọn. để tải tệp trong HTML hoặc để đọc tệp đó trong chương trình javascript trên máy tính để bàn của bạn. Đối với điều này, bạn có API Web Trình đọc tệp cho các trang web và gói hệ thống tệp cho JavaScript trên máy tính để bàn. Về cơ bản, cả hai đều thực hiện cùng một hoạt động. đọc một tập tin văn bản. Trong hướng dẫn này, bạn đã sử dụng hàm readFile() từ gói Hệ thống tệp và readFileAsText() từ API Web Trình đọc tệp

Làm cách nào để có được đường dẫn cục bộ trong JavaScript?

JavaScript có thể truy cập tệp cục bộ không?

Làm cách nào để chỉ định đường dẫn tệp trong JavaScript?

Làm cách nào để đọc tệp văn bản cục bộ trong JavaScript?