在做项目的时候,需要用户上传头像图片设置头像。将图片进行转base64码后进行put请求结果返回431错误。Request Header Fields Too Large,查询资料后发现是文件请求字段过长,导致了请求都还没传到服务器就被拦截了,直接返回431错误。

解决方法:

1,分析问题:Request Header Fields Too Large,文件请求头过长,之前在get请求的时候也返回了这个问题,但是明明get是没有带任何请求头的,也返回了431错误。经过一般摸索过后,发现问题出现在了token上。

2,定位问题,之前没有这个报错是因为还没有在token中加入头像avatar这个字段。在这之前,我们先来了解一下登录成功后返回的token里面是包含哪些内容的

        生成的token结构是:header.payload.signature

 3个信息分别由点号隔开,而用户存储的信息是放在payload中的,payload,它包含声明(要求)。声明是关于实体(通常是用户信息,也就是程序员放入token中的数据)和其他数据的声明。payload的长度随着程序员放进去的数据的增加而增多。对payload进行Base64编码就得到JWT的第二部分。之前在写token的时候没有注意到这个问题,一股脑的把用户的个人信息都往token里面塞了,这是非常不好的。

我之前就在里面放了头像的信息,想着可以直接在vue中直接获取到头像的信息。结果报请求头过长错误了,这个时候的token信息中还包含了图片转base64之后的编码,长度是非常长的。所以才报431错误了。

需注意,不要在payload或header中放置敏感信息,除非它们是加密的。

3,解决问题

在注册接口使用JWT时修改rules放的值,我之前是这样放的,avatar放的是头像的base64码

结果在postman测试时返回token的时候token值的长度就非常可怕了

 

后来将avatar:user.avatar 上传头像信息的这一部分去掉就可以了。

这时候有人就要问了,那这样的话前端怎么获取用户信息。 很简单,直接写一个get接口,获取到登录用户的所有个人信息就可以解决了

Logo

前往低代码交流专区

更多推荐