Saya mencoba membuka file dengan

window.open("file:///D:/Hello.txt");

Peramban tidak mengizinkan membuka file lokal dengan cara ini, mungkin karena alasan keamanan. Saya ingin menggunakan data file di sisi klien. Bagaimana saya bisa membaca file lokal dalam JavaScript?

Berikut ini contoh menggunakan FileReader:

function readSingleFile(e) {
  var file = e.target.files[0];
  if (!file) {
    return;
  }
  var reader = new FileReader();
  reader.onload = function(e) {
    var contents = e.target.result;
    displayContents(contents);
  };
  reader.readAsText(file);
}

function displayContents(contents) {
  var element = document.getElementById('file-content');
  element.textContent = contents;
}

document.getElementById('file-input')
  .addEventListener('change', readSingleFile, false);

<input type="file" id="file-input" />
<h3>Contents of the file:</h3>
<pre id="file-content"></pre>

Spesifikasi

http://dev.w3.org/2006/webapi/FileAPI/

Kompatibilitas browser

• IE 10+
• Firefox 3.6+
• Chrome 13+
• Safari 6.1+

http://caniuse.com/#feat=fileapi

Fasilitas fileReader HTML5 memang memungkinkan Anda untuk memproses file lokal, tetapi ini HARUS dipilih oleh pengguna, Anda tidak dapat me-rooting tentang disk pengguna mencari file.

Saat ini saya menggunakan ini dengan versi pengembangan Chrome (6.x). Saya tidak tahu apa yang didukung browser lain.

Karena saya tidak memiliki kehidupan dan saya ingin 4 poin reputasi tersebut sehingga saya dapat menunjukkan cintaku kepada (meningkatkan jawaban oleh) orang-orang yang benar-benar pandai dalam pengkodean, saya telah membagikan adaptasi saya terhadap kode Paolo Moretti . Cukup gunakan openFile(fungsi yang akan dieksekusi dengan konten file sebagai parameter pertama) .

function dispFile(contents) {
  document.getElementById('contents').innerHTML=contents
}
function clickElem(elem) {
	// Thx user1601638 on Stack Overflow (6/6/2018 - /programming/13405129/javascript-create-and-save-file )
	var eventMouse = document.createEvent("MouseEvents")
	eventMouse.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
	elem.dispatchEvent(eventMouse)
}
function openFile(func) {
	readFile = function(e) {
		var file = e.target.files[0];
		if (!file) {
			return;
		}
		var reader = new FileReader();
		reader.onload = function(e) {
			var contents = e.target.result;
			fileInput.func(contents)
			document.body.removeChild(fileInput)
		}
		reader.readAsText(file)
	}
	fileInput = document.createElement("input")
	fileInput.type='file'
	fileInput.style.display='none'
	fileInput.onchange=readFile
	fileInput.func=func
	document.body.appendChild(fileInput)
	clickElem(fileInput)
}

Click the button then choose a file to see its contents displayed below.
<button onclick="openFile(dispFile)">Open a file</button>
<pre id="contents"></pre>

Mencoba

function readFile(file) {
  return new Promise((resolve, reject) => {
    let fr = new FileReader();
    fr.onload = x=> resolve(fr.result);
    fr.readAsText(file);
})}

tetapi pengguna perlu mengambil tindakan untuk memilih file

function readFile(file) {
  return new Promise((resolve, reject) => {
    let fr = new FileReader();
    fr.onload = x=> resolve(fr.result);
    fr.readAsText(file);
})}

async function read(input) {
  msg.innerText = await readFile(input.files[0]);
}

<input type="file" onchange="read(this)"/>
<h3>Content:</h3><pre id="msg"></pre>

Metode permintaan xmlhttp tidak valid untuk file di disk lokal karena keamanan browser tidak memungkinkan kami melakukannya. Tapi kami dapat mengganti keamanan browser dengan membuat pintasan-> klik kanan-> properti Pada target "... browser location path.exe "append --allow-file-access-from-files. Ini diuji pada chrome, namun harus diperhatikan bahwa semua jendela browser harus ditutup dan kode harus dijalankan dari browser yang dibuka melalui pintasan ini.

Kamu tidak bisa Browser baru seperti Firefox, Safari dll. Memblokir protokol 'file'. Ini hanya akan berfungsi pada browser lama.

Anda harus mengunggah file yang Anda inginkan.

Javascript biasanya tidak dapat mengakses file lokal di browser baru tetapi objek XMLHttpRequest dapat digunakan untuk membaca file. Jadi sebenarnya Ajax (dan bukan Javascript) yang sedang membaca file.

Jika Anda ingin membaca file abc.txt, Anda dapat menulis kode sebagai:

var txt = '';
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
  if(xmlhttp.status == 200 && xmlhttp.readyState == 4){
    txt = xmlhttp.responseText;
  }
};
xmlhttp.open("GET","abc.txt",true);
xmlhttp.send();

Sekarang txtberisi konten file abc.txt.