我的ionic3代码在发出http请求时会提示这些错误

Question

如果我的http post请求没有添加body参数，那么请求是完全正常的;但是当添加body参数时;将提示以下错误：

无法加载https://clk528.com/api/article：对预检请求的响应未通过访问控制检查：“Access-Control-Allow-Origin”标头包含多个值'*，http://127.0.0.1:8100'，但只允许一个。因此，'http://127.0.0.1:8100'原产地不允许进入。

我的http服务代码：

import {Injectable} from "@angular/core";
import {HttpClient, HttpHeaders} from "@angular/common/http";
import {Observable} from "rxjs";
import {tap, catchError} from "rxjs/operators";
import {of} from "rxjs/observable/of";
import {Events} from "ionic-angular";

@Injectable()

export class HttpService {
    constructor(public http: HttpClient, private event: Events) {
    }

    public get<T>(url: string): Observable<T> {
        let headers = new HttpHeaders();
        return this.http.get<T>(url, {headers: headers}).pipe(
            tap(model => console.log(model)),
            catchError(this.handleError<T>(url))
        );
    }

    public post<T>(url: string, body: any = null): Observable<T> {
        let headers = new HttpHeaders();
        return this.http.post<T>(url, body, {
            headers: headers
        }).pipe(
            tap(model => console.log(model)),
            catchError(this.handleError<T>(url))
        );
    }

    private handleError<T>(operation = "operation", result?: T) {
        return (error: any): Observable<T> => {
            if (error.status) {
                switch (error.status) {
                    case 401:
                        this.event.publish("user::unautherized");
                        break;
                    default:
                        break;
                }
            }
            // TODO: send the error to remote logging infrastructure
            console.error(error, operation, result); // log to console instead
            // Let the app keep running by returning an empty result.
            return of(result as T);
        };
    }
}

如果我使用以下代码发出请求，则没有错误;它可以做到;我的服务器也会返回数据。

this.http.post('https://clk528.com/api/article')

但是当我添加参数时，它将描述上面生成的错误。

this.http.post('https://clk528.com/api/article', {
    page: 1
});

Answer 1

这是一个CORS错误。我不确定为什么在post请求中传递正文会导致此错误。您的错误表明允许多个来源访问服务器，但服务器只允许一个来源访问它，按来源，我的意思是设备。您可以尝试的一种解决方案是从服务器上允许的原始列表中删除“http://127.0.0.1:8100”，并仅允许“*”作为允许的来源。