ajax登录

本文通过jquery实现简单的无刷新登录

1:首先要在router中配置登录请求,因为登录需要传user和pwd考虑到安全需用post请求

    {
        path:'/',
        method :'post',
        handler:user.login
    }

2:index.jade需要引用jquery-1.7.1.min文件

    script(type="text/javascript", src="/javascripts/jquery-1.7.1.min.js")

    上篇文章中已经写好登录见面,登录按钮方法为loginClick(),下面来写登录方法

     此处又用到了cookie保证客户端判断是否登录,cookie就不在介绍。 

      script(type="text/javascript").

        //登录
        function loginClick(){
            var user = $("#username").val();
            $.post("/", {"user": user}, function(data, status){
                data = $.parseJSON(data);
                if(status){
                    if(data.login){
                        $("#login_success").show().html("welcom " + user);
                        $("#login_fm").hide();
                        setCookie("user", user);
                    }else{
                        alert("用户名或密码错误!");
                    }
                }else{
                    alert("登录失败!");
                }
            });
        }

        $.post();jquery的post请求方式

        后端node处理方法如下

        exports.login = function(req, res){
           var data = tool.handlePostArg(req, res);
           req.session.name = data.user;
           res.write('{ "login": true }', "utf-8");
           res.end();
        };

        此时登录的post请求处理完成

        在浏览器中输入http://localhost:50022/

        点击 登录 按钮,完成登录

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
使用 Shiro 进行 Ajax 登录需要在登录请求中添加一个特殊的请求头 `X-Requested-With: XMLHttpRequest`,以便服务器能够识别这是一个 Ajax 请求。在 Shiro 的配置文件中,需要配置一个自定义的 filter,用于处理 Ajax 请求的登录。 以下是一个示例代码,用于实现 Shiro Ajax 登录: 1. 配置 Shiro 的自定义 filter ``` public class AjaxLoginFilter extends FormAuthenticationFilter { @Override protected boolean isAccessAllowed(ServletRequest request, ServletResponse response, Object mappedValue) { if (request.getHeader("X-Requested-With") != null && request.getHeader("X-Requested-With").equals("XMLHttpRequest")) { return true; } return super.isAccessAllowed(request, response, mappedValue); } @Override protected boolean onAccessDenied(ServletRequest request, ServletResponse response) throws Exception { HttpServletResponse httpServletResponse = (HttpServletResponse) response; httpServletResponse.setStatus(HttpStatus.UNAUTHORIZED.value()); return false; } } ``` 2. 配置 Shiro 的过滤器链 ``` @Bean public ShiroFilterFactoryBean shiroFilterFactoryBean(SecurityManager securityManager) { ShiroFilterFactoryBean shiroFilterFactoryBean = new ShiroFilterFactoryBean(); shiroFilterFactoryBean.setSecurityManager(securityManager); Map<String, String> filterChainDefinitionMap = new LinkedHashMap<>(); filterChainDefinitionMap.put("/login", "anon"); filterChainDefinitionMap.put("/logout", "logout"); filterChainDefinitionMap.put("/**", "authc"); shiroFilterFactoryBean.setFilterChainDefinitionMap(filterChainDefinitionMap); Map<String, Filter> filters = new HashMap<>(); filters.put("authc", new AjaxLoginFilter()); shiroFilterFactoryBean.setFilters(filters); return shiroFilterFactoryBean; } ``` 3. 在前端发送 Ajax 请求时添加特殊请求头,以便服务器能够识别这是一个 Ajax 请求 ``` $.ajax({ type: 'POST', url: '/login', beforeSend: function(xhr) { xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); }, data: {username: 'admin', password: 'admin'}, success: function(data) { console.log(data); }, error: function(xhr, status, error) { console.log(xhr); } }); ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值