Вопрос по file, http, javascript – «Перекрестные запросы поддерживаются только для HTTP». Ошибка при загрузке локального файла

700

Я пытаюсь загрузить 3D-модель в Three.js с помощьюJSONLoader и эта 3D-модель находится в том же каталоге, что и весь веб-сайт.

Я получаю"Cross origin requests are only supported for HTTP." ошибка, но я не знаю, что вызвало это и как это исправить.

Если вы используете Chrome, вам может помочь запуск с терминала с параметром --allow-file-access-from-files. nickiaconis
Вам нужно использовать localhost, даже если его локальный файл Neil
Да, это не совсем междоменный домен, когда файл находится в той же папке, что и веб-страница, а теперь ... Я обнаружил, что если вы используете Firefox вместо Chrome, проблема исчезнет. Sphinxxx
Ты пытаешься сделать это локально? WojtekT
Но это не кросс-домен! corazza

Ваш Ответ

22   ответа
13

чтобы разрешить JavaScript иметь доступ к ресурсам черезfile:///android_asset/ - использоватьsetAllowFileAccessFromFileURLs(true) наWebSettings что ты получаешь от звонкаgetSettings() наWebView.

Brilliant! Мы как раз собирались переписать методы для внедрения JSON в переменные ... но это работает! webView.getSettings () setAllowFileAccessFromFileURLs (истинные);. WallyHale
712

file:// илиC:/, который остается верным сообщению об ошибке, поскольку они не являютсяhttp://

Так что вы можете либо установить веб-сервер на локальном ПК, либо загрузить модель в другое место и использоватьjsonp и измените URL наhttp://example.com/path/to/model

