之前某些原因,整理了一个小的Demo,用于演示。个人认为在SSM前后端不分离的基础上在前端处理上比较麻烦一点之后就是注解的使用。总结一些对比,仅是自己掌握的,不够严谨,不足之处请大佬批评指正.

路由控制:前后端分离的情况后端在任何都会返回一个json数据,不涉及路由处理,即页面跳转全是由前端自己完成.不分离的情况,路由跳转一般由后端完成,而且携带数据,通过重定向或请求转发实现,依赖Servlet中的内置对象.

返回数据:前后端分离的情况后端返回的整体划分上只有执行逻辑响应的消息实体类和对应的需要展示的数据分页类对应的JSON.不分离后端返回的是经过视图解析器处理前的字符串.

分离:

package com.liruilong.model;

/**
* @Description :返回消息的实体类
* @Author: Liruilong
* @Date: 2019/12/19 17:34
*/
public class RespBean {
private Integer status;
private String msg;
private Object obj; public static RespBean ok(String msg){
return new RespBean(200, msg, null);
}
public static RespBean ok(String msg, Object obj){
return new RespBean(200, msg, obj);
}
public static RespBean error(String msg){
return new RespBean(500, msg, null);
}
public static RespBean error(String msg, Object obj){
return new RespBean(200, msg, obj);
}
private RespBean() {
}
private RespBean(Integer status, String msg, Object obj) {
this.status = status;
this.msg = msg;
this.obj = obj;
} public static RespBean build() {
return new RespBean();
} //getter.setter方法省略
package com.liruilong.model;

import java.util.List;

/**
* @Description : 分页
* @Author: Liruilong
* @Date: 2019/12/31 11:20
*/
public class RespPageBean {
/*总记录树*/
private Long total;
/*分页数据*/
private List<?> data;
public RespPageBean() {
}
public RespPageBean(Long total, List<?> data) {
this.total = total;
this.data = data;
} //getter.setter方法省略
}
  @GetMapping("/")
public RespPageBean getEmploteeByPge(@RequestParam(defaultValue = "1") Integer page, @RequestParam(defaultValue = "10") Integer size,Employee employee, Date[] beginDateScope) {
return employeeService.getEmploteeByPge(page, size, employee, beginDateScope); } @DeleteMapping("/{id}")
public RespBean deleteEmpByEid(@PathVariable Integer id) {
if (employeeService.deleteEmpByEid(id) == 1) {
return RespBean.ok("删除成功!");
}
return RespBean.error("删除失败!");
}

不分离:

