有时候,网站在登录时需要根据用户的类型(权限)进行不同页面的跳转。

利用ajax请求可以避免页面的频繁跳转,有效改善用户体验。
ajax请求主要的代码:

正则表达式验证:

如果在后端经过一系列的验证,成功登录后,以重定向的方式跳转如:response.sendRedirect("/easyPartTimeJob/view/html/student.html"),此时页面并不会跳转到页面,但是响应已经到达页面:

原因:(摘录于网络)
ajax只是利用脚本访问对应url获取数据而已,不能做除了获取返回数据以外的其它动作了。所以浏览器端是不会发起重定向的。 1)正常的http url请求,只有浏览器和服务器两个参与者。浏览器端发起一个http请求,服务器端处理后发起一个重定向,浏览器端从response中获取到重定向地址,发起另一个http url请求。也就是说,浏览器会按照response中的内容进行响应(如重定向),这是浏览器的功能决定的就得响应。 2)Ajax请求,参与者就有三个即ajax、客户端、服务器,ajax处于客户端和服务器两者之间。过程是客户端发起一个ajax请求,服务器端处理后,如果发起一个重定向,然后ajax会怎么办呢?它只会获取刚才请求返回的数据,其他的任何动作一概不去做,ajax是这么做的(ajax功能就是这么设定的,ajax框架源代码也是这么写的)。 也就是说,引入了ajax之后,ajax就插在浏览器和服务器之间了,服务器给浏览器的response被ajax拦截了,但是ajax本身却什么都不做,也不转达。
解决方案:(后端返回用户标识,在浏览器完成跳转):


这样是可以达到想要的效果的,但是有安全隐患:
正常来说,服务器返回如此的数据,浏览器根据该字段进行跳转

利用fiddler拦截响应

在响应到达浏览器前截获响应头,修改该字段为manager,然后放行响应。

结果本应该跳转到学生首页的跳转到了管理员首页。

所以登录时我仍然选择表单进行登录,在密码错误时做出提示:


或者依旧在浏览器跳转,但是在每次操作前检验用户的权限(想想就烦(´・_・`))
说出你的解决方案! |