项目2-用户登录
1.创建项目
2.引入前端代码并检查是否有误
3.定义接口
需求分析
对于后端开发⼈员⽽⾔, 不涉及前端⻚⾯的展⽰, 只需要提供两个功能
1. 登录⻚⾯: 通过账号和密码, 校验输⼊的账号密码是否正确, 并告知前端
2. ⾸⻚: 告知前端当前登录⽤⼾. 如果当前已有⽤⼾登录, 返回登录的账号, 如果没有, 返回空值
接⼝定义
1. 校验接⼝
请求路径:/user/login
请求⽅式:POST
接⼝描述:校验账号密码是否正确请求参数:
参数名 类型 是否必须 备注 userName String 是 校验的账号 password String 是 校验的密码 响应数据:
Content-Type: text/html
响应内容:true //账号密码验证成功
false//账号密码验证失败
2. 查询登录⽤⼾接⼝
请求路径:/user/getLoginUser
请求⽅式:GET
接⼝描述:查询当前登录的⽤⼾
请求参数:
⽆
响应数据:Content-Type: text/html
响应内容:
zhangsan
4.服务器代码
4.1 校验接口
package com.example.demo.controller;import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;import javax.servlet.http.HttpSession;/*** Created with IntelliJ IDEA.* Description:* User: 吉祥瑞* Date: 2024-03-24* Time: 22:47*/
@RestController
@RequestMapping("/user")
public class LoginController {@RequestMapping("/login")public boolean login(String userName, String password, HttpSession session){//1.校验获取参数是否为空//StringUtils.hasLength() 是Spring提供的⼀个⼯具⽅法, 判断字符串是否有值//字符串为null或者""时, 返回false, 其他返回trueif(!StringUtils.hasLength(userName)||!StringUtils.hasLength(password)){return false;}//2.校验session中是否有相应的数据if(userName.equals("userName")&&password.equals("password")){session.setAttribute("username",userName);return true;}return false;}
}
测试接口--利用postman
4.2 查询登录用户接口
@RequestMapping("/getLoginUser")public String getLoginUser(HttpSession session) {//从Session中获取⽤⼾登录信息String userName=(String) session.getAttribute("userName");//需要进行强转//如果⽤⼾已经登录, 则直接返回⽤⼾登录(session不为空)if (StringUtils.hasLength(userName)){return userName;}return "";}
测试成功
5.前后端交互
<!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() {$.ajax({url: "/user/login",type: "post",data: {"userName": $("#userName").val(),"password": $("#password").val()},success: function(result){if(result){location.href = "/index.html"}else{alert("账号或密码有误,请重新输入")}}})}</script>
</body></html>
先测试第一个页面前后交互是否正确
正确页面
错误警告
下面是欢迎界面
代码:
<!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>$.ajax({url: "/user/getLoginUser",type: "get",success: function(result){$("#loginUser").text(result);}})</script>
</body></html>
成功!!!
相关文章:

项目2-用户登录
1.创建项目 2.引入前端代码并检查是否有误 3.定义接口 需求分析 对于后端开发⼈员⽽⾔, 不涉及前端⻚⾯的展⽰, 只需要提供两个功能 1. 登录⻚⾯: 通过账号和密码, 校验输⼊的账号密码是否正确, 并告知前端 2. ⾸⻚: 告知前端当前登录⽤⼾. 如果当前已有⽤⼾登录, 返回登录的账…...

网易web安全工程师进阶版课程
课程介绍 《Web安全工程师(进阶)》是由“ i春秋学院联合网易安全部”出品,资深讲师团队通过精炼的教学内容、丰富的实际场景及综合项目实战,帮助学员纵向提升技能,横向拓宽视野,牢靠掌握Web安全工程师核心…...

【Postman】工具使用介绍
一、postman工具介绍 1.什么是postman postman是谷歌开发的一款网页调试和接口测试工具,能够发送任何请求类型的http请求,支持GET/POST/PUT/DELETE等方法。postman简单易用,可以直接填写URL,header,body就可以发送一…...

【vue核心技术实战精讲】1.3 - 1.6 VUE 指令 (上)
前言 上节,我们学习了 Vue的起步 和 插值表达式 本节内容 Vue指令之v-text 和 v-htmlVue指令之v-if 和 v-showVue指令之v-bind绑定Vue指令之v-on事件处理 1、v-text 和 v-html {{}} 和v-text的作用是一样的 都是插入值,直接渲染 ≈ innerTextv-html既能插入值 又能插入标签…...

vscode使用Runner插件将.exe文件统一放到一个目录下
找到右下角管理,点击扩展。 找到Code Runner插件,打开扩展设置。 向下翻,找到Executor Map,点击在settings.json中编辑。 在c和c的配置命令栏中增加\\\output\\即可。(增加的目录不能自动创建,需要手动创建…...
[commonjs--resolver] Missing “./jsx-runtime.js“ specifier in “react“ package
修复vite构建时错误 vite打包,第三方包引用的react版本不一致问题修复(不是最优解) // vite.config.js import { defineConfig } from vite; import react from vitejs/plugin-react; import path from path;export default defineConfig({plugins: [react(), // 如果使用Rea…...

ETH Gas 之 Base Fee Priority Fee
前情回顾 ETH网络 之 Gas EIP-1559 EIP-1559 EIP-1559是以太坊改进提案(Ethereum Improvement Proposal),旨在改进以太坊的交易费用机制。该提案引入了一种新的交易费用模型,以提高交易费用的可预测性和网络的效率。我们本文各…...

【小白入门篇1】GPT到底是怎样练成?
由于具有代表性的OpenAI公司GPT模型并没有开源,所以本章节是参考一些开源和现有课程(李宏毅)讲解ChatGPT原理。本章没有涉及到很多数学运算,比较适合小白了解GPT到底是怎么练成。GPT的三个英文字母分别代表Generative(生成式)&…...
Django——forms组件
Django——forms组件 forms组件:通过后端在Django中定义forms类,可以在 html 中动态的生成一个表单;检验用户提交的数据。 在应用中创建一个名为 :forms 的py文件 # 导入 forms 组件 from django import forms# 自定义 forms …...
利用K8S Statefulset搭建Etcd集群 - PVC存储
概述 在测试过程中发现,直接使用本地存储,当节点机器损坏了,对应机器的etcd数据也丢失了,故而做了利用K8S PV,PVC以及NFS来存储数据的尝试,经过一番折腾,测试成功,博文记录…...

手撕算法-接雨水
描述 分析 i位置能积累的雨水量,等于其左右两边最大高度的最小值。为了能获取i位置左右两边的最大高度。使用动态规划。两个dp数组: leftMaxrightMax 其中 leftMax[i] 代表i位置左边的最大高度rightMax[i] 代表i位置右边的最大高度 初始状态&#x…...
探索AI大模型学习:理论基础、技术突破与未来挑战
在当今技术飞速发展的时代,人工智能(AI)大模型学习无疑是推动科技进步和创新的关键力量。AI大模型学习的核心在于通过训练大规模的数据集来提升模型的性能,使之能够更准确、更高效地完成各种任务,从而在多个领域中实现…...

Linux:点命令source
相关阅读 Linuxhttps://blog.csdn.net/weixin_45791458/category_12234591.html?spm1001.2014.3001.5482 source命令用于读取一个文件的内容并在当前Shell环境(包括交互式Shell或是非交互式Shell)执行里面的命令。它被称为点命令是因为命令名source也可…...

iOS开发 - 转源码 - __weak问题解决
iOS开发 - 转源码 - __weak问题解决 在使用clang转换OC为C代码时,可能会遇到以下问题 cannot create __weak reference in file using manual reference 原因 __weak弱引用是需要runtime支持的,如果我们还只是使用静态编译,是无法正常转换的…...
【Linux基础】dash和bash简介
Dash(Debian Almquist Shell)和 Bash(Bourne Again Shell)是 Unix/Linux 系统中的命令行 shell,用于执行命令、管理文件系统、编写脚本等任务的工具。 一、Dash和Bash的区别: Bash(Bourne Agai…...
精读《如何做好 CodeReview》
1 引言 任何软件都是协同开发的,所以 CodeReview 非常重要,它可以帮助你减少代码质量问题,提高开发效率,提升稳定性,同时还能保证软件架构的稳定性,防止代码结构被恶意破坏导致难以维护。 所以 CodeRevie…...

双指针(滑动窗口)-算法刷题
一.移动零(. - 力扣(LeetCode)) 算法思想 : 设置两个指针left,right,将数组分为三块[0,left]为不为0的元素,[left1,right-1]为0元素,[right,num.size()-1]为未扫描的区域,…...

上位机图像处理和嵌入式模块部署(qmacvisual之ROI设定)
【 声明:版权所有,欢迎转载,请勿用于商业用途。 联系信箱:feixiaoxing 163.com】 ROI,全称是region of interest,也就是感兴趣区域。这里面一般分成两种情况,一种是所有的算法都依赖于这个ROI&a…...

银行监管报送系统介绍(五):金融统计数据大集中自动化报送系统——PBOC Report
人民银行金融统计数据大集中自动化报送系统(简称PBOC Report),是基于现代计算机网络技术应用基础上,由人行总行设置金融统计数据服务器,建立的一个全国统一的金融统计数据库。 人行针对各银行存贷款、中间业务、网点人…...

常用中间件redis,kafka及其测试方法
常用消息中间件及其测试方法 一、中间件的使用场景引入中间件的目的一般有两个:1、提升性能常用的中间件:1) 高速缓存:redis2) 全文检索:ES3) 存日志:ELK架构4) 流量削峰:kafka 2、提升可用性产品架构中高可…...

