后端接口重定向到页面,然后进行登录请求,拿到token,放到localStorage里面,然后再重定向到前端首页。前后端是两个域名,localStorage存不进去首页。怎么整,有哪些方案?
5条回答 默认 最新
关注
让阿豪来帮你解答,本回答参考chatgpt3.5编写提供,如果还有疑问可以评论或留言
问题分析:- 两个域名的localStorage不互通,需要找到其他的存储方案。
- 需要在登录页面请求后端接口获取token并将其存储下来,然后再重定向到前端首页,需要将已存储的token传递到首页。 解决方案:
- 使用cookie进行存储。由于cookie存储在客户端,可以跨域读取。可以在登录页面请求后端接口获取token后将其存储在cookie中。然后在重定向到前端首页时,可以通过document.cookie读取cookie值,并将其传递给首页。
// 存储cookie function setCookie(cname, cvalue, exdays) { var d = new Date(); d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)); var expires = "expires=" + d.toUTCString(); document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/"; } // 读取cookie function getCookie(cname) { var name = cname + "="; var decodedCookie = decodeURIComponent(document.cookie); var ca = decodedCookie.split(';'); for (var i = 0; i < ca.length; i++) { var c = ca[i]; while (c.charAt(0) == ' ') { c = c.substring(1); } if (c.indexOf(name) == 0) { return c.substring(name.length, c.length); } } return ""; } // 存储token setCookie("token", "xxxxx", 1); // 读取token var token = getCookie("token");
- 在跨域的情况下,可以使用postMessage进行通信。可以在登录页面请求后端接口获取token后,将其存储在localStorage中,然后使用postMessage将数据传递给前端首页。前端首页通过监听message事件,获取传递过来的数据。
// 登录页面存储token localStorage.setItem("token", "xxxxx"); // 前端首页接收token window.addEventListener("message", function (event) { if (event.origin === "http://www.login.com") { // 判断消息来源是否为登录页面的域名 var token = event.data; localStorage.setItem("token", token); } }); // 登录页面发送消息 var token = localStorage.getItem("token"); var targetOrigin = "http://www.homepage.com"; // 前端首页的域名 parent.postMessage(token, targetOrigin);
- 在跨域的情况下,可以通过url传递数据。可以在登录页面请求后端接口获取token后,将其放到url参数中,然后在重定向到前端首页时,将token作为url参数传递给前端首页。前端首页通过解析url参数,获取token值。
// 存储token到url参数 var url = "http://www.homepage.com?token=xxxxx"; window.location.href = url; // 获取url参数中的token值 function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) { return decodeURIComponent(r[2]); } return null; } var token = getQueryString("token");
解决 无用评论 打赏 举报
悬赏问题
- ¥15 llama3中文版微调
- ¥15 时间序列预测算法 预测结果出现负值
- ¥15 在win系统Django虚拟环境下载mysqlclient报错
- ¥15 pg数据库导入数据序列重复
- ¥15 三分类机器学习模型可视化分析
- ¥15 本地测试网站127.0.0.1 已拒绝连接,如何解决?(标签-ubuntu)
- ¥50 Qt在release捕获异常并跟踪堆栈(有Demo,跑一下环境再回答)
- ¥30 python,LLM 文本提炼
- ¥15 关于将inet引入的相关问题
- ¥15 关于一个倒计时的操作和显示设计