Да, я пытаюсь сделать это с помощьюfile://, но я не понимаю, почему это разрешено. Ну, я устанавливаю Lampp, я думаю ... corazza
Представьте, если это разрешено, и веб-приложение, в котором автор страницы использует что-то вродеload('file://C:/users/user/supersecret.doc') и затем загрузите контент на свой сервер, используя ajax и т. д. Andreas Wong
к сожалению, политика разработана для всех случаев, а не только для вас :(, так что вы должны иметь с этим Andreas Wong
В вики GitHub есть страница на эту тему: Github.com / mrdoob / Three.js / вики / Как-работай-вещи локально Felipe Lima
Вы также можете использовать переключатель --allow-file-access-from-files в chrome. За мой ответ здесь: / Stackoverflow.com вопросы / 8449716 / ... prauchfuss
544

ошибка говорит о том, что вы не можете направить свой браузер непосредственно наfile://some/path/some.html

Вот несколько вариантов быстрого раскрутки локального веб-сервера, чтобы ваш браузер отображал локальные файлы

Python 2

Если у тебя установлен Python ...

Измените каталог в папку, где находится ваш файлsome.html или файл (ы) существуют с помощью командыcd /path/to/your/folder

Запустите веб-сервер Python с помощью командыpython -m SimpleHTTPServer

Это запустит веб-сервер для размещения всего списка каталогов наhttp://localhost:8000

Вы можете использовать собственный портpython -m SimpleHTTPServer 9000 давая вам ссылку:http://localhost:9000

Этот подход встроен в любую установку Python.

Python 3

Сделайте те же шаги, но вместо этого используйте следующую командуpython3 -m http.server

Node.js

В качестве альтернативы, если вам требуется более гибкая настройка и вы уже используете nodejs ...

Installhttp-server набравnpm install -g http-server

Перейдите в свой рабочий каталог, где вашsome.html жизн

Запустите ваш http-сервер, введяhttp-server -c-1

Это раскручивает httpd Node.js, который обслуживает файлы в вашем каталоге как статические файлы, доступные изhttp://localhost:8080

Руби

Если вы предпочитаете язык Ruby ... Боги Ruby говорят, что это тоже работает:

ruby -run -e httpd . -p 8080
PHP

Конечно, PHP также имеет свое решение.

php -S localhost:8000
Это спасло мне кучу времени, спасибо. В моей установке Python не было модуля SimpleHTTPServer, но инструкции узла работали как чудо. LukeP
В ответ на комментарий LukeP, в python 2.7 команда работает согласно инструкциям$ python -m SimpleHTTPServer, который выдает сообщение:Serving HTTP on 0.0.0.0 port 8000 ... Если вы неправильно написали название модуля, например,$ python -m SimpleHttpServer тогда вы получите сообщение об ошибкеNo module named SimpleHttpServer Вы получите похожее сообщение об ошибке, если у вас установлен python3 (v. Python 2.7). Вы можете проверить свою версию python с помощью команды:$ python --version. Вы также можете указать порт для прослушивания следующим образом:$ python -m SimpleHTTPServer 3333 7stud
Python-сервер обслуживает файлы из каталога, в котором вы запускаете сервер. Таким образом, если файлы, которые вы хотите обслуживать, находятся в / Users / 7stud / angular_projects / 1app, запустите сервер в этом каталоге, например,$ cd ~/angular_projects/1app, тогда$ python -m SimpleHTTPServer. В вашем браузере введите URLhttp://localhost:8000/index.html. Вы также можете запросить файлы в подкаталогах каталога, в котором вы запустили сервер, например,http://localhost:8000/subdir/hello.html 7stud
Я слышал, что Python простой и мощный, как и язык "X", но это нелепо! Не нужно устанавливать XAMPP или настраивать простой http-сервер js с узлом для обслуживания статических файлов - одна команда и бум! Большое спасибо, экономит много времени и хлопот. R.D.
ЗДОРОВО! - для Python в Windows используйте: python -m http.server 8080 ... или любой другой порт, который вы хотите, и когда вы хотите выйти из него, просто ctrl-c. Kristopher
151

--allow-file-access-from-files

Прочитайте больше здесь.

Это не работает с кофе-скриптом. Blairg23
@ Blairg23, имейте в виду, что это решение требует перезапуска всех экземпляров Chrome.exe для его работы Alex Klaus
Пожалуйста, объясните, как использовать его в Chrome. Rishabh Agrahari
@ Прия не должна этого делать, хотя Suraj Jain
Я бы предложил использовать Chromium только для локальной отладки (начиная с флага--allow-file-access-from-files). Это означает использование Chrome для обычного просмотра веб-страниц и использование Chromium в качестве приложения по умолчанию для файла HTML. Alan Zhiliang Feng
57

Я написал код, который выглядел так:

app.controller('ctrlr', function($scope, $http){
    $http.get('localhost:3000').success(function(data) {
        $scope.stuff = data;
    });
});

... но это должно было выглядеть так:

app.controller('ctrlr', function($scope, $http){
    $http.get('http://localhost:3000').success(function(data) {
        $scope.stuff = data;
    });
});

Единственным отличием было отсутствиеhttp:// во втором фрагменте кода.

Просто хотел это показать, если есть другие с похожей проблемой.

32

http://localhost вместо тогоlocalhost. Если вы открываете html-файл из локального файла, вам нужно создать локальный сервер для обслуживания этого html-файла, самый простой способ - использоватьWeb Server for Chrome. Это решит проблему.

+ 1 дляWeb Server for Chrome app link - это, безусловно, самое простое и чистое решение для временной настройки httpd для Chrome IMO vaxquis
11

кто работает в Windows без Python или Node.js, есть простое решение:Мангуст.

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

Также, Z-WAMP - это 100% портативный WAMP, который работает в одной папке, это круто. Это вариант, если вам нужен быстрый сервер PHP и MySQL.

Если вы установили php или установили, вы можете запустить сервер в своей папке: Php.net / ручной / эс / features.commandline.webserver.php jechaviz
10

P.S. Даже IE_Edge работает отлично, на удивление !!

8

3 разных подхода чтобы решить эту проблему:

Использую очень легкийnpm пакет: Установить Жить-сервер с помощьюnpm install -g live-server. Затем перейдите в этот каталог, откройте терминал и введитеlive-server и нажмите Enter, страница будет отображаться наlocalhost:8080. БОНУС: Он также поддерживает горячую перезагрузку по умолчанию. Используя легкий Google Chromeприложени разработано Google: Затем установите приложение, перейдите на вкладку приложений в Chrome и откройте приложение. В приложении укажите нужную папку. Ваша страница будет обслуживаться! Модификация ярлыка Chrome в Windows: Создать ярлык браузера Chrome. Щелкните правой кнопкой мыши значок и откройте свойства. В свойствах отредактируйтеtarget в"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security --user-data-dir="C:/ChromeDevSession" и сохранить. Затем с помощью Chrome откройте страницу с помощьюctrl+o. ПРИМЕЧАНИЕ: делатьН используйте этот ярлык для регулярного просмотра.
6

http:// илиhttps:// чтобы создать URL

ошибк: localhost:8080

решени: http://localhost:8080

4

для пользователей Windows запустить ваш файл на Firefox проблема решена, или если вы хотите использовать Chrome, проще всего было установить Python 3, а затем из командной строки выполнить командуpython -m http.server тогда иди кhttp: // локальный: 8000 / затем перейдите к своим файлам

python -m http.server
3

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

3

ий на локальном хосте (если вы не используете какой-либо встроенный сервер).

Вот тот, который очень прост в настройке и запуске:

https://www.npmjs.com/package/tiny-server
3

что это уже упоминалось в некоторых ответах, но я немного изменю это, чтобы получить полный рабочий ответ (его легче найти и использовать).

Перейти к:https: //nodejs.org/en/download. Установите nodejs.

Установите http-сервер, запустив команду из командной строкиnpm install -g http-server.

Перейдите в свой рабочий каталог, гдеindex.html/yoursome.html проживает.

Запустите ваш http-сервер, введя командуhttp-server -c-1

Откройте веб-браузер наhttp://localhost:8080 илиhttp://localhost:8080/yoursome.html - в зависимости от вашего имени файла HTML.

2

что приложение должно быть запущено на веб-сервере. У меня была такая же проблема с chrome, я запустил tomcat и переместил туда свое приложение, и оно сработало.

0

«Попытка загрузить не собранные, удаленные модули AMD, использующие плагин dojo / text, завершится неудачей из-за ограничений безопасности из разных источников. (Встроенные версии модулей AMD не затрагиваются, поскольку вызовы dojo / text устраняются система сборки.) "https: //dojotoolkit.org/documentation/tutorials/1.10/cdn

0

роекта, а не вне папки проекта. Создайте одну папку под файлами примеров вашего проекта, аналогично тому, как мы создаем изображения, и замените раздел, в котором используется полный локальный путь, отличный от пути проекта, и используйте относительный URL-адрес файла в папке проекта. У меня сработало

0

MacOS ... настроить простой LaunchAgent, чтобы включить эти очаровательные возможности в вашей собственной копииХро ...

Оставьplist, названныйбез разниц (launch.chrome.dev.mode.plist, например) в~/Library/LaunchAgents с содержанием, аналогичным ...

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Label</key>
    <string>launch.chrome.dev.mode</string>
    <key>ProgramArguments</key>
    <array>
        <string>/Applications/Google Chrome.app/Contents/MacOS/Google Chrome</string>
        <string>-allow-file-access-from-files</string>
    </array>
    <key>RunAtLoad</key>
    <true/>
</dict>
</plist>

Этодолже запускать при запуске .. но вы можете сделать это в любое время с помощью команды терминала

launchctl load -w ~/Library/LaunchAgents/launch.chrome.dev.mode.plist

TADA

0
Установите локальный веб-сервер для Java, например Tomcat, для PHP вы можете использовать лампу и т. Д. Вставьте файл json в общедоступную директорию сервера приложений

Запустите сервер приложений, и вы сможете получить доступ к файлу с localhost

0

привязки со следующим href:

<a href="javascript:">Example a tag</a>

В моем случае для получения «указателя курсора» использовался тег, а событие фактически контролировалось каким-то jQuery при событии click. Я удалил href и добавил класс, который применяется:

cursor:pointer;

0

svg) без сервера. Если на вашем компьютере установлен NPM / YARN, вы можете настроить простой http-сервер, используя " HTTP-сервер"

npm install http-server -g
http-server [path] [options]

Или откройте терминал в этой папке проекта и введите «hs». Это автоматически запустит HTTP живой сервер.

дубликат ответа Scott Stensland
-1

/' пример: jquery-1.10.2.js: 8720 XMLHttpRequest не может загрузитьhttp: // локальный: xxxProduct / getList_tagLabels / Это должно быть:http: // локальный: ххх / продукта / getList_tagLabels /

Надеюсь, это поможет тем, кто столкнулся с этой проблемой.

Похожие вопросы