NorouziFar Ответов: 4

Как исправить кросс-исходные запросы поддерживаются только для схем протоколов: http, data, chrome, chrome-extension, https

привет
я использую блокнот для практики HTML, JQuery и Json
мой HTML
<pre><!DOCTYPE html>
<html lang="en">

<head>
    <title>گالری سگ ها</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="css/style.css" rel="stylesheet">

</head>

<body>
    <div id="menu">
        <button href="json.json">json</button>

    </div>
    <div id="frame">

    </div>

    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="js/main.js"></script>
</body>

</html>



мой css:
* {
    font-family: 'Times New Roman', Times, serif;
    font-size: 100%;
    margin: 0;
    padding: 0;
    font-weight: normal;
    font-style: normal;
    box-sizing: border-box;
}

.clear:after {
    clear: both;
    display: table;
    content: "";
}

.clear {
    zoom: 1;
}

ul,
ol,
li {
    list-style: none;
    display: block;
}

div {
    display: block;
    margin: 0px;
    padding: 0px;
}

a {
    display: block;
    text-decoration: none;
}

body {
    background-color: #fff;
}

#menu {
    width: 75%;
    margin: auto;
    background-color: yellow;
}

#menu button {
    border: 2px solid blue;
    color: white;
    background-color: blue;
    margin: 3px;
    padding: 8px;
}

#frame {
    width: 75%;
    height: 700px;
    border: 1px solid black;
    margin: auto;
}

мой json файл находится в том же каталоге Html файла :
{
    "employees": [
        { "firstName": "John", "lastName": "Doe" },
        { "firstName": "Anna", "lastName": "Smith" },
        { "firstName": "Peter", "lastName": "Jones" }
    ]
}


и мой код Jquer:
$(Document).ready(function() {

    $('#menu button').click(function() {
        var linked = $(this);
        var textlinked = linked.attr('href');

        $.ajax({
            url: textlinked,
            success: function() {
                alert();
            }
        });

        return false;
    });

});


когда я запускаю свой индексный файл, я получаю ошибку :
jquery-3.2.1.min.js:4 XMLHttpRequest cannot load file:///C:/Users/PC-01/Desktop/vs%20code/HtmlCSS/json.json. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.




Как я могу решить эту ошибку

Что я уже пробовал:

я не знаю, что я могу сделать для этой проблемы

F-ES Sitecore

Вам нужно будет создать веб-сайт в IIS, разместить там свои файлы и получить к ним доступ через http, например

http://localhost/mysite

4 Ответов

Рейтинг:
29

Richard Deeming

Браузер Firefox[^] позволит вам делать запросы AXAJ с помощью file: протокол, если страница была загружена с помощью file: протокол.

Chrome, однако, блокирует это по умолчанию. Чтобы включить его, вам нужно запустить Chrome из командной строки, указав --allow-file-access-from-files флаг.

javascript - AJAX запрос к локальной файловой системе не работает в Chrome? - переполнение стека[^]
Как установить флажок Разрешить доступ к файлам из файлов в Google Chrome для Windows[^]

NB: Вы должны включить эту функцию только тогда, когда тестируете свой собственный код. Как только вы закончите, закройте Chrome и перезапустите его без флага.

Member 14940365

Нужно ли это обновлять: у меня это не сработало.

Richard Deeming

Похоже, Firefox обработал все file: URL-адреса как уникальные источники начиная с версии v68:
1500453 - обработка файла: URI как уникального источника[^]

Похоже, что Chrome, возможно, отключил флаг командной строки в v72:
Как получить доступ к локальным файлам с помощью Chrome 72? - Сообщество Google Chrome[^]

Рейтинг:
2

Member 14879799

Даже у меня была такая же проблема. Я использовал команду (в Ubuntu)
$браузер-синхронизация пуск-сервер-каталог-файлы "**/*"
(после установки browser sync), и это решило проблему. Обязательно запустите эту команду из каталога, в котором находятся все ваши файлы кода.
"По соображениям безопасности браузеры ограничивают перекрестные HTTP-запросы, инициируемые сценариями." -поиск Google

Рейтинг:
2

Member 14764124 

<!DOCTYPE html>
<html>
<body>

<h2>The XMLHttpRequest Object</h2>

<p id="demo">Let AJAX change this text.</p>

<button type="button" onclick="loadDoc()">Change Content</button>

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", "https://www.w3schools.com/js/ajax_info.txt", true);
  xhttp.send();
}
</script>

</body>
</html>


я не могу запустить этот код в chrome ; \
Ошибка : 
xml.html:27 Access to XMLHttpRequest at 'file:///C:/Users/1819092/Desktop/MANAS/ajax_info.txt' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

CHill60

Если у вас есть вопрос, то используйте красную ссылку "задать вопрос" в верхней части страницы. Вы не должны публиковать вопросы или комментарии в качестве решений вопросов других участников. Там нигде не для нас ответить

Рейтинг:
1

Karthik_Mahalingam

Разместите его внутри Веб-сервер[^] и попробовать.