Ошибка CORS: превращение файла CSV в массив Javascript

Question

Я пытаюсь преобразовать файл CSV в массив javascript. В файле CSV все значения находятся в отдельных строках. В любом случае, я нашел этот фрагмент кода в другом посте в Stackoverflow, чтобы превратить этот файл в массив:

var adressesList = []

  $(document).ready(function() {
    $.ajax({
      type: "GET",
      url: "Filepath",
      dataType: "text",
      success: function(data) {
        processData(data);
      }
    });
  });

  function processData(allText) {
    var allTextLines = allText.split(/\r\n|\n/);
    for (var i = 1; i < allTextLines.length; i++) {
      adressesList.push(allTextLines[i]);
    }
  }

Я пробовал это, но постоянно получаю сообщение об ошибке, сообщающее, что у меня нет доступа к файл (он локальный на моем компьютере в той же папке, что и код).

Это ошибка, которую я вижу:

Access to XMLHttpRequest at 'filepat' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

GET filepath net::ERR_FAILED

Как я могу ее решить? Я видел, что вы можете поместить файл на сервер. Но разве не должен быть простой способ сделать это локально?

Спасибо.

Answer 1

Если вам нужно только одноразовое решение, работающее локально, вам может быть проще загрузить и обработать этот файл с помощью Файловый API .

Пример:

function handleFiles(files) {
  getAsText(files[0])
}

function getAsText(fileToRead) {
  const reader = new FileReader()
  reader.readAsText(fileToRead)
  reader.onload = (event) => processData(event.target.result)
}

function processData(allText) {
  console.log(allText)
  // do your processing below
  var allTextLines = allText.split(/\r\n|\n/)
  for (var i = 1; i < allTextLines.length; i++) {
   adressesList.push(allTextLines[i]);
  }
}

<input type="file" onchange="handleFiles(this.files)" accept=".csv">

Answer 2

Если файл имеет статус c (вы пишете его один раз, и он остается прежним), то вы можете экспортировать его как константу, и вам не нужно будет использовать ajax. Подробнее о том, как это сделать, можно узнать здесь: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export

Если файл динамический c и со временем изменится, вам нужно будет поместить его на веб-сервер, который вы можете запросить файл, часто называемый «конечной точкой». Если вы находитесь в другом домене (скажем, сервер находится на foo.com, а ваш сайт на bar.com), вам нужно добавить разрешение в настройках сервера, чтобы разрешать запросы от других доменов.