服务器端 ionic 3 和带有 javaEE6 的 glassfish 中 angular 的 CORS 问题

Question

当我运行 "ionic serve" 向本地主机服务器发出请求时，ionic3 框架出现问题。我收到的错误是：

Access to XMLHttpRequest at 'http://localhost:8080/myrestapi/myendpoint' from origin 'http://localhost:8100' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我四处搜索并在我的服务器和 angular 中添加了访问控制允许。从 angular 的角度来看，我有以下几点：

@Injectable()
export class Gateway {
    private getBasicHttpOptions(): any {
        let headers: HttpHeaders = new HttpHeaders();
        headers = headers.append('Access-Control-Allow-Origin', '*');
        headers = headers.append('Content-Type', 'application/json');

        let httpOptions: any = {headers: headers};

        return httpOptions;
    }

    public getData(myparam: string): Observable<any> {

        let httpOptions: any = this.getBasicHttpOptions();

        let body: any = {
            'param': myparam
        };

        return this.http.post("http://localhost:8080/myrestapi/myendpoint", body, httpOptions);
    }
}

然后在服务器端我有以下内容（javeEE6、SDK 7、glassfish 3.1.2）：

@Path("/myrestapi")
@Stateless
public class Authentication {

    @POST
    @Path("/myendpoint")
    @Consumes("application/json")
    @Produces(MediaType.APPLICATION_JSON)
    public Response myEndPoint(@HeaderParam("Content-Type") String contentType, String body){

      return Response.status(200)
                .header("Access-Control-Allow-Origin", "*")
                .header("Access-Control-Allow-Credentials", "true")
                .header("Access-Control-Allow-Headers", "origin, content-type, accept, authorization")
                .header("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS, HEAD")
                .header("Access-Control-Max-Age", "1209600")
                .type(MediaType.APPLICATION_JSON)
                .entity("{ke1:'val1'}").type(MediaType.APPLICATION_JSON).build();
    }


}

每当我调用 this.gateway.getData('aparam');因为我的本地服务器处于调试模式，所以我无法收到任何请求（来自 Postman，它工作正常）。所以它似乎来自客户端，它不发送任何请求。

来自 Chrome 来自网络工具我有以下内容：

有什么想法吗？

Answer 1

CORS 是浏览器引发的错误，以防止未经授权的 cross-origin 请求保护网站的 end-users - 因此，例如，chrome 会引发它，但 chromium Ionic 不会运行 - 所以它应该只发生在浏览器中。

这里有两个选择：

安装 CORS chrome 扩展 - 因为移动版本永远不会出现 cors 错误，所以没问题。
在 glassfish/JEE 中启用 CORS，查看 this SO question 了解如何操作的详细信息 - 您可以在从服务器获得的响应中看到（响应headers) - 没有返回 access-control-allow-origin header。

服务器端 ionic 3 和带有 javaEE6 的 glassfish 中 angular 的 CORS 问题

CORS issue on angular in ionic 3 and glassfish with javaEE6 on server side

angular

ionic3

java-7

java-ee-6

glassfish-3