jQuery中登录成功后,将token存储到跳转到首页

tech2022-10-11  89

前言:根据用户名密码换取token成功后,将token存储到本地,以供其他页面获取,并能跳转到其他页面。本文举例从登录页面跳转到首页。 详见下方代码

一、登录页面

//js代码 $("#login").on("click",function(){ // 点击登录获取表单中的值 var username = $("#username").val(); var password = $("#password").val(); var data = { username:username, password:password } // 根据用户名密码获取token $.ajax({ url:url+"/user/login", method:"post", data:JSON.stringify(data), // 在jquery封装的ajax中发给后台的默认是查询字符串 contentType:"application/json", success:function(res) { // 将token存储到本地 localStorage.setItem('token',res.data.token) // 请求成功后跳转到首页 location.href = '浏览器打开目的网页的地址' } }) // 阻止表单默认提交行为 event.preventDefault(); }) }) // body中代码 <form class="form_login"> 用户名:<input id="username" type="text" name="username"><br> 密 码:<input id="password" type="password" name="password"><br> <input id="login" type="submit" value="登录"> </form>

二、首页

跳转成功后,希望在首页获取到token,并把token设置到请求头中

// js代码 $(function() { // 获取token var token = localStorage.getItem('token') // 将token设置到请求头headers中 $.ajaxSetup({ headers:{ 'Authorization':token; } }) })

end

最新回复(0)