【问题标题】:Request header field Content-Type is not allowed by Access-Control-Allow-Headers in flight responseAccess-Control-Allow-Headers 在飞行响应中不允许请求标头字段 Content-Type
【发布时间】:2018-08-26 06:14:14
【问题描述】:

我正在使用 Laravel(Restful API)开发一个 Angular 4 应用程序。我已经用 Postman 测试了 API。它工作正常,但是当我从 Angular 4 调用 API 时出现此错误:

import { Injectable } from '@angular/core';
import { Headers, Http } from '@angular/http';
import { User } from '../models/user';
import 'rxjs/add/operator/toPromise';

@Injectable()
export class AuthService {
 private BASE_URL: string = 'http://localhost/fmfb_hr/public/api';
  private headers: Headers = new Headers({'Content-Type': 'application/json'});
 constructor(private http: Http) {}
login(user): Promise<any> {
let url: string = `${this.BASE_URL}/login`;
return this.http.post(url, user, {headers: this.headers}).toPromise();
}


}

【问题讨论】:

  • 可能是 CORS 问题。
  • 如何用 laravel 解决
  • 创建一个 CORS 中间件。更多详情请见stackoverflow.com/questions/29045413/…
  • 我已经阅读了这篇文章并尝试过,但它不起作用

标签: php angular laravel laravel-5 cors


【解决方案1】:

试试这段代码在一个请求中添加两个标头,我希望这可行

import { Injectable } from '@angular/core';
import { Headers, Http } from '@angular/http';
import { User } from '../models/user';
import 'rxjs/add/operator/toPromise';

@Injectable()
export class AuthService {
    private BASE_URL: string = 'http://localhost/fmfb_hr/public/api';
    private headers: Headers = new Headers({});
    constructor(private http: Http) {}
    login(user): Promise<any> {
        let url: string = `${this.BASE_URL}/login`;
        this.headers.append('Content-Type','application/x-www-form-urlencoded');
        this.headers.append('Content-Type','application/json');
        return this.http.post(url, user, {headers: this.headers}).toPromise();
    }
}

【讨论】:

    【解决方案2】:

    将这三行添加到 CORSify 您的服务器。如果您使用 Apache 作为 Web 服务器,请将这些行添加到您的 .htaccess 文件中:

    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Methods "GET,PUT,POST,DELETE"
    Header set Access-Control-Allow-Headers "Content-Type, Authorization"
    

    【讨论】:

      猜你喜欢
      • 2013-07-05
      • 2012-09-06
      • 2019-03-17
      • 2016-05-15
      • 2014-06-16
      • 2018-01-26
      • 2016-04-24
      • 2019-02-21
      相关资源
      最近更新 更多