当前位置: 首页 > news >正文

使用SpringMVC实现功能

目录

一、计算器

1、前端页面

2、服务器处理请求

3、效果

二、用户登陆系统

1、前端页面

(1)登陆页面

(2)欢迎页面

2、前端页面发送请求--服务器处理请求

3、效果

三、留言板

1、前端页面

2、前端页面发送请求

(1)获取之前的页面留言

(2)发送填写的留言

3、服务器处理请求

(1)针对获取之前留言的请求

(2)针对发送留言的请求

4、前端页面处理服务器的响应

(1)处理获取到全部留言的响应

(2)处理发表留言后的响应

5、效果


一、计算器

1、前端页面
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body>
<form action="calc/sum" method="post"><h1>计算器</h1>数字1:<input name="num1" type="text"><br>数字2:<input name="num2" type="text"><br><input type="submit" value=" 点击相加 ">
</form>
</body></html>

发送的是form请求,请求路径为:calc/sum,请求方法为:post。

页面效果:

2、服务器处理请求

3、效果

二、用户登陆系统

1、前端页面

前端有两个页面:登录页面和欢迎页面。登陆成功可以跳转欢迎页面。

(1)登陆页面
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><title>登录页面</title>
</head><body>
<h1>用户登录</h1>
用户名:<input name="userName" type="text" id="userName"><br>
密码:<input name="password" type="password" id="password"><br><input type="button" value="登录" onclick="login()"><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script>function login() {}</script>
</body></html>
(2)欢迎页面
<!doctype html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport"content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>用户登录首页</title>
</head><body>
登录人: <span id="loginUser"></span><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script></script>
</body></html>

效果:

2、前端页面发送请求--服务器处理请求

在登陆页面发送json请求,url为login/check:,参数有:username和password,请求方法为post。

服务器处理上面请求:

登陆页面处理来着服务器的响应:

登陆成功跳转到欢迎页面:

欢迎页面发送json请求,url:"/login/index",请求方式:get,请求内容为空。

服务器处理上面请求:

欢迎页面处理来自服务器的响应:

3、效果

三、留言板

1、前端页面
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>留言板</title><style>.container {width: 350px;height: 300px;margin: 0 auto;/* border: 1px black solid; */text-align: center;}.grey {color: grey;}.container .row {width: 350px;height: 40px;display: flex;justify-content: space-between;align-items: center;}.container .row input {width: 260px;height: 30px;}#submit {width: 350px;height: 40px;background-color: orange;color: white;border: none;margin: 10px;border-radius: 5px;font-size: 20px;}</style>
</head><body><div class="container"><h1>留言板</h1><p class="grey">输入后点击提交, 会将信息显示下方空白处</p><div class="row"><span>谁:</span> <input type="text" name="" id="from"></div><div class="row"><span>对谁:</span> <input type="text" name="" id="to"></div><div class="row"><span>说什么:</span> <input type="text" name="" id="say"></div><input type="button" value="提交" id="submit" onclick="submit()"><!-- <div>A 对 B 说: hello</div> --></div><script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script><script>function submit(){}</script>
</body></html>

效果:

2、前端页面发送请求

在进入页面的时候,该页面希望获取到之前的页面留言;在填写完留言内容后,希望页面能显示出内容。虽然目前前端已经可以显示,但是浏览器刷新后就没了。

(1)获取之前的页面留言

请求类型:json,请求方式为get,请求数据为空,url:/message/getList

(2)发送填写的留言

请求类型:json,请求方式:post,请求数据:留言内容,url:/message/postList

3、服务器处理请求

定义留言对象

(1)针对获取之前留言的请求

(2)针对发送留言的请求

4、前端页面处理服务器的响应
(1)处理获取到全部留言的响应

(2)处理发表留言后的响应

5、效果

相关文章:

使用SpringMVC实现功能

