Я использую angular2 + laravel, и я пытаюсь отправить запрос с заголовками, но он дает запрос на перекрестный запрос с блокировкой: ошибка. Если какой-либо орган знает, как его решить.
Я сделал некоторое возможное решение, например, включить Access-Control-Allow-Origin "*" в htaccess файле laravel и создал промежуточное ПО CORS, но эти решения не работают. Вот мой код углового.
import { Injectable } from '@angular/core'; import { Http, Headers, Response, RequestOptions } from '@angular/http'; import { Observable } from 'rxjs/Observable'; import 'rxjs/add/operator/map' import configApp = require('../_configs/app.settings'); //import '../assets/frontend/custom/js/jquery.toaster.config.js'; declare function maketoast(status: string, message: string) : void; @Injectable() export class ForgotpasswordService { constructor(private http: Http) { } forgotPassword(email: string, token: string) { alert(token) var headers = new Headers(); // headers.append('Content-Type', 'application11/json'); let headers = new Headers(); headers.append("Authorization", "Bearer " + token; let options = new RequestOptions({ headers: headers }); // console.log(configApp.apiUrl+/test); return this.http.post(configApp.apiUrl+"/password/email", JSON.stringify({ email: email, apiRequest:1}), options } ) .map((response: Response) => { // login successful if there's a jwt token in the response let user = response.json(); console.log(user.status); if(user.status == false){ maketoast(user.toaster_status, user.message); event.stopImmediatePropagation; event.preventDefault(); event.stopPropagation(); } if (user.status == true) { maketoast(user.toaster_status, user.message); } }); } resetPassword(token: string, email: string, password: string, confirmPassword: string) { // console.log(configApp.apiUrl+/test); return this.http.post(configApp.apiUrl+"/password/reset", JSON.stringify({ token: token, email: email, password: confirmPassword, confirmPassword: password, apiRequest:1})) .map((response: Response) => { // login successful if there's a jwt token in the response let user = response.json(); console.log(user.status); if(user.status == false){ maketoast(user.toaster_status, user.message); event.stopImmediatePropagation; event.preventDefault(); event.stopPropagation(); } if (user.status == true) { maketoast(user.toaster_status, user.message); } }); } }
Это проблема на стороне сервера.
Создание промежуточного программного обеспечения:
namespace App\Http\Middleware; use Closure; class Cors { /** * Handle an incoming request. * * @param \Illuminate\Http\Request $request * @param \Closure $next * @return mixed */ public function handle($request, Closure $next) { return $next($request) ->header('Access-Control-Allow-Origin', '*') ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS'); } }
И добавьте на свой маршрут:
Route::group(['middleware' => ['cors']], function () {
// ВАШ код маршрута});
Я использую laravel и угловатый 2.
На Laravel я установил модуль barryvdh / laravel-cors, и когда я сделал POST-вызов, заголовки включают Access-Control-Allow-Origin «*».
Но angular2 делает предполетный вызов с помощью OPTIONS перед POST, и Laravel не отправлял Access-Control-Allow-Origin «*», когда действие было OPTION.
поэтому, я добавляю это в .htacess файл
RewriteCond %{REQUEST_METHOD} OPTIONS RewriteRule ^(.*)$ $1 [R=200,L,E=HTTP_ORIGIN:%{HTTP:ORIGIN}]] Header always set Access-Control-Allow-Origin "*" Header always set Access-Control-Allow-Credentials "true" Header always set Access-Control-Max-Age "1000" Header always set Access-Control-Allow-Headers "X-Requested-With, Content- Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding" Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"