【人人开源】集成通过Token认证统一登录功能

【人人开源】集成通过Token认证统一登录功能

 

后端 https://gitee.com/renrenio/renren-fast

前端 https://gitee.com/renrenio/renren-fast-vue

renren-fast是一个轻量级的Spring Boot2.1快速开发平台，其设计目标是开发迅速、学习简单、轻量级、易扩展；使用Spring Boot、Shiro、MyBatis、Redis、Bootstrap、Vue2.x等框架，包含：管理员列表、角色管理、菜单管理、定时任务、参数管理、代码生成器、日志管理、云存储、API模块(APP接口开发利器)、前后端分离等。

https://www.renren.io

 

前端

src/main.js

需要注释掉原有的代码

 

/* eslint-disable no-new */
// new Vue({
//   el: '#app',
//   router,
//   store,
//   template: '',
//   components: { App }
// })

加入以下代码

/**
 * 获取请求参数
 * @param name
 * @returns {string|null}
 */
function getQueryString (name) {
  let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i')
  let r = null
  try {
    r = window.location.href.split('?')[1].match(reg)
  } catch (e) {
  }
  if (r != null) {
    return unescape(r[2])
  }
  return null
}

// window.onload = function () {
// 1.获取authToken参数
let authToken = getQueryString('authToken')
// 2.判断是否需要进行免登
if (authToken && authToken !== 'undefined') {
  console.info('进行免登中...')
  let objConfig = {
    url: 'http://127.0.0.1:8080/renren-fast/sys/auth',
    data: {
      'authToken': authToken
    },
    success: function (obj) {
      console.info(obj)
      // 3.设置token到Cookie
      window.document.cookie = 'token=' + obj.token
      // 4.true如果是登陆页面则跳转到首页
      if (window.location.href.indexOf('login') !== -1) {
        window.location.href = 'http://localhost:8001/'
      } else {
        // 4.false否则直接进入该页面
        /* eslint-disable no-new */
        new Vue({
          el: '#app',
          router,
          store,
          template: '',
          components: { App }
        })
      }
    }
  }
  // ============ JSONP Start ==============
  window['callback'] = function (object) {
    objConfig.success(object)
  }
  let script = document.createElement('script')
  script.src = objConfig.url + '?fn=callback'
  for (let key in objConfig.data) {
    script.src = script.src + '&' + key + '=' + objConfig.data[key]
  }
  document.getElementsByTagName('body')[0].appendChild(script)
  // ============ JSONP End ==============
} else {
  new Vue({
    el: '#app',
    router,
    store,
    template: '',
    components: { App }
  })
}
// }

 

后端

 

配置ShiroConfig

io.renren.config.ShiroConfig#ShiroFilterFactoryBean

filterMap.put("/sys/auth", "anon");

 

 

添加Controller

@GetMapping("/sys/auth")
public void auth(String authToken, HttpServletResponse response){
   SysUserTokenService sysUserTokenService = SpringUtil.getBean(SysUserTokenService.class);


   // TODO 1.通过authToken换取用户信息（Redis / 接口）
   // TODO 2.根据用户信息（手机号/用户名等...）获取用户id 
   
   // 3.根据用户id获取token进行登陆
   R r = sysUserTokenService.createToken(Integer.valueOf(authToken));

   response.setHeader("Access-Control-Allow-Credentials", "true");
   response.setHeader("Access-Control-Allow-Origin", "*");
   response.setHeader("Content-Type", "application/javascript; charset=utf-8");
   JSONObject j = new JSONObject();
   j.put("token", r.get("token").toString());
   try {
      response.getWriter().write(StrUtil.format("callback({\"token\":\""+r.get("token").toString()+"\"})"));
   } catch (IOException e) {
      e.printStackTrace();
   }
   System.out.println("免登成功");
}

 

 

请求地址

http://localhost:8001/#/home?authToken=1