请求头场没有被接入控制允许的报头预检响应

问题描述:

允许我使用angularjs2在前端& 的Java春作为后端的REST API &得到错误。请求头场没有被接入控制允许的报头预检响应

XMLHttpRequest cannot load 'Some url'. Request header field appkey is not allowed by Access-Control-Allow-Headers in preflight response. 

这是我的角码。

private logInUrl = 'Some url'; // URL to JSON file 


    authenticateUserCredentials(logIn: LogIn): Observable<ResponseClass> { 

    let body = JSON.stringify(logIn); 
    let headers = new Headers(); 
    headers.append('Content-type', 'application/json'); 
    headers.append('appKey', 'superadmin'); 

    let options = new RequestOptions({ headers: headers }); 

    return this.http.post(this.logInUrl, body, options) 
        .map(this.extractData) 
        .catch(this.handleError); 
    } 

和我们使用过滤器的服务器端代码。

public final class CorsFilter extends OncePerRequestFilter{ 
    @Override 
    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) 
      throws ServletException, IOException { 
      // CORS "pre-flight" request 
      response.addHeader("Access-Control-Allow-Origin", "*"); 
      response.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE"); 
      // response.addHeader("Access-Control-Allow-Headers", "Content-type,X-Requested-With,Origin,accept"); 
      response.addHeader("x-access_token","Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"); 
      response.addHeader("Access-Control-Max-Age", "1800");//30 min 

     filterChain.doFilter(request, response); 
    } 
} 

邮递员应用程序的REST API工作正常与两个头的AppKey &内容类型

这是为了实现对AppKey页眉或请提出任何其他方式发送的正确方法自定义标题或预定义标题中的自定义数据。

+0

预检请求是一个“选项”,请确保在请求中允许“选项”。 – Supamiu

+2

您在代码中注释掉的行是设置Access-Control-Allow-Headers的正确方法,但错误是表示它期望允许请求标头。尝试将其添加到列表中 –

Angular2是较低层的标头!

所以Content-Type将是content-type,请检查您的后端将允许它! :)

也看到这个问题:Cross orgin error in google chrome for the api call

有我解释如何测试Angular2-后的方法来验证角部分工作正常。

+0

感谢您的答案,但交叉问题已通过向上面的代码中显示的java spring添加过滤器来解决。如果我删除自定义标头** appKey **,则发布请求可以正常工作。 –