Я пытаюсь прочитать текстовый файл с помощью jquery, например:
// LOAD file and split line by line and append divs
$.get('myFile.txt', function(data) {
var lines = data.split("\n");
$.each(lines, function(n, elem) {
$('#myContainer').append('<div>' + elem + '</div>');
});
});
В хром я получаю:
XMLHttpRequest cannot load file:///C:/myPath/myFile.txt. Origin null is not allowed by Access-Control-Allow-Origin.
Firefox не показывает ошибки, но код не выполняется (у меня есть точки останова в firebug, и анонимная функция никогда не запускается).
Любая помощь оценивается!
ИЗМЕНИТЬ
пришлось:
теперь он работает нормально!
Вы не можете загрузить файл из своей локальной файловой системы, например, вам нужно разместить его на веб-сервере и загрузить его оттуда. На том же сайте, на котором загружен JavaScript.
РЕДАКТИРОВАТЬ: Посмотрите на thread, вы можете запустить chrome с помощью опции --allow-file-access-from-files, которая разрешит доступ к локальным файлам.
укажите полный путь к файлу url
Это нормально работает в firefox по крайней мере.
Проблема, с которой я столкнулась, заключается в том, что я получил объект XML вместо простой текстовой строки. Чтение xml файла с моего локального диска отлично работает (тот же каталог, что и html), поэтому я не понимаю, почему проблема с чтением текстового файла была проблемой.
Я понял, что мне нужно сообщить jquery, чтобы передать строку вместо XML-объекта. Это то, что я сделал, и он, наконец, работал:
function readFiles()
{
$.get('file.txt', function(data) {
alert(data);
}, "text");
}
Обратите внимание на добавление "текста" в конце. Это сообщает jquery передать содержимое файла file.txt в виде строки вместо объекта XML. В окне предупреждения появится содержимое текстового файла. Если вы удалите "текст" в конце, в поле предупреждения появится "XML-объект".
этот работает
$.get('1.txt', function(data) {
//var fileDom = $(data);
var lines = data.split("\n");
$.each(lines, function(n, elem) {
$('#myContainer').append('<div>' + elem + '</div>');
});
});
Обходной путь для этого я использовал для включения данных в виде js файла, который реализует функцию, возвращающую необработанные данные в виде строки:
<!DOCTYPE html>
<html>
<head>
<script src="script.js"></script>
<script type="text/javascript">
function loadData() {
// getData() will return the string of data...
document.getElementById('data').innerHTML = getData().replace('\n', '<br>');
}
</script>
</head>
<body onload='loadData()'>
<h1>check out the data!</h1>
<div id='data'></div>
</body>
</html>
// function wrapper, just return the string of data (csv etc)
function getData () {
return 'look at this line of data\n\
oh, look at this line'
}
Смотрите здесь в действии - http://plnkr.co/edit/EllyY7nsEjhLMIZ4clyv?p=preview
Недостатком является то, что вам нужно выполнить некоторую предварительную обработку файла для поддержки многострочных (добавьте каждую строку в строку с помощью '\n\').
Это не работает, и это не должно быть потому, что это будет гигантская дыра в безопасности.
Посмотрите на новый API файловой системы. Он позволяет запрашивать доступ к виртуальной, изолированной файловой системе, управляемой браузером. Вам придется попросить вашего пользователя "загрузить" свой файл в изолированную файловую систему один раз, но впоследствии вы сможете работать с ним очень элегантно.
Хотя это определенно будущее, оно все еще очень экспериментально и работает только в Google Chrome, поскольку CanIUse знает.
Пока файл не требуется динамически генерировать, например, простой текстовый или html файл, вы можете протестировать его локально БЕЗ веб-сервера - просто используйте относительный путь.
Если вы включите поле ввода файла, вы можете получить доступ к файлу в виде строки в кодировке base64 с помощью объекта FileReader. Если это текстовый файл, то для получения текста будет работать простое декодирование base64.
Предполагая следующий HTML:
<input type="file" id="myfile" />
Вы можете получить доступ, используя следующий JQuery JS:
var file = $('#myfile').get(0).files[0];
var reader = new FileReader();
reader.onload = function (e) {
//get the file result, split by comma to remove the prefix, then base64 decode the contents
var decodedText = atob(e.target.result.split(',')[1]);
//show the file contents
alert(decoded);
};
reader.readAsDataURL(file);
Вы не можете сделать это без WEB-SERVER!!!. Chrome отправляет XMLHttpRequest в систему, которая выглядит примерно так.
GET /myFile.txt HTTP/1.1
И операционная система не слушает порт 80, чтобы получить это! И даже если это так, он должен реализовать HTTP-протокол для связи с браузером...
Чтобы получить эту работу, вы должны установить WEB SERVER в своей системе, которая будет прослушивать порт 80 и делать ваши файлы доступными через HTTP-соединение, тем самым делая ваш код работоспособным.