【JavaWeb】头条新闻纯JavaWeb项目实现 项目搭建 数据库工具类导入 跨域问题 Postman 第一期 (前端Vue3+Vite)

2024-02-04 00:44
文章标签 java javascript 工具 实现 问题 项目 vue web vue3 搭建 数据库 前端 导入 frontend postman 跨域 vite 第一期 头条新闻

本文主要是介绍【JavaWeb】头条新闻纯JavaWeb项目实现 项目搭建 数据库工具类导入 跨域问题 Postman 第一期 (前端Vue3+Vite)，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

文章目录

  • 一、项目简介
    • 1.1 微头条业务简介
    • 1.2 技术栈介绍
  • 二、项目部署
  • 三、准备工具类
    • 3.1 异步响应规范格式类
    • 3.2 MD5加密工具类
    • 3.3 JDBCUtil连接池工具类
    • 3.4 JwtHelper工具类
    • 3.4 JSON转换的WEBUtil工具类
  • 四、准备各层的接口和实现类
    • 4.1 准备实体类和VO对象
    • 4.2 DAO层接口和实现类
    • 4.3 Service层接口和实现类
    • 4.4 Controller层接口和实现类
      • 4.4.1 PortalController
  • 五、开发跨域CORS过滤器
    • 5.1 什么是跨域
    • 5.2 为什么会产生跨域
    • 5.3 如何解决跨域
  • 六、PostMan测试工具
    • 6.1 什么是PostMan
    • 6.2 下载PostMan
    • 6.3 怎么使用PostMan
  • 总结
    • 更新数据库存储的数据时间

一、项目简介

1.1 微头条业务简介

头条新闻发布和浏览平台,主要包含业务如下:

  • 用户功能
    • 注册功能
    • 登录功能
  • 头条新闻
    • 新闻的分页浏览
    • 通过标题关键字搜索新闻
    • 查看新闻详情
    • 新闻的修改和删除
  • 权限控制
    • 用户只能修改和自己发布的头条新闻

1.2 技术栈介绍

前端技术栈

  • ES6作为基础JS语法
  • nodejs用于运行环境
  • npm用于项目依赖管理工具
  • vite用于项目的构建架工具
  • Vue3用于项目数据的渲染框架
  • Axios用于前后端数据的交互
  • Router用于页面的跳转
  • Pinia用于存储用户的数据
  • LocalStorage作为用户校验token的存储手段
  • Element-Plus提供组件

后端技术栈

  • JAVA作为开发语言,版本为JDK17
  • Tomcat作为服务容器,版本为10.1.7
  • Mysql8用于项目存储数据
  • Servlet用于控制层实现前后端数据交互
  • JDBC用于实现数据的CURD
  • Druid用于提供数据源的连接池
  • MD5用于用户密码的加密
  • Jwt用于token的生成和校验
  • Jackson用于转换JSON
  • Filter用于用户登录校验和跨域处理
  • Lombok用于处理实体类

二、项目部署

后端项目搭建：
2

  • controller 控制层代码,主要由Servlet组成
  • service 服务层代码,主要用于处理业务逻辑
  • dao 数据访问层,主要用户定义对于各个表格的CURD的方法
  • pojo 实体类层,主要用于存放和数据库对应的实体类以及一些VO对象
  • util 工具类包,主要用存放一些工具类
  • common 公共包,主要用户存放一些其他公共代码
  • filters 过滤器包,专门用于存放一些过滤器
  • test 测试代码包,专门用于定义一些测试的功能代码,上线前应该删掉,后期用maven可以自动处理掉

三、准备工具类

3.1 异步响应规范格式类

  • Result类
    • 针对返回结果规则的定义与限制
