JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

這篇具有很好參考價值的文章主要介紹了JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)。希望對大家有所幫助。如果存在錯誤或未考慮完全的地方，請大家不吝賜教，您也可以點(diǎn)擊"舉報違法"按鈕提交疑問。

引出

使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)文章來源地址http://www.zghlxwxcb.cn/news/detail-488081.html

小項目要求

（一）題目要求
使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

（二）數(shù)據(jù)庫設(shè)計（10分）
創(chuàng)建數(shù)據(jù)庫woniu_note
（1）用戶表：t_user，必要字段包含：用戶名（username）、密碼（passwd）
（2）文件夾表：t_folder，必要字段包含：文件夾id（id）、文件夾名（folder_name）
（3）筆記表：t_note，必要字段包含：筆記id（id）、筆記標(biāo)題（title）、筆記內(nèi)容（content）、關(guān)聯(lián)文件夾表id(folder_id)

（三）項目需求（共90分）
（1）實現(xiàn)用戶登錄（10分）
① 登錄成功可跳轉(zhuǎn)主頁（5分）
② 要求使用過濾器驗證用戶的登陸權(quán)限（5分）
③ JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

（2）實現(xiàn)筆記列表查詢功能（20分）
① 備注：文件夾是通過筆記表（t_note）連接查詢文件夾表（t_folder）獲取，否則不得分（10分）

（3）實現(xiàn)筆記列表分頁顯示功能（20分）
① 備注：文件夾是通過筆記表（t_note）連接查詢文件夾表（t_folder）獲取，否則不得分（10分）
JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

（4）實現(xiàn)添加筆記功能（10分）
JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

（5）實現(xiàn)修改筆記功能（20分）
① 要求數(shù)據(jù)回顯（10分）
② 修改成功（10分）

（6）實現(xiàn)刪除筆記功能（10分）

固定的東西

1.pom.xml文件配置 + web.xml文件配置

pom.xml文件

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.tianju</groupId>
  <artifactId>javawebTest0612</artifactId>
  <packaging>war</packaging>
  <version>1.0-SNAPSHOT</version>
  <properties>
    <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    <maven.compiler.source>1.8</maven.compiler.source>
    <maven.compiler.target>1.8</maven.compiler.target>
  </properties>

  <dependencies>
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>javax.servlet-api</artifactId>
      <version>4.0.1</version>
      <scope>provided</scope>
    </dependency>

    <!--    jsp相關(guān)-->
    <dependency>
      <groupId>javax.servlet.jsp</groupId>
      <artifactId>javax.servlet.jsp-api</artifactId>
      <version>2.3.3</version>
    </dependency>

    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>jstl</artifactId>
      <version>1.2</version>
    </dependency>

    <dependency>
      <groupId>taglibs</groupId>
      <artifactId>standard</artifactId>
      <version>1.1.2</version>
    </dependency>

    <!--    數(shù)據(jù)庫相關(guān)-->
    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>8.0.20</version>
    </dependency>

    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>1.2.16</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>5.2.22.RELEASE</version>
    </dependency>

    <!--    其他-->
    <dependency>
      <groupId>org.projectlombok</groupId>
      <artifactId>lombok</artifactId>
      <version>1.18.22</version>
    </dependency>

    <dependency>
      <groupId>commons-io</groupId>
      <artifactId>commons-io</artifactId>
      <version>2.5</version>
    </dependency>

    <!--    工具包-->
    <dependency>
      <groupId>cn.hutool</groupId>
      <artifactId>hutool-all</artifactId>
      <version>5.8.11</version>
    </dependency>

    <!--    fastjson包-->
    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>fastjson</artifactId>
      <version>1.2.76</version>
    </dependency>

  </dependencies>
</project>

web.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
</web-app>

2.util里面JDBC的DBUtils + 字符串工具StringUtils

DBUtils.java文件：

package com.tianju.util;
import com.alibaba.druid.pool.DruidDataSource;
import org.springframework.jdbc.core.JdbcTemplate;

