项目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、提升可用性产品架构中高可…...
uniapp 对接腾讯云IM群组成员管理(增删改查)
UniApp 实战:腾讯云IM群组成员管理(增删改查) 一、前言 在社交类App开发中,群组成员管理是核心功能之一。本文将基于UniApp框架,结合腾讯云IM SDK,详细讲解如何实现群组成员的增删改查全流程。 权限校验…...
[特殊字符] 智能合约中的数据是如何在区块链中保持一致的?
🧠 智能合约中的数据是如何在区块链中保持一致的? 为什么所有区块链节点都能得出相同结果?合约调用这么复杂,状态真能保持一致吗?本篇带你从底层视角理解“状态一致性”的真相。 一、智能合约的数据存储在哪里…...

基于FPGA的PID算法学习———实现PID比例控制算法
基于FPGA的PID算法学习 前言一、PID算法分析二、PID仿真分析1. PID代码2.PI代码3.P代码4.顶层5.测试文件6.仿真波形 总结 前言 学习内容:参考网站: PID算法控制 PID即:Proportional(比例)、Integral(积分&…...
PHP和Node.js哪个更爽?
先说结论,rust完胜。 php:laravel,swoole,webman,最开始在苏宁的时候写了几年php,当时觉得php真的是世界上最好的语言,因为当初活在舒适圈里,不愿意跳出来,就好比当初活在…...
Java 8 Stream API 入门到实践详解
一、告别 for 循环! 传统痛点: Java 8 之前,集合操作离不开冗长的 for 循环和匿名类。例如,过滤列表中的偶数: List<Integer> list Arrays.asList(1, 2, 3, 4, 5); List<Integer> evens new ArrayList…...

【机器视觉】单目测距——运动结构恢复
ps:图是随便找的,为了凑个封面 前言 在前面对光流法进行进一步改进,希望将2D光流推广至3D场景流时,发现2D转3D过程中存在尺度歧义问题,需要补全摄像头拍摄图像中缺失的深度信息,否则解空间不收敛…...
unix/linux,sudo,其发展历程详细时间线、由来、历史背景
sudo 的诞生和演化,本身就是一部 Unix/Linux 系统管理哲学变迁的微缩史。来,让我们拨开时间的迷雾,一同探寻 sudo 那波澜壮阔(也颇为实用主义)的发展历程。 历史背景:su的时代与困境 ( 20 世纪 70 年代 - 80 年代初) 在 sudo 出现之前,Unix 系统管理员和需要特权操作的…...
Caliper 配置文件解析:config.yaml
Caliper 是一个区块链性能基准测试工具,用于评估不同区块链平台的性能。下面我将详细解释你提供的 fisco-bcos.json 文件结构,并说明它与 config.yaml 文件的关系。 fisco-bcos.json 文件解析 这个文件是针对 FISCO-BCOS 区块链网络的 Caliper 配置文件,主要包含以下几个部…...

mysql已经安装,但是通过rpm -q 没有找mysql相关的已安装包
文章目录 现象:mysql已经安装,但是通过rpm -q 没有找mysql相关的已安装包遇到 rpm 命令找不到已经安装的 MySQL 包时,可能是因为以下几个原因:1.MySQL 不是通过 RPM 包安装的2.RPM 数据库损坏3.使用了不同的包名或路径4.使用其他包…...
Device Mapper 机制
Device Mapper 机制详解 Device Mapper(简称 DM)是 Linux 内核中的一套通用块设备映射框架,为 LVM、加密磁盘、RAID 等提供底层支持。本文将详细介绍 Device Mapper 的原理、实现、内核配置、常用工具、操作测试流程,并配以详细的…...