spring boot+shiro项目中通过ajax和vue两种方式获取用户登录用户名

**

ajax方式

**

后台java代码

  @RequestMapping("/permission/selectUserMenu")
    public Result selectUserMenu(){
        //是否能通过shiro 获取User 对象
        Subject subject = SecurityUtils.getSubject();
        User user=(User)subject.getPrincipal();
        return new Result("200","success",list,user,null);
    }

前台ajax代码

 <script type="text/javascript">
     $(function() {
                $.ajax({
                url : "/permission/selectUserMenu",
                dataType : "json",
                type : "post",
                success : function(data) {
                  var html = "";
                    html +="<li><span>"+data.object.username+"</span></li>";
                  $("#lay").html(html);
                },
              })
            })

          </script>

上面的ajax代码主要是如何获取用名相关信息，如果你需要获取其他信息的话你可以在html +=后面继续拼接即可

**

vue的方式

**
我们可以将需要的地方封装成一个组件那么在后面的开发中我们可以直接调用主键标签即可实现，可以减少后续的工作量提高开发效率。

后端java代码和上面是一致的主要是讲前台代码
VUE主键封装

Vue.component('headmenu', {
    template: ` <li class="layui-nav-item  logined" style="display:none">
        <a class="fly-nav-avatar" href="javascript:;">
          <cite id="layui-hide-xs">{{user.username}}</cite>
      
          <img src="https://tva1.sinaimg.cn/crop.0.0.118.118.180/5db11ff4gw1e77d3nqrv8j203b03cweg.jpg">
        </a>
            <dl class="layui-nav-child">
                <dd><a href="/html/user/set.html?userset">基本设置</a></dd>
                <dd><a href="/html/user/set.html?userindex">用户中心</a></dd>
                  <hr style="margin: 5px 0;">
                  <dd><a href="/html/user/home.html">我的主页</a></dd>
                  <dd><a href="/html/user/set.html?userarticle">我的帖子</a></dd>
                  <dd><a href="/html/user/set.html?usermessage">我的消息</a></dd>
                  <hr style="margin: 5px 0;">
                <dd><a href="/logout" style="text-align: center;">退出</a></dd>
            </dl>
            </li>
             `,
         
 data: function () {
        return {
            menus: [],
            user:"",
        }
    },
    created: function () {
        var _this = this;
        $.ajax({
            url: "/permission/selectUserMenu",
            type: "get",
            dataType: "json",
            success: function (data) {
                 _this.user = data.object;
                if(data.list!=null) {
                    _this.menus = data.list;
                    $(".logined").css("display","block");
                }else{
                    $(".nologin").css("display","inline-block");
                }
            }
        });
    },    
    如何使用组件直接在前端写<headmenu></headmenu>即可。

上面的前端是用layui写的，封装的组件里面还有其他东西我就没复制，可以依葫芦画瓢的写，下面的代码我只复制了部分，主要是如何获取用户名信息的，其他无关的东西就不复制了。