package com.doug.headline.common;/*** 全局统一返回结果类**/
public class Result<T> {// 返回码private Integer code;// 返回消息private String message;// 返回数据private T data;public Result(){}// 返回数据protected static <T> Result<T> build(T data) {Result<T> result = new Result<T>();if (data != null)result.setData(data);return result;}public static <T> Result<T> build(T body, Integer code, String message) {Result<T> result = build(body);result.setCode(code);result.setMessage(message);return result;}public static <T> Result<T> build(T body, ResultCodeEnum resultCodeEnum) {Result<T> result = build(body);result.setCode(resultCodeEnum.getCode());result.setMessage(resultCodeEnum.getMessage());return result;}/*** 操作成功* @param data  baseCategory1List* @param <T>* @return*/public static<T> Result<T> ok(T data){Result<T> result = build(data);return build(data, ResultCodeEnum.SUCCESS);}public Result<T> message(String msg){this.setMessage(msg);return this;}public Result<T> code(Integer code){this.setCode(code);return this;}public Integer getCode() {return code;}public void setCode(Integer code) {this.code = code;}public String getMessage() {return message;}public void setMessage(String message) {this.message = message;}public T getData() {return data;}public void setData(T data) {this.data = data;}
}
  • ResultCodeEnum 枚举类
    • 定义返回的自定义业务码 对应的 说明
package com.doug.headline.common;/*** 统一返回结果状态信息类**/
public enum ResultCodeEnum {/*** 自定义业务码 成功 200*/SUCCESS(200,"success"),USERNAME_ERROR(501,"usernameError"),PASSWORD_ERROR(503,"passwordError"),NOTLOGIN(504,"notLogin"),USERNAME_USED(505,"userNameUsed");private Integer code;private String message;private ResultCodeEnum(Integer code, String message) {this.code = code;this.message = message;}public Integer getCode() {return code;}public String getMessage() {return message;}
}

3.2 MD5加密工具类

package com.doug.headline.util;import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;public final class MD5Util {public static String encrypt(String strSrc) {try {char hexChars[] = { '0', '1', '2', '3', '4', '5', '6', '7', '8','9', 'a', 'b', 'c', 'd', 'e', 'f' };byte[] bytes = strSrc.getBytes();MessageDigest md = MessageDigest.getInstance("MD5");md.update(bytes);bytes = md.digest();int j = bytes.length;char[] chars = new char[j * 2];int k = 0;for (int i = 0; i < bytes.length; i++) {byte b = bytes[i];chars[k++] = hexChars[b >>> 4 & 0xf];chars[k++] = hexChars[b & 0xf];}return new String(chars);} catch (NoSuchAlgorithmException e) {e.printStackTrace();throw new RuntimeException("MD5加密出错！！+" + e);}}
}

3.3 JDBCUtil连接池工具类

package com.doug.headline.util;import com.alibaba.druid.pool.DruidDataSourceFactory;import javax.sql.DataSource;
import java.io.IOException;
import java.io.InputStream;
import java.sql.Connection;
import java.sql.SQLException;
import java.util.Properties;public class JDBCUtil {private static ThreadLocal<Connection> threadLocal =new ThreadLocal<>();private static DataSource dataSource;// 初始化连接池static{// 可以帮助我们读取.properties配置文件Properties properties =new Properties();InputStream resourceAsStream = JDBCUtil.class.getClassLoader().getResourceAsStream("jdbc.properties");try {properties.load(resourceAsStream);} catch (IOException e) {throw new RuntimeException(e);}try {dataSource = DruidDataSourceFactory.createDataSource(properties);} catch (Exception e) {throw new RuntimeException(e);}}/*1 向外提供连接池的方法*/public static DataSource getDataSource(){return dataSource;}/*2 向外提供连接的方法*/public static Connection getConnection(){Connection connection = threadLocal.get();if (null == connection) {try {connection = dataSource.getConnection();} catch (SQLException e) {throw new RuntimeException(e);}threadLocal.set(connection);}return connection;}/*定义一个归还连接的方法 (解除和ThreadLocal之间的关联关系) */public static void releaseConnection(){Connection connection = threadLocal.get();if (null != connection) {threadLocal.remove();// 把连接设置回自动提交的连接try {connection.setAutoCommit(true);// 自动归还到连接池connection.close();} catch (SQLException e) {throw new RuntimeException(e);}}}
}
  • 添加jdbc.properties配置文件
