Después de leer este artículo, tome correctamente el proyecto de arquitectura springboot+jsp+vue+easyui

Proporciona la idea de utilizar el marco Springboot+jsp+ui (vue,layui,elementui,bootstrap5) para construir un proyecto y proporciona un código fuente para su referencia. Espero que le ayude y lo mejore@código fuente: https: //
gitee .com/FnTop/j4n-spring-boot-jsp-vue-easyui

concepto

• Spring Boot es un marco para crear rápidamente aplicaciones web basadas en Java. Ofrece funciones que simplifican el proceso de desarrollo, como la configuración automática y un servidor integrado.

• JSP (Java Server Pages) es una tecnología del lado del servidor basada en Java para generar páginas HTML dinámicamente. En Spring Boot, puede usar JSP para crear la capa de vista.

• Vue es un marco de interfaz de usuario liviano para crear interfaces de usuario. Utiliza un enfoque ascendente para crear aplicaciones y proporciona un modelo de desarrollo en componentes fácil de usar.

• EasyUI es una biblioteca de interfaz de usuario basada en jQuery que proporciona componentes de interfaz de usuario enriquecidos, como tablas, formularios, diseños, etc. Ayuda a crear rápidamente interfaces de aplicaciones web hermosas y fáciles de usar.

En resumen, Spring Boot JSP Vue EasyUI es un modelo de desarrollo de aplicaciones web que utiliza Spring Boot como marco de back-end, JSP como tecnología de capa de vista, Vue como marco de front-end y EasyUI como biblioteca de UI. Esta combinación puede proporcionar aplicaciones web que se desarrollan rápidamente, son fáciles de mantener y tienen una buena experiencia de usuario.

diagrama de flujo

explicación del proceso

Si no puede entender el código a continuación, simplemente extraiga una plantilla de proyecto para verlo
j4n-spring-boot-jsp-vue-easyui

ModelAndView (MVC para abreviar) Personalmente me refiero a los datos del modelo (modelo) y al análisis de vista (vista) para abreviar. Las siguientes descripciones se explican en términos de modelo y vista.

primer paso

Inicie el proyecto, visite la página de inicio del proyecto front-end de acuerdo con la dirección del índice y luego realice interacciones normales entre el front-end y el back-end.

segundo paso

interacción frontal

• La interfaz envía una solicitud, el controlador la recibe y el código procesa los datos de la base de datos y los encapsula en el modelo. Reenvío de páginas JSP a través de la vista. En la página jsp, el表达式los datos del modelo se representan a través del componente + easyui o el html original. Desde entonces, se ha completado la interacción dinámica de datos de página (interacción ModelAndView)

//简单的ModelAndView 
ModelAndView modelAndView = new ModelAndView();  
//假设 hello world 就是db的数据，//省略db的业务操作
modelAndView.addObject("message", "Hello World!");  
modelAndView.setViewName("hello");  
return modelAndView;  
当然也可以这样写，但是要配置下方yaml的视图解析。这是可以不配置，只是作者忘记了默认视图解析路径是啥
ModelAndView modelAndView = new ModelAndView();  
modelAndView.addObject("message", "Hello World!");  
return "hello";  

yaml

spring:
  mvc:
    view:
      prefix: /WEB-INF/views/
      suffix: .jsp

el-expresión

${
    
    message}

• Ajax envía una solicitud, RestContrller la recibe, el código procesa los datos de la base de datos, los encapsula en un objeto y devuelve los datos en formato JSON a la página jsp para su procesamiento. Cuando llegue a la página jsp, puede vincular y representar los datos solo a través del marco easyui. Los datos adquiridos también se pueden convertir en datos a través de vue. Debido a que la página de inicialización montada monta el componente easyUI, el componente easyui está asociado con datos (interacción JSON)

/**
@RestController底层是下方两个注解。@Controller 默认返回是modelandview 。如果加了@ResponseBody则返回是JSON
RestController是写在类上的，相当给所有方法加上了@ResponseBody。如果一个控制层要同时存在modelandview 和JSON返回。那类上的注解必须是Controller,需要modelandview 返回的只要在方法上加上@ResponseBody即可

*/
@Controller
@ResponseBody

• Otro tipo de interacción también es una solicitud Ajax, pero puede transportar datos modelo y JSON al front-end al mismo tiempo. El modelo se analiza y obtiene mediante tecnología jsp, y JSON se representa mediante ajax (interacción ModelAndView o JSON)

Resumir

• Los proyectos tradicionales dependen del contenedor Spring para configurar beans a través de xml para completar la inyección de dependencia. Tomcat también debe configurarse usted mismo, y la configuración y el desarrollo son extremadamente engorrosos. Springboot tiene Tomcat integrado y puede completar la inyección de dependencias mediante anotaciones, lo que hace que el desarrollo sea extremadamente conveniente y simple.

• Algunas personas dicen que al usar vue, ¿por qué no separar el front-end y el back-end? El proyecto de la empresa se desarrolla con jsp y no hay nada que pueda hacer, a menos que pueda reemplazar todo el negocio original de la empresa con desarrollo vue. este. . . Es dinero para un año aunque no sea medio año.

• ¿Puedo usar layui o bootstrap? seguro. Siempre que el marco de la interfaz de usuario del front-end sea el paquete js o jquery, el principio es el mismo.

gracias

• Muchas gracias por leer este artículo desde el principio hasta el final, espero que su contenido pueda inspirarte y ayudarte. Si tiene otras preguntas o necesita mayor comprensión, no dude en seguir mi dinámica y dejar un mensaje.
• Finalmente, ¿puedes seguir al autor y darle un pequeño me gusta? ¡Gracias!
• Si crees que vale la pena coleccionarlo, puedes hacerlo.