目录 一、计算器 1、前端页面 2、服务器处理请求 3、效果 二、用户登陆系统 1、前端页面 &#xff08;1&#xff09;登陆页面 &#xff08;2&#xff09;欢迎页面 2、前端页面发送请求--服务器处理请求 3、效果 三、留言板 1、前端页面 2、前端页面发送请求 &…...

spring aop实现接口超时处理组件

文章目录 实现思路实现代码starter组件 实现思路 这里使用FutureTask&#xff0c;它通过get方法以阻塞的方式获取执行结果&#xff0c;并设定超时时间&#xff1a; public V get() throws InterruptedException, ExecutionException ;public V get(long timeout, TimeUnit un…...

c++设计模式之装饰器模式

作用 为现有类增加功能 案例说明 class Car { public:virtual void show()0; };class Bmw:public Car { public:void show(){cout<<"宝马汽车>>"<<endl;} };class Audi:public Car { public:void show(){cout<<"奥迪汽车>>&q…...

WordPress如何实现随机显示一句话经典语录?怎么添加到评论框中?

我们在一些WordPress网站的顶部或侧边栏或评论框中&#xff0c;经常看到会随机显示一句经典语录&#xff0c;他们是怎么实现的呢&#xff1f; 其实&#xff0c;boke112百科前面跟大家分享的『WordPress集成一言&#xff08;Hitokoto&#xff09;API经典语句功能』一文中就提供…...

【退役之重学前端】vite, vue3, vue-router, vuex, ES6学习日记

学习使用vitevue3的所遇问题总结&#xff08;2024年2月1日&#xff09; 组件中使用<script>标签忘记加 setup 这会导致Navbar 没有暴露出来&#xff0c;导致使用不了&#xff0c;出现以下报错 这是因为&#xff0c;如果不用setup&#xff0c;就得使用 export default…...

[linux]-总线,设备,驱动,dts

1. 总线BUS 在物理层面上&#xff0c;代表不同的工作时序和电平特性&#xff1a; 总线代表着同类设备需要共同遵守的工作时序&#xff0c;不同的总线对于物理电平的要求是不一样的&#xff0c;对于每个比特的电平维持宽度也是不一样&#xff0c;而总线上传递的命令也会有自己…...

python3实现gitlab备份文件上传腾讯云COS

gitlab备份文件上传腾讯云COS 脚本说明脚本名称&#xff1a;upload.py 假设gitlab备份文件目录&#xff1a;/opt/gitlab/backups gitlab备份文件格式&#xff1a;1706922037_2024_02_06_14.2.1_gitlab_backup.tar1.脚本需和gitlab备份文件同级目录 2.根据备份文件中的日期判断…...

292.Nim游戏

桌子上有一堆石头。 轮流进行自己的回合&#xff0c; 你作为先手 。 每一回合&#xff0c;轮到的人拿掉 1 - 3 块石头。 拿掉最后一块石头的人就是获胜者。 假设你们每一步都是最优解。请编写一个函数&#xff0c;来判断你是否可以在给定石头数量为 n 的情况下赢得游戏。如果可…...

Spring和Spring Boot的区别

Spring 是一个轻量级的 Java 开发框架&#xff0c;它提供了一系列的模块和功能&#xff0c;例如 IoC&#xff08;控制反转&#xff09;、AOP&#xff08;面向方面编程&#xff09;、数据库访问、Web 开发等。Spring 的目标是使 Java 开发更加简单、高效和可维护。 Spring Boot …...

备战蓝桥杯---动态规划(理论基础)

目录 动态规划的概念&#xff1a; 解决多阶段决策过程最优化的一种方法 阶段&#xff1a; 状态&#xff1a; 决策&#xff1a; 策略&#xff1a; 状态转移方程&#xff1a; 适用的基本条件 1.具有相同的子问题 2.满足最优子结构 3.满足无后效性 动态规划的实现方式…...

FPGA_ip_pll

常使用插件管理器进行ip核的配置&#xff0c;ip核分为计算&#xff0c;存储&#xff0c;输入输出&#xff0c;视频图像处理&#xff0c;接口&#xff0c;调试等。 一 pll ip核简介 pll 即锁相环&#xff0c;可以对输入到fpga的时钟信号&#xff0c;进行分频&#xff0c;倍频&…...

【实验3】统计某电商网站买家收藏商品数量

文章目录 一、实验目的和要求∶二、实验任务∶三、实验准备方案,包括以下内容:实验内容一、实验环境二、实验内容与步骤(过程及数据记录):三、实验结果分析、思考题解答∶四、感想、体会、建议∶一、实验目的和要求∶ 现有某电商网站用户对商品的收藏数据,记录了用户收藏…...

【Qt】Android上运行keeps stopping, Desktop上正常

文章目录 问题 & 背景背景问题 解决方案One More ThingTake Away 问题 & 背景 背景 在文章【Qt】最详细教程&#xff0c;如何从零配置Qt Android安卓环境中&#xff0c;我们在Qt中配置了安卓开发环境&#xff0c;并且能够正常运行。 但笔者在成功配置并完成上述文章…...

算法学习打卡day47|单调栈系列题目

单调栈题目思路 通常是一维数组&#xff0c;要寻找任一个元素的右边或者左边第一个比自己大或者小的元素的位置&#xff0c;此时我们就要想到可以用单调栈了。时间复杂度为O(n)。单调栈的本质是空间换时间&#xff0c;因为在遍历的过程中需要用一个栈来记录右边第一个比当前元…...

Maven构建OSGI+HttpServer应用

Maven构建OSGIHttpServer应用 官网&#xff08;https://eclipse.dev/equinox/server/http_in_equinox.php&#xff09;介绍有两种方式&#xff1a; 一种是基于”org.eclipse.equinox.http”包的轻量级实现&#xff0c;另一种是基于”org.eclipse.equinox.http.jetty”包&#…...

chrome扩展插件常用文件及作用

Chrome扩展通常包含以下常用文件及其作用&#xff1a; manifest.json&#xff1a; 描述了扩展的基本信息&#xff0c;如名称、版本、权限、图标等。定义了扩展的各种组件和功能&#xff0c;包括后台脚本、内容脚本、页面、浏览器动作按钮等。 background.js&#xff1a; 后台脚…...

PdfFactory Pro软件下载以及序列号注册码生成器

PdfFactory Pro注册机是一款针对同名虚拟打印机软件所推出的用户名和序列号生成器。PdfFactory Pro是一款非常专业的PDF虚拟打印软件&#xff0c;通过使用这款注册机&#xff0c;就能帮助用户免费获取注册码&#xff0c;一键激活&#xff0c;永久免费使用。 pdffactory7注册码如…...

jsp康养小镇管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 JSP康养小镇管理系统是一套完善的java web信息管理系统&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据库为Mysql5.0&a…...

Android 无操作之后定时退出

android定时器监用户听对页面无操作5分钟退出登录实现 - 简书 private long advertisingTime 600000;///定时结束退出登录10分(分钟)600000毫秒public CountDownTimer countDownTimer;Overrideprotected void onResume() {super.onResume();//启动定时if (isTimedExitApp()) …...

CMS 检测神器:CMSeek 保姆级教程(附链接)

一、介绍 CMSeek&#xff08;Content Management System Exploitation and Enumeration Toolkit&#xff09;是一款用于检测和利用网站上可能存在的内容管理系统&#xff08;CMS&#xff09;漏洞的开源工具。它旨在帮助安全研究人员和渗透测试人员识别目标网站所使用的CMS&…...

超级AI数字员工源码系统,支持贴牌OEM,独立部署交付

温馨提示&#xff1a;文末有资源获取方式最近“龙虾AI”概念很火&#xff0c;到处都在讨论。但说实话&#xff0c;这类技术对普通用户而言存在明显门槛&#xff0c;部署要代码、配置要工程师、日常运行的Token成本也不低——轻度使用每月100-200元&#xff0c;重度甚至单日上千…...

用DolphinScheduler实现数仓自动化:从零搭建ETL工作流实战

用DolphinScheduler构建电商数仓ETL流水线&#xff1a;实战设计与优化指南 电商平台每天产生的TB级订单数据&#xff0c;如何转化为精准的用户画像和实时销售报表&#xff1f;本文将带你从零搭建一个基于DolphinScheduler的自动化数据处理流水线&#xff0c;解决实际业务场景中…...

OpenClaw任务编排:GLM-4.7-Flash多步骤自动化设计

OpenClaw任务编排&#xff1a;GLM-4.7-Flash多步骤自动化设计 1. 为什么需要任务编排 上周我需要整理一批技术文档&#xff0c;这个任务包含多个步骤&#xff1a;从不同文件夹收集Markdown文件、统一格式、生成摘要、最后打包发送给团队成员。手动操作不仅耗时&#xff0c;还…...

MySQL高手第三章

从磁盘读取数据页到Buffer Pool的时候&#xff0c;free链表有什么用&#xff1f;我们怎么知道那些缓存是空闲的&#xff1f;当我们数据库运行起来的时候&#xff0c;肯定会不断的做增删改查&#xff0c;将磁盘上读取一个一个数据页放入Buffer Pool中对应的缓存页里去但是从磁盘…...

5个强力优化步骤:Win11Debloat让Windows系统性能提升显著

5个强力优化步骤&#xff1a;Win11Debloat让Windows系统性能提升显著 【免费下载链接】Win11Debloat 一个简单的PowerShell脚本&#xff0c;用于从Windows中移除预装的无用软件&#xff0c;禁用遥测&#xff0c;从Windows搜索中移除Bing&#xff0c;以及执行各种其他更改以简化…...

zotero-style:提升文献管理效率的3个核心方案

zotero-style&#xff1a;提升文献管理效率的3个核心方案 【免费下载链接】zotero-style zotero-style - 一个 Zotero 插件&#xff0c;提供了一系列功能来增强 Zotero 的用户体验&#xff0c;如阅读进度可视化和标签管理&#xff0c;适合研究人员和学者。 项目地址: https:/…...

告别手动画框!OrCAD Capture 快速创建复合封装(附电源/地引脚处理技巧)

高效创建OrCAD复合封装的进阶技巧与避坑指南 在PCB设计流程中&#xff0c;原理图封装的创建往往是项目前期最耗时的环节之一。尤其是面对多通道运放、复杂电源管理芯片或模块化器件时&#xff0c;传统的手动绘制方式不仅效率低下&#xff0c;还容易因引脚属性设置不当导致后续D…...

从智慧灯杆到无人驾驶:如何用Raspberry Pi 4和Arduino搭建微型智慧城市实验平台

从智慧灯杆到无人驾驶&#xff1a;如何用Raspberry Pi 4和Arduino搭建微型智慧城市实验平台 在创客文化和高校工程教育中&#xff0c;低成本硬件的创新应用正掀起一场微型智慧城市实验的革命。只需一块树莓派主板、几个传感器和开源软件&#xff0c;就能在桌面上复现价值数百万…...

K230目标检测实战:手把手教你用Labelme标注数据并一键转成VOC格式(附避坑指南)

K230目标检测实战&#xff1a;高效数据标注与VOC格式转换全攻略 当你第一次接触K230开发板进行目标检测项目时&#xff0c;数据准备往往是最大的拦路虎。特别是从原始图片到符合AI_Cube要求的VOC格式数据集&#xff0c;这个过程充满了各种"坑"。本文将分享一套经过实…...

用Docker三分钟搞定Hive伪分布式环境(附本地开发调试技巧)

用Docker三分钟搞定Hive伪分布式环境&#xff08;附本地开发调试技巧&#xff09; 在数据分析和处理领域&#xff0c;Hive作为基于Hadoop的数据仓库工具&#xff0c;因其能够处理海量数据并提供类SQL查询能力而广受欢迎。然而&#xff0c;传统的Hive环境搭建往往需要配置复杂的…...