driverClassName=com.mysql.cj.jdbc.Driver
url=jdbc:mysql://localhost:3306/top_news
username=root
password=root
initialSize=5
maxActive=10
maxWait=1000

3.4 JwtHelper工具类

  • 生成token口令
package com.doug.headline.util;import com.alibaba.druid.util.StringUtils;
import io.jsonwebtoken.*;import java.util.Date;public class JwtHelper {private static long tokenExpiration = 24*60*60*1000;private static String tokenSignKey = "123456";//生成token字符串public static String createToken(Long userId) {String token = Jwts.builder().setSubject("YYGH-USER").setExpiration(new Date(System.currentTimeMillis() + tokenExpiration)).claim("userId", userId).signWith(SignatureAlgorithm.HS512, tokenSignKey).compressWith(CompressionCodecs.GZIP).compact();return token;}//从token字符串获取useridpublic static Long getUserId(String token) {if(StringUtils.isEmpty(token)) {return null;}Jws<Claims> claimsJws = Jwts.parser().setSigningKey(tokenSignKey).parseClaimsJws(token);Claims claims = claimsJws.getBody();Integer userId = (Integer)claims.get("userId");return userId.longValue();}//判断token是否有效public static boolean isExpiration(String token){try {boolean isExpire = Jwts.parser().setSigningKey(tokenSignKey).parseClaimsJws(token).getBody().getExpiration().before(new Date());//没有过期，有效，返回falsereturn isExpire;}catch(Exception e) {//过期出现异常，返回truereturn true;}}
}

3.4 JSON转换的WEBUtil工具类

package com.doug.headline.util;import com.doug.headline.common.Result;
import com.fasterxml.jackson.databind.ObjectMapper;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;import java.io.BufferedReader;
import java.io.IOException;
import java.text.SimpleDateFormat;public class WebUtil {private static ObjectMapper objectMapper;// 初始化objectMapperstatic{objectMapper=new ObjectMapper();// 设置JSON和Object转换时的时间日期格式objectMapper.setDateFormat(new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"));}// 从请求中获取JSON串并转换为Objectpublic static <T> T readJson(HttpServletRequest request,Class<T> clazz){T t =null;BufferedReader reader = null;try {reader = request.getReader();StringBuffer buffer =new StringBuffer();String line =null;while((line = reader.readLine())!= null){buffer.append(line);}t= objectMapper.readValue(buffer.toString(),clazz);} catch (IOException e) {throw new RuntimeException(e);}return t;}// 将Result对象转换成JSON串并放入响应对象public static void writeJson(HttpServletResponse response, Result result){response.setContentType("application/json;charset=UTF-8");try {String json = objectMapper.writeValueAsString(result);response.getWriter().write(json);} catch (IOException e) {throw new RuntimeException(e);}}
}

四、准备各层的接口和实现类

4.1 准备实体类和VO对象

4.1
vo : value object 针对分页查询的对象
HeadlineQueryVo : 多页查询需要的数据

4.2 DAO层接口和实现类

4.2

BaseDao基础类,封装了公共的查询方法和公共的增删改方法

