问题描述
我一直试图找出答案,但是找不到相关的文档或示例.
I've been trying to figure this out but I can't find relevant documentation or examples.
我正在向我的测试Rails服务器发送一个请求,并且答复只有2个标头,而使用REST测试工具(例如邮递员)时,我得到了所有期望的标头.
I'm sending a request to my test rails server and the reply only has 2 headers, while using a REST test tool (such as postman) I get all the expected headers.
这是我叫服务器的方式:
This is how I call the server:
// Base Class
@Injectable()
export class BaseResource {
constructor(
protected http : HttpClient,
protected authTokenService : AuthTokenService,
protected storage : LocalStorageService
){}
public getHost() : string {
let server = this.storage.get<string>("server");
if (server.lastIndexOf("http", 0) !== 0) {
server = "https://" + server + ".example.com/v2";
}
return server;
}
public getHostUrl(resource: string) : string {
return this.getHost() + "/" + resource;
}
public performGet(url : string) : Observable<any> {
return this.http.get(this.getHostUrl(url), this.getHttpOptions());
}
public performPost(url : string, body : {}) : Observable<any> {
return this.http.post(this.getHost(url), body, this.getHttpOptions());
}
protected getHttpOptions() : {} {
const authToken = this.authTokenService.getAuthHeaderValue();
const httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
'Authorization': authToken
}),
observe: 'response'
};
return httpOptions;
}
}
这是精简的专用子实例
@Injectable()
export class EntryResource extends BaseResource {
get(): Observable<any> {
return this.performGet("entries");
}
}
这就是所谓的一切
@Injectable()
export class EntryService {
constructor(private resource: EntryResource) { }
getEntries() : Promise<Entry[]> {
return new Promise((resolve, reject) => {
this.resource.get().subscribe(
data => {
console.log(data.headers.keys());
resolve(data.body as Entry[]);
},
error => {
reject(error);
}
);
});
}
}
在所有这些操作的最后,将以下标题打印到控制台:
At the end of all this, the following headers are printed to the console:
(2) ["content-type", "cache-control"]
这是邮递员显示的标题:
And here are the headers displayed by postman:
Cache-Control →max-age=0, private, must-revalidate
Connection →Keep-Alive
Content-Length →3416
Content-Type →application/json; charset=utf-8
Date →Fri, 23 Mar 2018 19:38:44 GMT
Etag →W/"914d1759e9dcdbdb05450efa629a0b03"
Server →WEBrick/1.3.1 (Ruby/2.3.1/2016-04-26)
Vary →Origin
X-Content-Type-Options →nosniff
X-Frame-Options →SAMEORIGIN
X-Pagination →{"total":123,"total_pages":9,"current_page":1,"first_page":true,"last_page":false,"next_page":2,"out_of_bounds":false,"page_size":15}
X-Request-Id →20cccf61-4816-4e61-a7a7-c71adeb604d7
X-Runtime →0.922868
X-Xss-Protection →1; mode=block
为什么标题被角形剥离?
Why are the headers stripped by angular?
推荐答案
尝试设置 Access-Control-Allow-Headers
标头服务器端以公开这些标头
Try setting the Access-Control-Allow-Headers
header server side to expose these headers
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Access-Control-Allow-Headers
Access-Control-Allow-Headers: X-Frame-Options, X-header-2
之所以需要这样做,是因为出于安全原因,浏览器实现了CORS,而测试工具(邮递员,其他其他客户端)和非浏览器应用则没有.我不知道android,但是我猜想,如果使用webviews,您将需要CORS
This is needed because browsers implement CORS for security reasons, while testing tools (Postman, other rest clients) and non browser apps do not. I don't know android, but my guess is that you'd need CORS if using webviews
这篇关于Angular 2:剥离了来自HttpResponse的HttpHeaders.怎么修?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!