Браузер блокирует ответ с сервера: blocked by CORS policy: No 'Access-Control-Allow-Origin'

Question

Передо мной стояла задача сделать сервис перевода денег в разные валюты. Написал сервер на java. Хотел сделать простецкую страничку, отправить запрос на сервер получить ответ и показать результат. Запрос отправился, сервер принял, обработал, ответил, но ответ не дошел, а я получил вот эту ошибку в консоль: Access to fetch at 'http://localhost:8080/serviceTransferMoney/convert?from=USD&to=USD&quantity=6789' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. В frontend я не силен писал html опираясь на разные источники.

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <title>Данные формы</title>
</head>
<body>
    <script type="text/javascript">
    
    function request(){
        var str = "http://localhost:8080/serviceTransferMoney/convert?" 
                + "from=" + encodeURI(document.getElementById("from").value) + "&"
                + "to=" + encodeURI(document.getElementById("to").value) + "&"
                + "quantity=" + encodeURI(document.getElementById("quantity").value);
                
    fetch(str, {
    method: 'GET'
  })
    .then(function(response) {  
        alert(response.text());
        return response.text();  
    }).then(function(text) {  
        alert('Request successful', text);  
    })  
    .catch(function(error) {  
        alert('Request failed', error)  
    });
        
    }
  
    </script>
        <p>
            <select id = "from">
                <option>USD</option>
                <option>RU</option>
            </select>
            <input type = "number" id="quantity" value="0.00">
            <br>
            <br>
            <select id = "to">
                <option>USD</option>
                <option>RU</option>
            </select>
            <input type = "text" id = "result" value="0.00">
        </p>
        <p><input type="submit" onclick="request()"></p>
</body>
</html>

Answer 1

может выключить cors для тестирования? или в хедере запроса добавляй 'Access-Control-Allow-Origin' параметр.

выключить cors это permitAll() на все страницы как временное решение.

Answer 2

Моей ошибкой было открывать эту страницу из каталога из за этого url был отличен от сервера следовательно CORS не пропускал.

Решил проблему путем создав обработчик на сервере который в ответ посылал эту самую страницу в браузер и тогда уже url был правильный, и CORS общение не прерывал.

Спасибо Ansar Ozden за подсказку.

БЛОГ НА HUSL

Браузер блокирует ответ с сервера: blocked by CORS policy: No 'Access-Control-Allow-Origin'

Ответы (2 шт):