最近在做一个项目，看到同事用了 axios 的请求拦截器。 请求发送到 server 前，做了 token 的认证和模拟用户表单提交数据两件事。 我的理解是，token 认证是一种安全认证机制，主要后端去搞的。感觉模拟用户提交表单和前端关系大一点，也和 web 前端安全有关，不过我们这里只是单纯的为了将用户填表的结果封装成一组值。拦截表单有什么应用场景呢？ 除了拦截请求，还可以拦截响应，但是不懂为什么要去拦截。 所以想来问问 V 友们，前端有哪些拦截请求和响应的应用场景？
This topic created in 3000 days ago, the information mentioned may be changed or developed.
 |
1
wdlth Mar 21, 2018 via Android
比如密码前端预加密
|
 |
2
MeteorCat Mar 21, 2018 via Android
CSRF 攻击一般是在 POST 表单附加个隐藏标识字段验证下就行了，你们模板是 JS 渲染还是后端渲染？
|
 |
6
shintendo Mar 21, 2018
不知道你说的“ token 认证”是指什么，一般是请求拦截器往请求里面加 token 吧？
响应拦截器可以做一些统一的预处理，比如服务器返回“未登录”“无权限”之类的，跳转到登录页去 |
 |
7
ChefIsAwesome Mar 21, 2018  3
你叫“拦截器”，我叫程序的“ api 层”。对 view 来讲，它是一层代理。其实就是把 request 的方法封装而已。
稍微复杂的 app，我一般都这样设计：server <> api 层 <> view view 层不需要关心跟服务器交互的很多细节，直接调 api 层的提供的函数就行了。 api 层能做什么呢？ - 缓存； - 同时发几个请求，再把结果合并； - 统一处理超时、错误、重定向； - 管理请求的地址、在 header 里头加需要的标识； - 抽取返回数据中需要的部分，转化返回数据的格式； - 把图片压缩； … |
 |
9
frankkai OP @ChefIsAwesome 可以的，api 层这一层分离出来很清爽。api 层能做的这些事情我需要结合《 http 权威指南》再理解理解，感谢～
|
|
10
shintendo Mar 21, 2018
@frankkai
登录成功的时候，后端返回 token，前端保存下来，以后每次发送请求的时候都带上这个 token，这个“带上 token ”的动作你可以手动在每一次请求里写，也可以统一放在请求拦截器里做，而 token 的验证当然还是后端的事情 |
 |
11
BearD01001 Mar 21, 2018 via iPhone
拦截 Request 加 token 加数据校验。
拦截 Response 加异常捕获。 |
|
13
frankkai OP @BearD01001 数据校验指的是什么？异常捕获在 catch(error)里也可以做吗？
|
|
14
BearD01001 Mar 21, 2018 via iPhone
@frankkai 数据校验一般是对用户输入的数据进行合法性检测，防止 XSS。异常捕获一般是对接口返回的异常信息或接口请求过程中发生的错误信息进行处理，通常做法是给用户相应的提示信息，并预留出回调函数交回具体的业务层进一步处理异常状态。
|
 |
15
hcymk2 Mar 21, 2018
前端通过合法性检测来防止 xss 有意义么？
|
 |
17
simpleapples Mar 21, 2018 1
比如 oauth2 认证，拦截 response，当 response 为 401 时候，用 refresh_token 重新获取 access_token
|
Select Language