springboot + vue + iview 3.前后端结合·登陆(一)

本文介绍了如何使用SpringBoot作为后端,Vue和IView作为前端,实现一个登录功能。后端涉及SpringBoot项目创建、目录结构、Result对象用于返回结果、LoginVo实体类及UserController接口的编写,其中使用了@Valid进行数据校验。前端部分,详细讲解了Login.vue组件的数据和方法,以及处理跨域请求的方法,包括在config.index.js中设置proxyTable和在main.js中配置axios的基础URL。
摘要由CSDN通过智能技术生成

后端

1.创建一个springboot项目,具体过程我之前写过一篇博客,可以效仿。

idea创建springboot2+maven+springmvc项目

2.创建好目录

3.result中的3个类如下,用于通用的返回

Result

package com.csyd.result;

/**
 * 统一API响应结果封装
 */
public class Result {
    private int code;
    private String message;
    private Object data;

    public Result setCode(ResultCode resultCode) {
        this.code = resultCode.getCode();
        return this;
    }

    public int getCode() {
        return code;
    }

    public Result setCode(int code) {
        this.code = code;
        return this;
    }

    public String getMessage() {
        return message;
    }

    public Result setMessage(String message) {
        this.message = message;
        return this;
    }

    public Object getData() {
        return data;
    }

    public Result setData(Object data) {
        this.data = data;
        return this;
    }

}

ResultCode

package com.csyd.result;

/**
 * 响应码枚举,参考HTTP状态码的语义
 */
public enum ResultCode {
    SUCCESS(200, "sucess"),//成功
    FAIL(400, "失败"),//失败
    ;

    private Integer code;
    private String msg;

    ResultCode(int code) {
        this.code = code;
    }

    public Integer getCode() {
        return code;
    }

    public String getMsg() {
        return msg;
    }

    ResultCode(int code, String msg) {
        this.code = code;
        this.msg = msg;
    }
}

ResultGenerator

package com.csyd.result;

/**
 * 响应结果生成工具
 */
public class ResultGenerator {
    private static final String DEFAULT_SUCCESS_MESSAGE = "SUCCESS";

    public static Result genSuccessResult() {
        return new Result()
                .setCode(ResultCode.SUCCESS)
                .setMessage(DEFAULT_SUCCE
  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值