XMLHttpRequest Origin null не разрешен Access-Control-Allow-Origin для файла: /// для файла: /// (без сервера)

204

Я пытаюсь создать веб-сайт, который можно загрузить и запустить локально, запустив его индексный файл.

Все файлы локальны, ресурсы не используются в Интернете.

Когда я пытаюсь использовать плагин AJAXSLT для jQuery для обработки XML файла с помощью XSL-шаблона (в подкаталогах), я получаю следующие ошибки:

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/data/home.xml. Origin null is not allowed by Access-Control-Allow-Origin.

XMLHttpRequest cannot load file:///C:/path/to/XSL%20Website/assets/xsl/main.xsl. Origin null is not allowed by Access-Control-Allow-Origin.

Индексный файл, создающий запрос, file:///C:/path/to/XSL%20Website/index.html, в то время как используемые файлы JavaScript хранятся в file:///C:/path/to/XSL%20Website/assets/js/.

Как я могу это исправить?

Теги:
xmlhttprequest
xslt
cors
cross-domain-policy

8 ответов

174
Лучший ответ

В случаях, когда запуск локального веб-сервера не является вариантом, вы можете разрешить доступ Chrome к файлам file:// через переключатель браузера. После некоторого рытья я нашел это обсуждение, в котором упоминается переключатель браузера в открывшемся сообщении. Запустите экземпляр Chrome с помощью:

chrome.exe --allow-file-access-from-files

Это может быть приемлемым для сред разработки, но немного больше. Вы, конечно, не хотите этого постоянно. Это по-прежнему выглядит открытым (с января 2011 года).

См. также: Проблемы с jQuery getJSON с использованием локальных файлов в Chrome

  • 4
    Спасибо, это просто упростило мою разработку.
  • 1
    @Rich, рад, что это помогло! Интересно, будет ли повышенный спрос на это с толчком Google к браузерным приложениям? Я думаю, что спрос будет только расти.
Показать ещё 4 комментария
82

По сути, единственный способ справиться с этим - иметь веб-сервер, работающий на локальном хосте и обслуживать его оттуда.

Небезопасно, чтобы браузер разрешал ajax-запросу получать доступ к любому файлу на вашем компьютере, поэтому большинство браузеров, похоже, обрабатывают запросы "file://" как имеющие никакого происхождения для цели " Одинаковая политика происхождения"

Запуск веб-сервера может быть таким же тривиальным, как cd ing в каталог, в котором находятся файлы:

python -m SimpleHTTPServer
  • 1
    Я надеюсь разработать решение, которое не требует от пользователя использования чего-либо большего, чем его веб-браузер. Использование Python, любого интерпретатора или любого несистемного программного обеспечения нежизнеспособно.
  • 5
    Ну, единственное другое решение, которое я могу придумать, - это загрузить все это на одной странице, чтобы вам не нужно было делать какие-либо запросы ajax в файловую систему.
Показать ещё 3 комментария
4

Как насчет использования javascript FileReader для открытия локального файла, то есть:

<input type="file" name="filename" id="filename">
<script>
$("#filename").change(function (e) {
  if (e.target.files != undefined) {
    var reader = new FileReader();
    reader.onload = function (e) {
        // Get all the contents in the file
        var data = e.target.result; 
        // other stuffss................            
    };
    reader.readAsText(e.target.files.item(0));
  }
});
</script>

Теперь нажмите кнопку Choose file и перейдите к файлу file:///C:/path/to/XSL%20Website/data/home.xml

  • 0
    Это сработало для меня. Очень хорошо!
4

Это решение позволит вам загрузить локальный script с помощью jQuery.getScript(). Это глобальная настройка, но вы также можете установить параметр crossDomain для каждого запроса.

$.ajaxPrefilter( "json script", function( options ) {
  options.crossDomain = true;
});
  • 0
    работал как талисман для загрузки локального файла JS из локального файла HTML! спасибо, именно то, что мне было нужно.
4

Вот яблоко, которое запустит Chrome с включенным переключателем --allow-file-access-from-files, для разработчиков OSX/Chrome:

set chromePath to POSIX path of "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"    
set switch to " --allow-file-access-from-files"
do shell script (quoted form of chromePath) & switch & " > /dev/null 2>&1 &"
  • 14
    Вы можете просто использовать open (1) для добавления флагов: open -a 'Google Chrome' --args --allow-file-access-from-files .
3

Запустите хром, чтобы обойти это ограничение: open -a "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --args --allow-file-access-from-files.

Вывод из комментария Джоша Ли, но мне нужно было указать полный путь к Google Chrome, чтобы избежать открытия Google Chrome из моего раздела Windows (в Parallels).

1

Способ, которым я только что работал, заключается не в том, чтобы использовать XMLHTTPRequest вообще, но вместо этого включать данные, необходимые в отдельный файл javascript. (В моем случае мне понадобился бинарный SQLite blob для использования с https://github.com/kripken/sql.js/)

Я создал файл с именем base64_data.js (и использовал btoa() для преобразования необходимых мне данных и вставки в <div>, чтобы я мог его скопировать).

var base64_data = "U1FMaXRlIGZvcm1hdCAzAAQA ...<snip lots of data> AhEHwA==";

а затем включил данные в html, как обычный javascript:

<div id="test"></div>

<script src="base64_data.js"></script>
<script>
    data = atob(base64_data);
    var sqldb = new SQL.Database(data);
    // Database test code from the sql.js project
    var test = sqldb.exec("SELECT * FROM Genre");
    document.getElementById("test").textContent = JSON.stringify(test);
</script>

Я предполагаю, что было бы тривиально модифицировать это, чтобы читать JSON, возможно, даже XML; Я оставлю это как упражнение для читателя;)

1

Вы можете попробовать поставить 'Access-Control-Allow-Origin':'*' в response.writeHead(, {[here]}).

  • 6
    откуда берется response.writeHead, как его назвать и где? Можете ли вы привести больше примеров? Имейте в виду, что это локальная файловая система, а не сервер. Насколько я понимаю, это значение может быть установлено только с сервера?

Ещё вопросы

Сообщество Overcoder
Наверх
Меню