当路由模式为hash怎么对接京东物流回调链接

最新推荐文章于 2024-05-09 14:59:09 发布

原创最新推荐文章于 2024-05-09 14:59:09 发布 · 387 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端

本文讲述了作者在处理京东物流授权回调时遇到的问题，通过在路由守卫中使用localStorage存储code并自动跳转，以及在目标页面清除code以避免重复使用，解决了hash路由下code获取和重定向的问题。

为什么我要写这篇文章呢？是因为最近在做这个需求，京东物流是需要自己手动点击授权后把返回的code拿去授权，刚开始以为一切都很顺利的，然而等我看到路由为hash时候，浏览器会忽略#后面的东西，所以是无法重新跳回之前页面。

其实如果你的路由模式为history并且后端已经配置了，恭喜你用不到这篇文章了

可以在路由守卫

我们这里解决的是点击跳转到京东物流后回调地址返回code的解决方法

可以在beforeEach这个钩子函数获取到token后写上

let code = new URL(location.href).searchParams.get("code");
    if (code) {
//当链接中有code的时候就存入到缓存中
      window.localStorage.setItem("code", code);
//在本页面打开
      window.open('你需要跳转的地址' '_self')
    }

然后就去你的跳转地址页面写上：

async created() {
    let codeNum = window.localStorage.getItem("code");
    if (codeNum) {
      //这里写上你的京东回调api接口
    }
    if (codeNum) {
//这里无论如何记得删除code，因为code只能用一次，不然会一直报错
      setTimeout(() => {
        window.localStorage.removeItem("code");
      }, 2000);
    }
  },