Неверный запрос CORS - PullRequest
Новая
       4

Неверный запрос CORS

0 голосов
/ 07 января 2020

Я создаю страницу в angularJs, когда я отправляю запрос в мой API, возникает ошибка:

enter image description here

Мой код is: 

<!DOCTYPE html>
<html ng-app="AppIndex">
<head>
    <meta charset="utf-8">
    <title>Hola mundo</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.9/angular.min.js"></script>
    <script src="ControllerIndex.js"></script>
</head>
<body ng-controller="ControllerIn">
    {{"Hola Mundo" + nombre}}
    <button ng-click="metodos()">Enviar</button>
    <ul>
        <li ng-repeat="response in posts">
            <h2>holaaaaa</h2>
            <p>{{response.title}}</p>
            <p>{{response.body}}</p>
        </li>
    </ul>
</body>

</html>

и javaScript

angular.module("AppIndex",[])
.controller("ControllerIn", function($scope, $http){
    $scope.nombre = "Juan";
    $scope.newPost = {};
    $scope.responses = [];
    $scope.metodos = function(){
        $http({
                method: 'POST',
                url: 'http://localhost:900/Servicios/forgotPassword',
                Headers: {"Access-Control-Allow-Origin": "http://127.0.0.1", "Access-Control-Allow-Methods": "POST", "Content-Type" : "application/json"},
                data: {"user" : "admin1"}
             }).then(function (response){
                console.log(response);
                $scope.posts = response;
             },function (error){
                console.log(error);
             });
    }
})

Сообщение об ошибке:

POST http://localhost: 900 / Servicios / ForgotPassword 403 {data: "Invalid CORS request", status: 403, config: {…}, statusText: "", заголовки: ƒ,…

Я использую AngularJS 1.7.9

Ответы [ 4 ]

1 голос
/ 07 января 2020

Политика Cors управляется с сервера

Вы должны разрешить с вашего сервера указывать c (или все) URL-адреса, которые могут получить доступ к вашему серверу

Способ разрешить это

В своем Http-ответе добавьте этот заголовок с указанным URL-адресом или звездочкой, чтобы разрешить все 

Access-Control-Allow-Origin, "your url"
Access-Control-Allow-Origin, "*"

. Вы также можете разрешить только определенные методы запроса (или все типы), также добавление дополнительного заголовка: 

Access-Control-Allow-Methods, "POST"
Access-Control-Allow-Methods, "*"

Браузер сначала отправляет запрос предварительной проверки, проверяя, совпадают ли тип источника и тип запроса, и только если он видит, что это разрешено, как в заголовках выше, он совершит фактический вызов.

Проблема с cors возникает только при звонках из браузера, а не при обращении к серверу и не из средств разработки, таких как почтальон

0 голосов
/ 07 января 2020

вам нужно включить запрос CORS только со стороны сервера. какой бэкэнд вы используете?

0 голосов
/ 07 января 2020

Если вы используете express. JS в качестве бэкэнда, вам нужно передать свойство cors в качестве промежуточного программного обеспечения.

Как это сделать в express. JS

Метод 1

  1. создать файл cors. js. Затем скопируйте этот код и вставьте файл cors. js

    module.exports = function(req, res, next) { res.header("Access-Control-Allow-Origin", "*"); res.header('Access-Control-Allow-Methods', 'DELETE, PUT, GET, POST'); res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); next(); }

  2. После этого вам потребуется файл cores. js на вашем сервере . js файл и передать его в качестве промежуточного программного обеспечения для примера:

    app.use(require('./cors'));

Метод 2

вы можно просто установить cors с помощью npm i cors и указать в файле вашего сервера.

ПРИМЕЧАНИЕ. Это то, что вы делаете в express. js. Но если вы используете любую другую бэкэнд-технологию, то аналогично вы можете сделать что-то подобное, это всего лишь пример с использованием express. JS

0 голосов
/ 07 января 2020

Access-Control-Allow-Origin - заголовок ответа; если я не ошибаюсь, это код клиента. Вам нужно будет отправить заголовки Access-Control-Allow-* со стороны сервера в ответ на запрос клиента.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...