QT: `long long` 类型转换为 `QString` 2025.6.5
在 Qt 中,将 long long 类型转换为 QString 可以通过以下两种常用方法实现: 方法 1:使用 QString::number() 直接调用 QString 的静态方法 number(),将数值转换为字符串: long long value 1234567890123456789LL; …...
聊一聊接口测试的意义有哪些?
目录 一、隔离性 & 早期测试 二、保障系统集成质量 三、验证业务逻辑的核心层 四、提升测试效率与覆盖度 五、系统稳定性的守护者 六、驱动团队协作与契约管理 七、性能与扩展性的前置评估 八、持续交付的核心支撑 接口测试的意义可以从四个维度展开,首…...
QT3D学习笔记——圆台、圆锥
类名作用Qt3DWindow3D渲染窗口容器QEntity场景中的实体(对象或容器)QCamera控制观察视角QPointLight点光源QConeMesh圆锥几何网格QTransform控制实体的位置/旋转/缩放QPhongMaterialPhong光照材质(定义颜色、反光等)QFirstPersonC…...
uniapp 集成腾讯云 IM 富媒体消息(地理位置/文件)
UniApp 集成腾讯云 IM 富媒体消息全攻略(地理位置/文件) 一、功能实现原理 腾讯云 IM 通过 消息扩展机制 支持富媒体类型,核心实现方式: 标准消息类型:直接使用 SDK 内置类型(文件、图片等)自…...
MFE(微前端) Module Federation:Webpack.config.js文件中每个属性的含义解释
以Module Federation 插件详为例,Webpack.config.js它可能的配置和含义如下: 前言 Module Federation 的Webpack.config.js核心配置包括: name filename(定义应用标识) remotes(引用远程模块࿰…...
云原生周刊:k0s 成为 CNCF 沙箱项目
开源项目推荐 HAMi HAMi(原名 k8s‑vGPU‑scheduler)是一款 CNCF Sandbox 级别的开源 K8s 中间件,通过虚拟化 GPU/NPU 等异构设备并支持内存、计算核心时间片隔离及共享调度,为容器提供统一接口,实现细粒度资源配额…...
书籍“之“字形打印矩阵(8)0609
题目 给定一个矩阵matrix,按照"之"字形的方式打印这个矩阵,例如: 1 2 3 4 5 6 7 8 9 10 11 12 ”之“字形打印的结果为:1,…...
React父子组件通信:Props怎么用?如何从父组件向子组件传递数据?
系列回顾: 在上一篇《React核心概念:State是什么?》中,我们学习了如何使用useState让一个组件拥有自己的内部数据(State),并通过一个计数器案例,实现了组件的自我更新。这很棒&#…...

ABAP设计模式之---“Tell, Don’t Ask原则”
“Tell, Don’t Ask”是一种重要的面向对象编程设计原则,它强调的是对象之间如何有效地交流和协作。 1. 什么是 Tell, Don’t Ask 原则? 这个原则的核心思想是: “告诉一个对象该做什么,而不是询问一个对象的状态再对它作出决策。…...
IP选择注意事项
IP选择注意事项 MTP、FTP、EFUSE、EMEMORY选择时,需要考虑以下参数,然后确定后选择IP。 容量工作电压范围温度范围擦除、烧写速度/耗时读取所有bit的时间待机功耗擦写、烧写功耗面积所需要的mask layer...