自定义响应头 AngularJS 的访问控制公开头配置

Posted 2023-03-04

【中文标题】自定义响应头 AngularJS 的访问控制公开头配置

【英文标题】：Access-Control-Expose-Headers Configuration for Custom Response Headers AngularJS

【发布时间】：2015-07-08 04:56:33

【问题描述】：

我在资源上实现自定义响应标头，在 reading over a similar question 之后，我在我的 CORS 标头中添加了一个“Access-Control-Expose-Headers”，但我不能正确配置某些东西。

以下是我在资源的 GET 请求中收到的标头：我收到“Steve”的“Response-Header”，“Access-Control-Expose-Headers”应允许该标头

Access-Control-Allow-Headers:x-requested-with, Request-Header, Response-Header
Access-Control-Allow-Methods:POST, GET, OPTIONS, DELETE
Access-Control-Allow-Origin:*
Access-Control-Expose-Headers:Response-Header
Response-Header:Steve

但是，Angular 仍然无法访问该自定义标头。我取回了我的自定义请求标头，但不是我的自定义响应标头：

  "data": 
    "id": 2,
    "content": "Hello, frank!"
  ,
  "status": 200,
  "config": 
    "method": "GET",
    "transformRequest": [
      null
    ],
    "transformResponse": [
      null
    ],
    "url": "http:\/\/localhost:8080\/greeting",
    "headers": 
      "Accept": "application\/json, text\/plain, *\/*",
      "Request-Header": "frank"
    
  ,
  "statusText": "OK"

Angular 1.3 $httpProvider.interceptor：

'use strict';
angular
  .module('headerDemoUiApp')
  .factory('AuthInterceptor', function AuthInterceptor(nameService) 

    return 
      request: handleRequest,
      response: handleResponse
    ;

    function handleRequest(config) 
      if (angular.isDefined(config.headers)) 
        config.headers['Request-Header'] = "frank";
      
      return config;
    

    function handleResponse(response) 
      console.log('Response: ' + JSON.stringify(response));

      if (angular.isDefined(response.config.headers['Response-Header'])) 
        var respHead = response.config.headers['Response-Header'];
        console.log('Response-Header: ' + respHead);
        nameService.responsename=respHead;
      
      return response;
    

  );

而且，Spring 版本 4.1.6 @RestController 添加了标头。

@RestController
public class GreetingController 

    private static final String template = "Hello, %s!";
    private final AtomicLong counter = new AtomicLong();

    @RequestMapping("/greeting")
    public Greeting greeting(
            @RequestParam(value = "name", defaultValue = "World") String name,
            HttpServletResponse response,
            @RequestHeader("Request-Header") String headerName) 

        // Sets our custom response header
        response.setHeader("Response-Header","Steve");

        return new Greeting(counter.incrementAndGet(),
                String.format(template, headerName));
    

API Code Repo

UI Code Repo

感谢观看！

【参考方案1】：

您必须在列表中设置将在响应标头上公开哪些自定义标头。喜欢：

 List<String> customHeaders = new ArrayList<String>();
    customHeaders.add("<Custom header name>");
    headers.setAccessControlExposeHeaders(customHeaders);

【参考方案2】：

问题在于您的 API GreetingController.java

将问候方法更改为返回ResponseEntity并使用HttpHeaders，如下所示

@RequestMapping("/greeting")
    public ResponseEntity<Greeting> greeting(@RequestParam(value = "name", defaultValue = "World") String name, @RequestHeader("Request-Header") String headerName) 

        MultiValueMap<String, String> headers = new HttpHeaders();
        // Sets our custom response header
        headers.add("Response-Header","Steve");
        return new ResponseEntity<Greeting>(new Greeting(counter.incrementAndGet(),String.format(template, headerName)), headers, HttpStatus.OK); 
    

以下是我对 Postman 客户端的标题响应

Content-Length → 2
Content-Type → text/plain;charset=UTF-8
Date → Wed, 27 May 2015 15:53:47 GMT
Response-Header → Steve
Server → Apache-Coyote/1.1

【讨论】：

这似乎是门票！如果您只发回有效负载而不是整个 ResponseEntity，那么 Spring 无法发回标头。谢谢！