public class DBUtils {
    private static DruidDataSource dataSource =null;
    static {
        String driverClassname = "com.mysql.cj.jdbc.Driver";
        String ip = "127.0.0.1:3306/javaweb";
//        String ip = ConfigMap.getConfig().get("ip");
        // jdbc:mysql://127.0.0.1:3306/javaweb06?useUnicode=true&characterEncoding=UTF-8&userSSL=false&serverTimezone=GMT%2B8
        String url = "jdbc:mysql://"+ip+"?useSSL=false&serverTimezone=Asia/Shanghai&allowPublicKeyRetrieval=true";
//        String url = "jdbc:mysql://"+"127.0.0.1:3306/javaweb"+"?useSSL=false&serverTimezone=Asia/Shanghai&allowPublicKeyRetrieval=true";
        String username = "root";
        String password = "123";
        dataSource = new DruidDataSource();
        dataSource.setDriverClassName(driverClassname);
        dataSource.setUrl(url);
        dataSource.setUsername(username);
        dataSource.setPassword(password);
    }

    /**
     *
     * @return 返回一個JdbcTemplate對象
     */
    public static JdbcTemplate getJdbcTemplate(){
        return new JdbcTemplate(dataSource);
    }
}

StringUtils.java文件

package com.tianju.util;

/**
 * 防止前端傳過來為null 或者 ""
 */
public class StringUtils {
    public static Boolean isBlank(String str){
        if(str==null || str.trim().equals("")){
            return true;
        }
        return false;
    }
}

3.entity里面的PageInfo分頁實體類+ResData響應(yīng)標(biāo)準(zhǔn)格式

PageInfo.java

package com.tianju.entity;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

import java.util.List;

/**
 * 和分頁相關(guān)的實體類
 */
@Data
@AllArgsConstructor
@NoArgsConstructor
public class PageInfo<T> {
    private Integer pageNum; // 當(dāng)前是第幾頁，如果沒有輸入，默認(rèn)是第一頁
    private Integer pageSize; // 每頁顯示的數(shù)據(jù)條數(shù)，百度默認(rèn)一頁10條
    private Integer total; // 總條數(shù)；
    private Integer pages; // 總頁數(shù)；
    private List<T> list; // 傳給前端的list
}

ResData.java

package com.tianju.entity;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;

/**
 * 響應(yīng)的實體類
 */
@Data
@NoArgsConstructor
@AllArgsConstructor
public class ResData {
    private Integer code;
    private String msg;
    private Object data;
}

4.filter里面的編碼CharacterEncodingFilter和權(quán)限LoginAuthorFilter

CharacterEncodingFilter.java文件

package com.tianju.filter;

import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import java.io.IOException;

/**
 * 解決編碼問題的過濾器
 */
@WebFilter("/*")
public class CharacterEncodingFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {

    }

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
        // 編碼問題
        request.setCharacterEncoding("UTF-8");
        response.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charset=utf-8");
        // 一定要記得放行
        chain.doFilter(request, response);

    }

    @Override
    public void destroy() {

    }
}

LoginAuthorFilter.java文件

package com.tianju.filter;

import javax.servlet.*;
import javax.servlet.annotation.WebFilter;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;

/**
 * 控制權(quán)限
 */
@WebFilter("/*")
public class LoginAuthorFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {

    }

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {
        HttpServletRequest req = (HttpServletRequest) request;
        HttpServletResponse resp = (HttpServletResponse) response;
        String requestURI = req.getRequestURI();
        // 1.不登錄也可以訪問的連接，放行
        if (requestURI.contains("/js/")
                || requestURI.contains("/bootstrap/")
                || requestURI.contains("/css/")
                || requestURI.contains("/img/")
                || requestURI.contains("/user/login")
                || requestURI.contains("/user/login.jsp")
        ){
            chain.doFilter(request, response);
        }else {
            // 2.其他連接必須登陸后才能訪問
            HttpSession session = req.getSession();
            Object user = session.getAttribute("user");
            // 如果沒有登陸，就去登陸頁面
            if (user==null){
                resp.sendRedirect(req.getContextPath()+"/user/login.jsp");
            }else {
                //登陸了,就放行
                chain.doFilter(request, response);
            }
        }
    }

    @Override
    public void destroy() {

    }
}

5.前端固定的js包和bootstrap包

見本文的代碼包

小項目源碼

見本文的代碼包

JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

總結(jié)

使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)

到了這里，關(guān)于JavaWeb小項目——【源碼】使用Vue+axios+Servlet+Lombok+JDBC+MySQL技術(shù)棧實現(xiàn)云筆記管理系統(tǒng)案例的開發(fā)的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！