package com.doug.headline.dao;import com.doug.headline.util.JDBCUtil;
import java.lang.reflect.Field;
import java.sql.*;
import java.time.LocalDateTime;
import java.util.ArrayList;
import java.util.List;public class BaseDao {// 公共的查询方法  返回的是单个对象public <T> T baseQueryObject(Class<T> clazz, String sql, Object ... args) {T t = null;Connection connection = JDBCUtil.getConnection();PreparedStatement preparedStatement = null;ResultSet resultSet = null;int rows = 0;try {// 准备语句对象preparedStatement = connection.prepareStatement(sql);// 设置语句上的参数for (int i = 0; i < args.length; i++) {preparedStatement.setObject(i + 1, args[i]);}// 执行 查询resultSet = preparedStatement.executeQuery();if (resultSet.next()) {t = (T) resultSet.getObject(1);}} catch (Exception e) {throw new RuntimeException(e);} finally {if (null != resultSet) {try {resultSet.close();} catch (SQLException e) {throw new RuntimeException(e);}}if (null != preparedStatement) {try {preparedStatement.close();} catch (SQLException e) {throw new RuntimeException(e);}}JDBCUtil.releaseConnection();}return t;}// 公共的查询方法  返回的是对象的集合public <T> List<T> baseQuery(Class clazz, String sql, Object ... args){List<T> list =new ArrayList<>();Connection connection = JDBCUtil.getConnection();PreparedStatement preparedStatement=null;ResultSet resultSet =null;int rows = 0;try {// 准备语句对象preparedStatement = connection.prepareStatement(sql);// 设置语句上的参数for (int i = 0; i < args.length; i++) {preparedStatement.setObject(i+1,args[i]);}// 执行 查询resultSet = preparedStatement.executeQuery();ResultSetMetaData metaData = resultSet.getMetaData();int columnCount = metaData.getColumnCount();// 将结果集通过反射封装成实体类对象while (resultSet.next()) {// 使用反射实例化对象Object obj =clazz.getDeclaredConstructor().newInstance();for (int i = 1; i <= columnCount; i++) {String columnName = metaData.getColumnLabel(i);Object value = resultSet.getObject(columnName);// 处理datetime类型字段和java.util.Data转换问题if(value.getClass().equals(LocalDateTime.class)){value= Timestamp.valueOf((LocalDateTime) value);}Field field = clazz.getDeclaredField(columnName);field.setAccessible(true);field.set(obj,value);}list.add((T)obj);}} catch (Exception e) {throw new RuntimeException(e);} finally {if (null !=resultSet) {try {resultSet.close();} catch (SQLException e) {throw new RuntimeException(e);}}if (null != preparedStatement) {try {preparedStatement.close();} catch (SQLException e) {throw new RuntimeException(e);}}JDBCUtil.releaseConnection();}return list;}// 通用的增删改方法public int baseUpdate(String sql,Object ... args) {// 获取连接Connection connection = JDBCUtil.getConnection();PreparedStatement preparedStatement=null;int rows = 0;try {// 准备语句对象preparedStatement = connection.prepareStatement(sql);// 设置语句上的参数for (int i = 0; i < args.length; i++) {preparedStatement.setObject(i+1,args[i]);}// 执行 增删改 executeUpdaterows = preparedStatement.executeUpdate();// 释放资源(可选)} catch (SQLException e) {throw new RuntimeException(e);} finally {if (null != preparedStatement) {try {preparedStatement.close();} catch (SQLException e) {throw new RuntimeException(e);}}JDBCUtil.releaseConnection();}// 返回的是影响数据库记录数return rows;}
}

4.3 Service层接口和实现类

在这里插入图片描述

4.4 Controller层接口和实现类

4.4

BaseController 用于将路径关联到处理方法的基础控制器

  • 所有的Controller都要继承该类