  //初始化添加商品
@RequestMapping("toAddGoods")
public String toAddGoods(Model model) throws Exception {
adminGoodsServiceimpl.toAddGoods(model);
adminTypeServiceimpl.listGoodsType(model);
return "admin/addGoods";
}
//处理添加商品
@RequestMapping("addGoods")
public String addGoods(@ModelAttribute("goods") Goods goods, Model model, HttpServletRequest request) throws Exception {
adminGoodsServiceimpl.addGoods(goods, model, request);
if (request.getParameter("updateAct").equals("update")) {
return "forward:/adminGoods/selectGoods.do?act=updateSelect";
} else {
return "forward:/adminGoods/selectGoods.do?act=main";
}

请求方式:前后端分离的情况我只知道以Rest风格的方式处理,当执行增删改查对应http请求方法POST,DELEE,PUT,GET,一般以异步请求为主,不分离情况一般同步异步结合。请求上以GET和POST为主。

分离:

    //传递json的post请求
export const postRequest = (url, params) => {
return axios({
method: 'POST',
url: `${base}${url}`,
data: params,
})
}
// put请求封装
export const putRequest = (url, params) => {
return axios({
method: 'put',
url: `${base}${url}`,
data: params,
})
}
// get请求封装
export const getRequest = (url, params) => {
return axios({
method: 'get',
url: `${base}${url}`,
data: params,
})
}
// delete请求封装
export const deleteRequest = (url, params) => {
return axios({
method: 'delete',
url: `${base}${url}`,
data: params,
})

不分离:

<script type="text/javascript">
function submitorder(total) {
if (window.confirm("是否真的提交订单,提交后不可再修改订单信息!")) {
window.location.href = "${pageContext.request.contextPath}/order/orderSubmit.do?amount=" + total;
return true;
}
return false;
}
</script>
  <form action="order/pay.do" method="post" name="payForm">
<input type="hidden" name="ordersn" value="${ordersn}"/>
<input type="image" src="data:images/before/Chinapay_logo.jpg" onclick="gogo()"/>
</form>
$.ajax({
type: "POST",// 请求方式
url: "http://localhost:8083/addDemo_war_exploded/system/log/",// 发送请求地址
dataType: "json",
async: true,
contentType: "application/json;charsetset=UTF-8",//必须
data: JSON.stringify({
"operate": operate.val(),
"hrname": hrname.val()
}),
success: function (mainQueryList) {
init();
}
}
)

注解使用:前后端分离,接收的数据是Json时需要@RequestBody作用在方法参数上.用于将POST请求数据转化为实体类.返回数据时使用@ResponseBody,作用在方法上,当然对于全局的也可以使用@RespController注解.前后端不分离一般使用@RequestMapping,请求方式不用管。

分离:

package com.liruilong.hros.controller.emp;

import com.liruilong.hros.model.*;
import com.liruilong.hros.service.*;
import com.liruilong.hros.service.utils.POIUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile; import java.io.IOException;
import java.util.Date;
import java.util.List; /**
* @Description :
* @Author: Liruilong
* @Date: 2019/12/31 11:19
*/ @RestController
@RequestMapping("/employee/basic")
public class EmpBasicController { @Autowired
EmployeeService employeeService;
@Autowired
NationService nationService;
@Autowired
PoliticsstatusService politicsstatusService;
@Autowired
JobLevelService jobLevelService;
@Autowired
PositionService positionService;
@Autowired
DepartmentService departmentService;
@Autowired
EmployeeecService employeeecService; @GetMapping("/")
public RespPageBean getEmploteeByPge(@RequestParam(defaultValue = "1") Integer page, @RequestParam(defaultValue = "10") Integer size,Employee employee, Date[] beginDateScope) {
return employeeService.getEmploteeByPge(page, size, employee, beginDateScope); } @DeleteMapping("/{id}")
public RespBean deleteEmpByEid(@PathVariable Integer id) {
if (employeeService.deleteEmpByEid(id) == 1) {
return RespBean.ok("删除成功!");
}
return RespBean.error("删除失败!");
} @DeleteMapping("/many/")
public RespBean deleteEmpByEids(Integer[] ids) {
if (employeeService.deleteEmpByEids(ids) == ids.length) {
return RespBean.ok("删除成功!");
}
return RespBean.error("删除失败!");
} @PostMapping("/")
public RespBean addEmp(@RequestBody Employee employee) {
if (employeeService.addEmp(employee) == 1) {
return RespBean.ok("添加成功!");
}
return RespBean.error("添加失败!");
} @PutMapping("/")
public RespBean updateEmp(@RequestBody Employee employee) {
if (employeeService.updateEmp(employee) == 1) {
return RespBean.ok("更新成功!");
}
return RespBean.error("更新失败!");
} @GetMapping("/nations")
public List<Nation> getAllNations() {
return nationService.getAllNations();
} @GetMapping("/politicsstatus")
public List<Politicsstatus> getAllPoliticsstatus() {
return politicsstatusService.getAllPoliticsstatus();
} @GetMapping("/joblevels")
public List<JobLevel> getAllJobLevels() {
return jobLevelService.getAllJobLevels();
} @GetMapping("/positions")
public List<Position> getAllPositions() {
return positionService.getAllPositions();
} @GetMapping("/deps")
public List<Department> getAllDepartments() {
return departmentService.getAllDepartments();
} @GetMapping("/maxWorkID")
public RespBean maxWorkID() {
RespBean respBean = RespBean.build().setStatus(200)
.setObj(String.format("%08d", employeeService.maxWorkID() + 1));
return respBean;
} /**
* @Author Liruilong
* @Description 文件下载
* @Date 19:04 2020/1/1
* @Param []
* @return org.springframework.http.ResponseEntity<byte[]>
**/ @GetMapping("/export")
public ResponseEntity<byte[]> exportData() {
List<Employee> list = (List<Employee>) employeeService.getEmploteeByPge(null, null, null,null).getData();
return POIUtils.employee2Excel(list);
} /**
* @Author Liruilong
* @Description 文件导出
* @Date 19:48 2020/1/1
* @Param [file]
* @return com.liruilong.hros.model.RespBean
**/ @PostMapping("/import")
public RespBean importData(MultipartFile file) throws IOException {
List<Employee> list = POIUtils.excel2Employee(file, nationService.getAllNations(), politicsstatusService.getAllPoliticsstatus()
, departmentService.getAllDepartmentsWithOutChildren(), positionService.getAllPositions(), jobLevelService.getAllJobLevels());
if (employeeService.addEmps(list) == list.size()) {
return RespBean.ok("上传成功");
}
return RespBean.error("上传失败");
}
}

不分离:

package com.qst.controller.admin;

import com.qst.pojo.Auser;
import com.qst.service.admin.AdminServiceimpl;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping; import javax.servlet.http.HttpSession; @Controller
@RequestMapping("admin")
public class AdminController { @Autowired
private AdminServiceimpl adminService;
/*
初始化登录页面
*/
@RequestMapping("login")
public String login(@ModelAttribute("auser") Auser auser) {
return "admin/login";
}
/*
处理登录页面
*/
@RequestMapping("tologin")
public String tologin(@ModelAttribute Auser auser, Model model, HttpSession session) throws Exception { return adminService.login(auser, model, session) ? "admin/main" : "admin/login"; }
/*
退出系统
*/
@RequestMapping("exit")
public String exit(@ModelAttribute Auser auser, HttpSession session) {
session.invalidate();
return "admin/login";
}
}

SSM前后端分离/不分离对比Demo的更多相关文章

  1. Web前后端:如何分离,如何解耦?

    摘要:在本文中我们一起来探讨一下为什么要在软件开发中进行前后端的分离,如何做到前后端分离,如何解耦. 简单地说,就是要把复杂的问题简单化,把一个从0到N的问题转化为N个0到1的问题.另一个相近的说法就 ...

  2. SSM 前后端分离 这里controll层的返回值和之前那个不一样

    1.先创建实体类: 2.创建mapper层 package cn.kgc.mapper; import cn.kgc.Account;import org.apache.ibatis.annotati ...

  3. SSM前后端分离 ssm+html+js(ajax) 这种controll层的返回值是结合或者网址

    提示: 1.单表查询多条数据用 list<实体类名字> mapper层 1.1单表查询单条数据用  对象 2.两表关联查多条 list<map<String,Object> ...

  4. spring boot+vue前后端项目的分离(我的第一个前后端分离项目)

    文章目录 1.前端vue的搭建 2.后端项目的构建 pom文件中引入的jar包 yml文件用来配置连接数据库和端口的设置 application.property进行一些整合 controller层( ...

  5. 使用nodewebx进行前后端开发环境分离

    下载nodewebx(windows环境) npm install nodewebx npm install inherits 为什么要下载inherits,因为nodewebx依赖它... 构建目录 ...

  6. SSM框架中的前后端分离

    认识前后端分离 在传统的web应用开发中,大多数的程序员会将浏览器作为前后端的分界线.将浏览器中为用户进行页面展示的部分称之为前端,而将运行在服务器,为前端提供业务逻辑和数据准备的所有代码统称为后端. ...

  7. 前后端分离及React的一些研究

    前言 在对英才网企业线前端不断的完善过程中,我们尝试进行了前后端分离,引入Node环境.以及在使用React的过程中,自行开发DOM渲染框架,解决React兼容低版本IE的问题,在这个过程中,我们有了 ...

  8. DevOps 视角的前后端分离与实战

    本文作者:CODING - 廖红坤 前言 随着微前端.微服务等技术理念和架构的蓬勃发展,我们已经没必要去讨论为什么要前后端分离这种话题,前后端分离已成为互联网项目开发的标准模式.前后端在各自的领域发展 ...

  9. 架构设计:前后端分离之Web前端架构设计

    在前面的文章里我谈到了前后端分离的一些看法,这个看法是从宏观的角度来思考的,没有具体的落地实现,今天我将延续上篇文章的主题,从纯前端的架构设计角度谈谈前后端分离的一种具体实现方案,该方案和我原来设想有 ...

随机推荐

  1. Nutch2.3 编译和安装配置

    Nutch2.3 编译和安装配置 [一].介绍 Nutch 是一个开源Java 实现的搜索引擎.它提供了我们运行自己的搜索引擎所需的全部工具.包括全文搜索和Web爬虫.现在Nutch分为两个版本:1. ...

  2. Delphi XE里的StrPas要注意哦(要让StrPas知道哪里是字符串结束)

    废话不多说了,直接上例子解说: procedure TForm1.Button1Click(Sender: TObject);var  aa: array[0..1]of AnsiChar;  bb1 ...

  3. Spring Boot 嵌入式Web容器

    目录 前言 1.起源 2.容器启动流程解析 2.1.获取应用类型 2.2.容器启动流程 3.加载 Web 容器工厂 4.总结 前言         最近在学习Spring Boot相关的课程,过程中以 ...

  4. c++ 基础知识回顾 继承 继承的本质就是数据的copy

    c++ 基础知识笔记 继承 什么是继承 继承就是子类继承父类的成员属性以及方法 继承的本质就是 数据的复制 是编译器帮我们做了很多操作 class Base { public: Base(){ cou ...

  5. $loj\ 2031\ [SDOI2016]$数字配对 网络流

    正解:网络流 解题报告: 我永远喜欢$loj$! 显然先预处理哪些$a$之间可以连边,然后考虑建两排点,连流量为$c_{i}\cdot c_{j}$,然后$ST$连$inf$,跑个费用流? 然后现在碰 ...

  6. $Noip2011/Luogu1314$ 聪明的质监员 二分+巧妙前缀和

    $Luogu$ $Sol$ 首先$W$一定是某个$w_i$.于是一种暴力方法就出炉了,枚举$W$再计算. 注意到,满足$S-Y$的绝对值最小的$Y$只可能是两种,一种是$<S$的最大的$Y$,一 ...

  7. 洛谷P1037 产生数 题解 搜索

    题目链接:https://www.luogu.com.cn/problem/P1037 题目描述 给出一个整数 \(n(n<10^{30})\) 和 \(k\) 个变换规则 \((k \le 1 ...

  8. Lyft Level 5 Challenge 2018 - Final Round (Open Div. 2) (前三题题解)

    这场比赛好毒瘤哇,看第四题好像是中国人出的,怕不是dllxl出的. 第四道什么鬼,互动题不说,花了四十五分钟看懂题目,都想砸电脑了.然后发现不会,互动题从来没做过. 不过这次新号上蓝名了(我才不告诉你 ...

  9. 1081 检查密码 (15分)C语言

    本题要求你帮助某网站的用户注册模块写一个密码合法性检查的小功能.该网站要求用户设置的密码必须由不少于6个字符组成,并且只能有英文字母.数字和小数点 .,还必须既有字母也有数字. 输入格式: 输入第一行 ...

  10. (httpd、php)2

    (一)再说编译安装httpd2.4 新特性: 1:MPM(多处理模块)支持运行为DSO(动态共享,动态加载模式)机制,以模块形式按需加载,支持动态加载 2:event MPM生产环境可用 3:支持异步 ...