У меня есть требование, когда я должен прочитать файл и построить данные, используя javascript. Мой файл будет часто обновляться, поэтому мне нужно читать его каждый раз перед построением.
Я написал код, чтобы сделать это один раз, т.е. чтение файла и сохранение данных js переменных.
index. html
<input type="file" id="csvFileInput" onchange="importData(this.files)"accept=".csv">
fileRead. js
<html>
<head>
<meta charset="utf-8" />
<body>
<input type="file" id="csvFileInput" accept=".csv" onchange="importData(this.files)"><br>
<input type="submit" id="Pfit" value="fit">
<script>
var F_load = [];
var v = [];
var csvpoints = [];
function importData(files){
k = files
handleFiles(files);
// plotGraph("div1",F_load, v);
Pfit.disabled = false;
}
function handleFiles(files) {
// Check for the various File API support.
if (window.FileReader) {
// FileReader are supported.
getAsText(files[0]);
} else {
alert('FileReader are not supported in this browser.');
}
}
function getAsText(fileToRead) {
var reader = new FileReader();
// Read file into memory as UTF-8
reader.readAsText(fileToRead);
// Handle errors load
reader.onload = loadHandler;
reader.onerror = errorHandler;
}
function loadHandler(event) {
var csv = event.target.result;
processData(csv);
}
function processData(csv) {
var allTextLines = csv.split(/\r\n|\n/);
var lines = [];
for (var i=1; i<allTextLines.length; i++) {
data = allTextLines[i].split(';');
csvpoints.push(data);
F_load.push(data[0]);
v.push(data[1]);
}
console.log(F_load);
}
function errorHandler(evt) {
if(evt.target.error.name == "NotReadableError") {
alert("Canno't read file !");
}
}
const fitButton=document.getElementById('Pfit');
fitButton.addEventListener('click',event => {
var k = document.getElementById("csvFileInput").file
importData(k)
});
</script>
</body>
</html>
Однако это работает впервые. но когда я попытался получить доступ во второй раз, он получил ошибку getAsText(files[0]);. Может ли кто-нибудь помочь мне в этом. введите описание изображения здесь