package com.doug.headline.controller;import jakarta.servlet.ServletException;
import jakarta.servlet.http.HttpServlet;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;import java.io.IOException;
import java.lang.reflect.Method;public class BaseController extends HttpServlet {@Overrideprotected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {// 响应的MIME类型和乱码问题resp.setContentType("application/json;charset=UTF-8");String requestURI = req.getRequestURI();String[] split = requestURI.split("/");String methodName =split[split.length-1];// 通过反射获取要执行的方法Class clazz = this.getClass();try {Method method=clazz.getDeclaredMethod(methodName,HttpServletRequest.class,HttpServletResponse.class);// 设置方法可以访问method.setAccessible(true);// 通过反射执行代码method.invoke(this,req,resp);} catch (Exception e) {e.printStackTrace();throw new RuntimeException(e.getMessage());}}
}

4.4.1 PortalController

  • Portal 门户
/*** @Description: * 	门户 控制器 * 	即 当用户没有登录时候 所看到的页面（首页）* 	不需要做增删改查门户页请求都在这*/
@WebServlet("/portal")
public class PortalController extends BaseController{
}

五、开发跨域CORS过滤器

5.1 什么是跨域

  • 同源策略（Same origin policy）是浏览器最核心也最基本的安全功能，
  • 如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。
  • 可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。
  • 同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。
  • 所谓同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号

5.2 为什么会产生跨域

  • 前后端分离模式下,客户端请求前端服务器获取视图资源,
  • 然后客户端自行向后端服务器获取数据资源,
  • 前端服务器的 协议,IP和端口和后端服务器很可能是不一样的,这样就产生了跨域

5.2

即：
前后端分离项目中：

  1. 浏览器 访问 前端服务器 获取视图资源
  2. 浏览器 访问 后端服务器 获取数据资源
  3. 访问中 前端 和 后端 服务器的 协议 IP 端口 可能不同
  4. 导致跨域问题（报错 发送数据失败）

5.3 如何解决跨域

前端项目代理模式处理 :
1
后端跨域过滤器方式处理
5.3

  • CrosFilter过滤器
package com.doug.headline.filters;import jakarta.servlet.*;
import jakarta.servlet.annotation.WebFilter;
import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpServletResponse;import java.io.IOException;@WebFilter("/*")
public class CrosFilter implements Filter {@Overridepublic void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {HttpServletResponse response = (HttpServletResponse) servletResponse;HttpServletRequest request =(HttpServletRequest) servletRequest;response.setHeader("Access-Control-Allow-Origin", "*");response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, HEAD");response.setHeader("Access-Control-Max-Age", "3600");response.setHeader("Access-Control-Allow-Headers", "access-control-allow-origin, authority, content-type, version-info, X-Requested-With");// 非预检请求,放行即可,预检请求,则到此结束,不需要放行if(!request.getMethod().equalsIgnoreCase("OPTIONS")){filterChain.doFilter(servletRequest, servletResponse);}}
}
  • 之后用SpringMVC框架，一个@CrossOrigin 就可以解决跨域问题了

六、PostMan测试工具

6.1 什么是PostMan

  • Postman是一个 接口测试工具 ,
  • 在做接口测试的时候,Postman相当于一个客户端,
  • 它可以模拟用户发起的各类HTTP请求,将请求数据发送至服务端,获取对应的响应结果, 从而验证响应中的结果数据是否和预期值相匹配;
  • 并确保开发人员能够及时处理接口中的bug,进而保证产品上线之后的稳定性和安全性。
  • 它主要是用来模拟各种HTTP请求的(如:get/post/delete/put…等等),
  • Postman与浏览器的区别在于有的浏览器不能输出Json格式,而Postman更直观接口返回的结果。

6.2 下载PostMan

官网下载地址: https://www.getpostman.com

6.3 怎么使用PostMan

6.2

不使用postman ， 用浏览器获取 响应JSON数据，比较麻烦
1

  • 使用Postman 点击 send 后直接显示 比较方便
    • 就是模拟浏览器接收响应信息
      6.3

总结

更新数据库存储的数据时间

修改为当前时间：
UPDATE news_headline SET create_time=NOW(),update_time=NOW();
2

这篇关于【JavaWeb】头条新闻纯JavaWeb项目实现 项目搭建 数据库工具类导入 跨域问题 Postman 第一期 (前端Vue3+Vite)的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/675907。

相关文章

在React中引入Tailwind CSS的完整指南

在React中引入Tailwind CSS的完整指南

《在React中引入TailwindCSS的完整指南》在现代前端开发中,使用UI库可以显著提高开发效率,TailwindCSS是一个功能类优先的CSS框架,本文将详细介绍如何在Reac... 目录前言一、Tailwind css 简介二、创建 React 项目使用 Create React App 创建项目
阅读更多...
vue使用docxtemplater导出word

vue使用docxtemplater导出word

《vue使用docxtemplater导出word》docxtemplater是一种邮件合并工具,以编程方式使用并处理条件、循环,并且可以扩展以插入任何内容,下面我们来看看如何使用docxtempl... 目录docxtemplatervue使用docxtemplater导出word安装常用语法 封装导出方
阅读更多...
SpringBoot3实现Gzip压缩优化的技术指南

SpringBoot3实现Gzip压缩优化的技术指南

《SpringBoot3实现Gzip压缩优化的技术指南》随着Web应用的用户量和数据量增加,网络带宽和页面加载速度逐渐成为瓶颈,为了减少数据传输量,提高用户体验,我们可以使用Gzip压缩HTTP响应,... 目录1、简述2、配置2.1 添加依赖2.2 配置 Gzip 压缩3、服务端应用4、前端应用4.1 N
阅读更多...
Java编译生成多个.class文件的原理和作用

Java编译生成多个.class文件的原理和作用

《Java编译生成多个.class文件的原理和作用》作为一名经验丰富的开发者,在Java项目中执行编译后,可能会发现一个.java源文件有时会产生多个.class文件,从技术实现层面详细剖析这一现象... 目录一、内部类机制与.class文件生成成员内部类（常规内部类）局部内部类（方法内部类）匿名内部类二、
阅读更多...
SpringBoot实现数据库读写分离的3种方法小结

SpringBoot实现数据库读写分离的3种方法小结

《SpringBoot实现数据库读写分离的3种方法小结》为了提高系统的读写性能和可用性,读写分离是一种经典的数据库架构模式,在SpringBoot应用中,有多种方式可以实现数据库读写分离,本文将介绍三... 目录一、数据库读写分离概述二、方案一：基于AbstractRoutingDataSource实现动态
阅读更多...
Python FastAPI+Celery+RabbitMQ实现分布式图片水印处理系统

Python FastAPI+Celery+RabbitMQ实现分布式图片水印处理系统

《PythonFastAPI+Celery+RabbitMQ实现分布式图片水印处理系统》这篇文章主要为大家详细介绍了PythonFastAPI如何结合Celery以及RabbitMQ实现简单的分布式... 实现思路FastAPI 服务器Celery 任务队列RabbitMQ 作为消息代理定时任务处理完整
阅读更多...
Springboot @Autowired和@Resource的区别解析

Springboot @Autowired和@Resource的区别解析

《Springboot@Autowired和@Resource的区别解析》@Resource是JDK提供的注解,只是Spring在实现上提供了这个注解的功能支持,本文给大家介绍Springboot@... 目录【一】定义【1】@Autowired【2】@Resource【二】区别【1】包含的属性不同【2】@
阅读更多...
springboot循环依赖问题案例代码及解决办法

springboot循环依赖问题案例代码及解决办法

《springboot循环依赖问题案例代码及解决办法》在SpringBoot中,如果两个或多个Bean之间存在循环依赖（即BeanA依赖BeanB,而BeanB又依赖BeanA）,会导致Spring的... 目录1. 什么是循环依赖？2. 循环依赖的场景案例3. 解决循环依赖的常见方法方法 1：使用 @La
阅读更多...
Java枚举类实现Key-Value映射的多种实现方式

Java枚举类实现Key-Value映射的多种实现方式

《Java枚举类实现Key-Value映射的多种实现方式》在Java开发中,枚举(Enum)是一种特殊的类,本文将详细介绍Java枚举类实现key-value映射的多种方式,有需要的小伙伴可以根据需要... 目录前言一、基础实现方式1.1 为枚举添加属性和构造方法二、http://www.cppcns.co
阅读更多...
使用Python实现快速搭建本地HTTP服务器

使用Python实现快速搭建本地HTTP服务器

《使用Python实现快速搭建本地HTTP服务器》：本文主要介绍如何使用Python快速搭建本地HTTP服务器,轻松实现一键HTTP文件共享,同时结合二维码技术,让访问更简单,感兴趣的小伙伴可以了... 目录1. 概述2. 快速搭建 HTTP 文件共享服务2.1 核心思路2.2 代码实现2.3 代码解读3.
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2