带有lite-server的Angular2不附加自定义标头或cookie

模糊0224

我有一个运行在localhost:8080上的REST后端,当用户登录时它会发出cookie。我有一个与后端打包在一起的Angular2前端。当我运行项目时,angular发送cookie并将自定义标头附加到对后端的请求。但是,当我使用列表服务器一个localhost:3000运行前端时,angular不会发送任何cookie,也不会附加自定义标头。

与后端一起运行时的请求:

Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Cookie:io=8Dk6ajOQZyDz-bvXAAAB; jwt=eyJh...H1aCccT2U
Host:localhost:8080
Referer:http://localhost:8080/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.76 Safari/537.36
X-CSRF-Token:2c8744ff-38ad-49cb-bf07-fe75cd16f827

使用lite-server和apache2运行

Accept:*/*
Accept-Encoding:gzip, deflate, sdch, br
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:x-csrf-token
Access-Control-Request-Method:GET
Connection:keep-alive
Host:localhost:8080
Origin:http://localhost:3000
Referer:http://localhost:3000/
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.76 Safari/537.36

据我了解,Cookie不是特定于端口的,因此应与localhost:3000和localhost:8080的请求一起发送。

我在后端有一个CORS过滤器,可以接受来自任何来源的所有请求。

  1. 为什么不附加标题?
  2. 为什么不附加Cookie?
模糊0224

该问题与lite服务器无关。每当您在与后端不同的端口/域上运行前端时,都需要明确允许某些行为发生,例如设置cookie或允许读取标头。

为了使后端设置的cookie存储在浏览器中,必须使用来发送角度请求,该请求withCredentials将以下标头附加到该请求。

Access-Control-Allow-Credentials:true

this.http.post(this.loginUrl,
        JSON.stringify({ username: username, password: password }),
        {headers: this.headers, withCredentials: true})...

我设置了一个HTTP Service包装器,将其附加到每个请求。

为了使angular能够读取后端发送的自定义标头,CORS需要发送以下标头:

Access-Control-Expose-Headers:X-CUSTOM-HEADER

只有这样,它才会暴露在角度下。希望这对某人有帮助。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

带有自定义请求标头的 Angular 4

来自分类Dev

带有Material Design Lite的Angular2

来自分类Dev

带有CORS和自定义标头的AngularJS

来自分类Dev

带有CORS和自定义标头的AngularJS

来自分类Dev

带有自定义标头的UICollectionView

来自分类Dev

带有连字符的RCurl自定义标头

来自分类Dev

Python:带有自定义标头的请求失败

来自分类Dev

如何使用pjsua2 android发送带有自定义标头的SIP消息

来自分类Dev

带有自定义模型的 Tensorflow lite 示例 - “input_product_scale < output_scale was not true”

来自分类Dev

不能在带有CORS的AWS API Gateway上使用自定义请求标头

来自分类Dev

Spring RestTemplate到带有自定义标头和请求对象的POST请求

来自分类Dev

我如何发送带有自定义标头的获取请求

来自分类Dev

带有自定义标头和正文的Ruby POST?

来自分类Dev

如何发送带有自定义标头的HTTP删除请求?

来自分类Dev

Windows Phone工具包中带有ExpanderView的自定义标头

来自分类Dev

带有自定义标头的节点JS调用GRPC服务器

来自分类Dev

Backgrid / Backbone Pageable:带有GET请求的自定义HTTP标头

来自分类Dev

带有自定义标头和正文的Ruby POST?

来自分类Dev

jwplayer自定义标头,带有用于授权的令牌

来自分类Dev

带有拦截器的AngularJS自定义标头

来自分类Dev

使用Flash发送带有自定义标头的POST请求

来自分类Dev

带有自定义标头的Stomp.py发送失败

来自分类Dev

Angular 返回没有我的自定义标头的响应

来自分类Dev

带有 Web 服务的 PASOE 业务类实体中带有令牌的自定义标头?

来自分类Dev

带有Ang-If的Angular指令的jQuery Lite元素查找器

来自分类Dev

具有自定义标头的Python grequest

来自分类Dev

具有自定义标头的Powershell Forloop

来自分类Dev

带有参数的Angular 2自定义验证器

来自分类Dev

带有标头的Angular2 http get请求失败

Related 相关文章

  1. 1

    带有自定义请求标头的 Angular 4

  2. 2

    带有Material Design Lite的Angular2

  3. 3

    带有CORS和自定义标头的AngularJS

  4. 4

    带有CORS和自定义标头的AngularJS

  5. 5

    带有自定义标头的UICollectionView

  6. 6

    带有连字符的RCurl自定义标头

  7. 7

    Python:带有自定义标头的请求失败

  8. 8

    如何使用pjsua2 android发送带有自定义标头的SIP消息

  9. 9

    带有自定义模型的 Tensorflow lite 示例 - “input_product_scale < output_scale was not true”

  10. 10

    不能在带有CORS的AWS API Gateway上使用自定义请求标头

  11. 11

    Spring RestTemplate到带有自定义标头和请求对象的POST请求

  12. 12

    我如何发送带有自定义标头的获取请求

  13. 13

    带有自定义标头和正文的Ruby POST?

  14. 14

    如何发送带有自定义标头的HTTP删除请求?

  15. 15

    Windows Phone工具包中带有ExpanderView的自定义标头

  16. 16

    带有自定义标头的节点JS调用GRPC服务器

  17. 17

    Backgrid / Backbone Pageable:带有GET请求的自定义HTTP标头

  18. 18

    带有自定义标头和正文的Ruby POST?

  19. 19

    jwplayer自定义标头,带有用于授权的令牌

  20. 20

    带有拦截器的AngularJS自定义标头

  21. 21

    使用Flash发送带有自定义标头的POST请求

  22. 22

    带有自定义标头的Stomp.py发送失败

  23. 23

    Angular 返回没有我的自定义标头的响应

  24. 24

    带有 Web 服务的 PASOE 业务类实体中带有令牌的自定义标头?

  25. 25

    带有Ang-If的Angular指令的jQuery Lite元素查找器

  26. 26

    具有自定义标头的Python grequest

  27. 27

    具有自定义标头的Powershell Forloop

  28. 28

    带有参数的Angular 2自定义验证器

  29. 29

    带有标头的Angular2 http get请求失败

热门标签

归档