Угловые и Laravel CORS Access-Control-Allow-Origin Проблемы - PullRequest
Новая
       18

Угловые и Laravel CORS Access-Control-Allow-Origin Проблемы

0 голосов
/ 01 января 2019

В течение последних нескольких месяцев я без проблем работал в приложении Angular (клиент) и Laravel (API) локально на своих устройствах разработки.Несколько дней назад я загрузил приложения (клиент и API) на сервер, и внезапно я начал получать ошибки CORS:

Доступ к XMLHttpRequest по адресу https://api.domain.pt/api/login' от источника'https://client.domain.pt' заблокировано политикой CORS: Ответ на запрос предварительной проверки не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin».

В начале разработки я также получил эти ошибки, потому что я использовал разные локальные домены как для клиента, так и для API (client.localhost и api.localhost) и в итоге решил проблемы, добавив промежуточное программное обеспечение CORS в мой Laravel API:

public function handle($request, Closure $next)
{
    //apply cors only to api routes
    if (Request::segment(1) == 'api') {

        header("Access-Control-Allow-Origin: *"); 

        $headers = [
            'Access-Control-Allow-Methods' => 'POST, GET, OPTIONS, PUT, DELETE',
            'Access-Control-Allow-Headers' => 'X-Requested-With, X-Auth-Token, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding, X-Login-Origin',
            'Access-Control-Allow-Credentials' => 'true'
        ];

        if ($request->isMethod("OPTIONS")) {
            // The client-side application can set only headers allowed in Access-Control-Allow-Headers
            return Response::make('OK', 200, $headers);
        }

        $response = $next($request);

        foreach ($headers as $key => $value) {
            $response->header($key, $value);
        }
    } else {
        $response = $next($request);
    }

    return $response;
}

Все маршруты используют промежуточное программное обеспечение CORS.Когда приложение пытается выполнить публикацию в API входа в систему (/ api / login), оно даже не входит в промежуточное ПО CORS.

Почему это работает локально, а не на сервере?

Ответы [ 2 ]

0 голосов
/ 12 января 2019

Пожалуйста, воспользуйтесь приведенной ниже справочной и справочной ссылкой для справки:

Вы можете проверить CORS Middleware для пакета Laravel или ссылку ниже:

Угловой и LaravelCORS Access-Control-Allow-Origin Issues

0 голосов
/ 03 января 2019

Мне удалось решить мою проблему.Поскольку мое специальное промежуточное программное обеспечение CORS не вызывается, я добавил пользовательские заголовки в мой файл web.config: 

<configuration>
  <system.webServer>        
    <!-- SOLVES CORS ISSUES -->
    <httpProtocol>
     <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="X-Requested-With, X-Auth-Token, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding, X-Login-Origin" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
     </customHeaders>
   </httpProtocol>
   <!-- /SOLVES CORS ISSUES -->
  </system.webServer>
</configuration>

Это наиболее подходящее решение, но я собираюсь использовать его сейчас.Если у кого-то есть какое-либо другое решение, вместо принудительного использования пользовательских заголовков, ответьте.

ОБНОВЛЕНИЕ:

Временное решение для Apache.Добавьте это в ваш файл .htaccess: 

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "X-Requested-With, X-Auth-Token, Content-Type, Origin, Cache-Control, Pragma, Authorization, Accept, Accept-Encoding, X-Login-Origin, responseType"
Header set Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS"
...