seo怎么学在哪里学,谷歌seo查询,Wordpress页面有横线,有哪些做网站好的公司好cookie和session的关系
两者都是在客户端和服务器中进行存储数据和传递信息的工具
cookie和session的区别
Cookie是客⼾端保存⽤⼾信息的⼀种机制.
Session是服务器端保存⽤⼾信息的⼀种机制.
Cookie和Session之间主要是通过SessionId关联起来的#xff0c;SessionId是Co…cookie和session的关系
两者都是在客户端和服务器中进行存储数据和传递信息的工具
cookie和session的区别
Cookie是客⼾端保存⽤⼾信息的⼀种机制.
Session是服务器端保存⽤⼾信息的⼀种机制.
Cookie和Session之间主要是通过SessionId关联起来的SessionId是Cookie和Session之间的 桥梁。
Cookie和Session经常会在⼀起配合使⽤.但是不是必须配合完全可以⽤Cookie来保存⼀些数据在客⼾端.这些数据不⼀定是⽤⼾⾝份信息,也不⼀定是 SessionId。
获取cookie
传统的获取cookie
HttpServletRequest , HttpServletResponse 是Servlet提供的两个类,是Spring MVC⽅法的内置对象.需要时直接在⽅法中添加声明即可
HttpServletRequest:对象代表客户端的请求当客户端通过Http协议访问服务端时Http请求中的所有信息封装在这个对象中通过这个对象提供的方法可以获得客户端的所有信息
HttpServletResponse 对象代表服务器的响应.HTTP响应的信息都在这个对象中 //传统的获取cookieRequestMapping(t13)public String t13(HttpServletRequest request, HttpServletResponse response){Cookie[] cookies request.getCookies();if(cookies!null){for (Cookie cookie:cookies) {System.out.println(cookie.getName():cookie.getValue());}}return 返回cookie成功;} 利用注释获取cookie的方式
//利用注解获取cookieRequestMapping(t14)public String t14(CookieValue(java) String java){return 获取cookie中的java成功 java;}
session的存储与获取
session的存储 //存储sessionRequestMapping(/setSession)public String setSession(HttpServletRequest request){HttpSession session request.getSession();session.setAttribute(username,zhangsan);session.setAttribute(age,17);return 设置session成功;} session的获取
方法一
//获取session,方法一RequestMapping(/getSession1)public String getSession1(HttpServletRequest request){HttpSession session request.getSession(/*true*/);if (sessionnull){return 获取失败;}else {String username (String) session.getAttribute(username);// Integer age (Integer) session.getAttribute(age);return 登录的用户为 username;}} 方法二
//获取session,方法二RequestMapping(/getSession2)public String getSession2(HttpSession session){//HttpSession session默认session中的值为true,所以可以省略session为0String username (String) session.getAttribute(username);return 登录的用户为 username;} 方法三
//获取session,方法三RequestMapping(/getSession3)public String getSession3(SessionAttribute(username) String username){return 登录的用户为 username;} 获取header
传统的获取header
RequestMapping(/getHeader1)public String getHeader1(HttpServletRequest request){String UserAgent request.getHeader(User-Agent);return 从header中获取User-AgentUserAgent;}通过抓包发现获取的user-agent正确
简洁的获取header
RequestMapping(/getHeader2)public String getHeader2(RequestHeader(User-Agent)String UserAgent){return 从header中获取User-AgentUserAgent;} 响应
返回静态的页面
在创建前端的页面时注意路径 在resources包中
比如index.html前端代码
!doctype html
html langenheadmeta charsetUTF-8meta nameviewportcontentwidthdevice-width, user-scalableno, initial-scale1.0, maximum-scale1.0, minimum-scale1.0meta http-equivX-UA-Compatible contentieedgetitle用户登录首页/title
/headbody登录人: span idloginUser/spanscript srcjs/jquery-git.min.js/scriptscript$.ajax({url: /user/getLoginUser,type: get,success: function(userName){$(#loginUser).text(userName);}});/script
/body/html
后端的代码
public class ResponseController {RequestMapping(/t1)public String returnPage(){return /index.html;} 返回数据
requestBody
RequestMapping(/t2)ResponseBodypublic String returnData(){return 返回需要的数据;} 返回html的代码片段 ResponseBodyRequestMapping(/t3)public String returnHTML(){return h1我是一级标题/h1;} 返回JSON
ResponseBodyRequestMapping(value /t5)public UseInfo returnJson(){UseInfo useInfonew UseInfo(zhangsan,1,1);return useInfo;} 设置状态码
ResponseBodyRequestMapping(value /t6)public UseInfo steStatus(HttpServletResponse response){response.setStatus(404);UseInfo useInfonew UseInfo(zhangsan,1,1);return useInfo;} 用户的登录 前端代码
!DOCTYPE html
html langenheadmeta charsetUTF-8title登录页面/title
/headbodyh1用户登录/h1用户名input nameuserName typetext iduserNamebr密码input namepassword typepassword idpasswordbrinput typebutton value登录 onclicklogin()script srcjs/jquery-git.min.js/scriptscriptfunction login() {$.ajax({type: POST,url: /user/login,data: {userName: $(#userName).val(), password: $(#password).val() },success: function(result) {if (result) {location.href index.html; } else {alert(密码错误请确认);}},error: function(xhr, status, error) {alert(请求失败请稍后再试 error);}});}/script
/body/html
后端代码
package com.blame.spring.demo;import ch.qos.logback.core.util.StringUtil;
import jakarta.servlet.http.HttpSession;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;RequestMapping(/user)
RestController
public class UserController {RequestMapping(/login)public boolean login(String userName, String passWord, HttpSession session){if(!StringUtils.hasLength(userName) || !StringUtils.hasLength(passWord)){return false;}if(admin.equals(userName) admin.equals(passWord)){session.setAttribute(userName,userName);return true;}return false;}RequestMapping(/getUserLogin)public String getUserLogin(String userName,HttpSession session){String attribute (String) session.getAttribute(userName);return userName;}
}
接口的定义
登录界面的接口定义 $.ajax({type: POST,url: /user/login,data: {userName: $(#userName).val(), password: $(#password).val() },success: function(result) {if (result) {location.href index.html; } else {alert(密码错误请确认);}},error: function(xhr, status, error) {alert(请求失败请稍后再试 error);}}); 计算器的实现 前端的代码
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyform actioncalc/sum methodposth1计算器/h1数字1input namenum1 typetextbr数字2input namenum2 typetextbrinput typesubmit value 点击相加 /form
/body/html
后端代码
RequestMapping(/calc)
RestController
public class CalcController {RequestMapping(/sum)public String sum(Integer num1,Integer num2){if(num1null || num2null){return 输入错误请重新输入;}Integer sumnum1num2;return 结果是 sum;}
} 留言板的实现
前端代码
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title留言板/titlestyle.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
/headbodydiv classcontainerh1留言板/h1p classgrey输入后点击提交, 会将信息显示下方空白处/pdiv classrowspan谁:/span input typetext name idfrom/divdiv classrowspan对谁:/span input typetext name idto/divdiv classrowspan说什么:/span input typetext name idsay/divinput typebutton value提交 idsubmit onclicksubmit()!-- divA 对 B 说: hello/div --/divscript srcjs/jquery-git.min.js/scriptscriptload();function load() {$.ajax({type: get,url: /message/getList,success: function (messages) {if (messages ! null messages.length 0) {var finalHtml ;for (var m of messages) {finalHtml div m.from 对 m.to 说: m.message /div;}$(.container).append(finalHtml);}}});}function submit(){//1. 获取留言的内容var from $(#from).val();var to $(#to).val();var say $(#say).val();if (from || to || say ) {return;}$.ajax({type:post,url:/message/publish,contentType:application/json,data:JSON.stringify({from:from,to:to,message:say}),success:function(result){var jsonObj JSON.parse(result);if(jsonObj.ok1){//2. 构造节点var divE divfrom 对 to 说: say/div;//3. 把节点添加到页面上 $(.container).append(divE);//4. 清空输入框的值$(#from).val();$(#to).val();$(#say).val();}else{alert(发布失败)}}});}/script
/body/html
后端代码
package com.blame.spring.demo;import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.*;import java.util.ArrayList;
import java.util.Collections;
import java.util.List;RequestMapping(/message)
RestController
public class MessageController {ListMessageInfo messageInfoListnew ArrayList();PostMapping(value /publish,produces application/json)public String publish(RequestBody MessageInfo messageInfo){if(!StringUtils.hasLength(messageInfo.getMessage())|| !StringUtils.hasLength(messageInfo.getFrom())|| !StringUtils.hasLength(messageInfo.getTo())){return {\ok\:0};}messageInfoList.add(messageInfo);return {\ok\:1};}GetMapping(getList)public ListMessageInfo getList(){return messageInfoList;}
} 接口的定义
lombok工具的介绍
Lombok是⼀个Java⼯具库通过添加注解的⽅式简化Java的开发
首先先引入其依赖
dependencygroupIdorg.springframework.boot/groupIdartifactIdspring-boot-starter-test/artifactIdscopetest/scope/dependencydependencygroupIdorg.projectlombok/groupIdartifactIdlombok/artifactId/dependency
Data
public class MessageInfo {private String from;private String to;private String message;
}
Data 注解会帮助我们⾃动⼀些⽅法,包含getter/setter,equals,toString等
如下图上面是Java程序的运行原理下面是Lombok的作用 我们就不需要自己写getter和setter方法还有toString方法
DataGetterSetterToStringEqualsAndHashCodeRequiredArgsConstructor NoArgsConstructor 图书管理系统的实现
首先先做好前端代码的引入 前端代码仅供参考重点看后端的代码
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title添加图书/titlelink relstylesheet hrefcss/bootstrap.min.csslink relstylesheet hrefcss/add.css/headbodydiv classcontainerdiv classform-inlineh2 styletext-align: left; margin-left: 10px;svg xmlnshttp://www.w3.org/2000/svg width40fill#17a2b8 classbi bi-book-half viewBox0 0 16 16pathdM8.5 2.687c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492V2.687zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783z //svgspan添加图书/span/h2/divform idaddBookdiv classform-grouplabel forbookName图书名称:/labelinput typetext classform-control placeholder请输入图书名称 idbookName namebookName/divdiv classform-grouplabel forbookAuthor图书作者/labelinput typetext classform-control placeholder请输入图书作者 idbookAuthor nameauthor //divdiv classform-grouplabel forbookStock图书库存/labelinput typetext classform-control placeholder请输入图书库存 idbookStock namecount//divdiv classform-grouplabel forbookPrice图书定价/labelinput typenumber classform-control placeholder请输入价格 idbookPrice nameprice/divdiv classform-grouplabel forbookPublisher出版社/labelinput typetext idbookPublisher classform-control placeholder请输入图书出版社 namepublish //divdiv classform-grouplabel forbookStatus图书状态/labelselect classcustom-select idbookStatus namestatusoption value1 selected可借阅/optionoption value2不可借阅/option/select/divdiv classform-group styletext-align: rightbutton typebutton classbtn btn-info btn-lg onclickadd()确定/buttonbutton typebutton classbtn btn-secondary btn-lg onclickjavascript:history.back()返回/button/div/form/divscript typetext/javascript srcjs/jquery.min.js/scriptscriptfunction add() {alert(添加成功);location.href book_list.html;}/script
/body/html
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title图书列表展示/titlelink relstylesheet hrefcss/bootstrap.min.csslink relstylesheet hrefcss/list.cssscript typetext/javascript srcjs/jquery.min.js/scriptscript typetext/javascript srcjs/bootstrap.min.js/scriptscript srcjs/jq-paginator.js/script/headbodydiv classbookContainerh2图书列表展示/h2div classnavbar-justify-betweendivbutton classbtn btn-outline-info typebutton onclicklocation.hrefbook_add.html添加图书/buttonbutton classbtn btn-outline-info typebutton onclickbatchDelete()批量删除/button/div/divtabletheadtrtd选择/tdtd classwidth100图书ID/tdtd书名/tdtd作者/tdtd数量/tdtd定价/tdtd出版社/tdtd状态/tdtd classwidth200操作/td/tr/theadtbodytrtdinput typecheckbox nameselectBook value1 idselectBook classbook-select/tdtd1/tdtd大秦帝国第一册/tdtd我是作者/tdtd23/tdtd33.00/tdtd北京出版社/tdtd可借阅/tdtddiv classopa hrefbook_update.html?bookId1修改/aa hrefjavascript:void(0) onclickdeleteBook(1)删除/a/div/td/trtrtdinput typecheckbox nameselectBook value1 idselectBook classbook-select/tdtd2/tdtd大秦帝国第二册/tdtd我是作者/tdtd23/tdtd33.00/tdtd北京出版社/tdtd可借阅/tdtddiv classopa hrefbook_update.html?bookId2修改/aa hrefjavascript:void(0) onclickdeleteBook(2)删除/a/div/td/trtrtdinput typecheckbox nameselectBook value1 idselectBook classbook-select/tdtd3/tdtd大秦帝国第三册/tdtd我是作者/tdtd23/tdtd33.00/tdtd北京出版社/tdtd可借阅/tdtddiv classopa hrefbook_update.html?bookId3修改/aa hrefjavascript:void(0) onclickdeleteBook(3)删除/a/div/td/trtrtdinput typecheckbox nameselectBook value1 idselectBook classbook-select/tdtd4/tdtd大秦帝国第四册/tdtd我是作者/tdtd23/tdtd33.00/tdtd北京出版社/tdtd可借阅/tdtddiv classopa hrefbook_update.html?bookId4修改/aa hrefjavascript:void(0) onclickdeleteBook(4)删除/a/div/td/tr/tbody/tablediv classdemoul idpageContainer classpagination justify-content-center/ul/divscriptgetBookList();function getBookList() {$.ajax({type: get,url: /book/getList,success: function(books){var finalHtml ;for(var book of books){finalHtml tr;finalHtml tdinput typecheckbox nameselectBook valuebook.bookId idselectBook classbook-select/td;finalHtml tdbook.bookId/td;finalHtml tdbook.bookName/td;finalHtml tdbook.author/td;finalHtml tdbook.num/td;finalHtml tdbook.price/td;finalHtml tdbook.publish/td;finalHtml tdbook.statusCN/td;finalHtml tddiv classop;finalHtml a hrefbook_update.html?bookIdbook.bookId修改/a;finalHtml a hrefjavascript:void(0) onclickdeleteBook(book.bookId)删除/a;finalHtml /div/td/tr;}$(tbody).html(finalHtml);}});}//翻页信息$(#pageContainer).jqPaginator({totalCounts: 100, //总记录数pageSize: 10, //每页的个数visiblePages: 5, //可视页数currentPage: 1, //当前页码first: li classpage-itema classpage-link首页/a/li,prev: li classpage-itema classpage-link hrefjavascript:void(0);上一页\/a\/li,next: li classpage-itema classpage-link hrefjavascript:void(0);下一页\/a\/li,last: li classpage-itema classpage-link hrefjavascript:void(0);最后一页\/a\/li,page: li classpage-itema classpage-link hrefjavascript:void(0);{{page}}\/a\/li,//页面初始化和页码点击时都会执行onPageChange: function (page, type) {console.log(第page页, 类型:type);}});function deleteBook(id) {var isDelete confirm(确认删除?);if (isDelete) {//删除图书alert(删除成功);}}function batchDelete() {var isDelete confirm(确认批量删除?);if (isDelete) {//获取复选框的idvar ids [];$(input:checkbox[nameselectBook]:checked).each(function () {ids.push($(this).val());});console.log(ids);alert(批量删除成功);}}/script/div
/body/html
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title修改图书/titlelink relstylesheet hrefcss/bootstrap.min.csslink relstylesheet hrefcss/add.css
/headbodydiv classcontainerdiv classform-inlineh2 styletext-align: left; margin-left: 10px;svg xmlnshttp://www.w3.org/2000/svg width40fill#17a2b8 classbi bi-book-half viewBox0 0 16 16pathdM8.5 2.687c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492V2.687zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783z //svgspan修改图书/span/h2/divform idupdateBookinput typehidden classform-control idbookId nameiddiv classform-grouplabel forbookName图书名称:/labelinput typetext classform-control idbookName namebookName/divdiv classform-grouplabel forbookAuthor图书作者/labelinput typetext classform-control idbookAuthor nameauthor//divdiv classform-grouplabel forbookStock图书库存/labelinput typetext classform-control idbookStock namecount//divdiv classform-grouplabel forbookPrice图书定价/labelinput typenumber classform-control idbookPrice nameprice/divdiv classform-grouplabel forbookPublisher出版社/labelinput typetext idbookPublisher classform-control namepublish//divdiv classform-grouplabel forbookStatus图书状态/labelselect classcustom-select idbookStatus namestatusoption value1 selected可借阅/optionoption value2不可借阅/option/select/divdiv classform-group styletext-align: rightbutton typebutton classbtn btn-info btn-lg onclickupdate()确定/buttonbutton typebutton classbtn btn-secondary btn-lg onclickjavascript:history.back()返回/button/div/form/divscript typetext/javascript srcjs/jquery.min.js/scriptscriptfunction update() {alert(更新成功);location.href book_list.html}/script
/body/html
!DOCTYPE html
html langenheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/titlelink relstylesheet hrefcss/bootstrap.min.csslink relstylesheet hrefcss/login.cssscript typetext/javascript srcjs/jquery.min.js/script
/headbodydiv classcontainer-logindiv classcontainer-picimg srcpic/computer.png width350px/divdiv classlogin-dialogh3登陆/h3div classrowspan用户名/spaninput typetext nameuserName iduserName classform-control/divdiv classrowspan密码/spaninput typepassword namepassword idpassword classform-control/divdiv classrowbutton typebutton classbtn btn-info btn-lg onclicklogin()登录/button/div/div/divscript srcjs/jquery.min.js/scriptscriptfunction login() {$.ajax({type:POST,URL:/user/login,data:{name: $(#userName).val(),password: $(#password).val()},success:function(result){if(result){//账号密码正确location.href book_list.html;}else {alert(账号或密码错误);}}});//location.href book_list.html;}/script
/body/html 后端代码
首先我们创建图书类BookInfo
Data
public class BookInfo {private Integer bookId;private String bookName;private String author;private Integer num;private BigDecimal price;private Integer status;private String publish;private String statusCN;}
创建UserController实现登录验证接口
RequestMapping(/user)
RestController
public class userController {RequestMapping(/login)public boolean login(String name, String password, HttpSession session){if(!StringUtils.hasLength(name) || !StringUtils.hasLength(password)){return false;}if(admin.equals(name) admin.equals(password)){session.setAttribute(userName,name);return true;}return false;}
}
创建BookController来调用bookService再调用BookDao来实现图书列表
RequestMapping(/book)
RestController
public class BookController {Autowiredprivate BookService bookService;RequestMapping(/getList)public ListBookInfo getList(){return bookService.getList();}
Service
public class bookService {//bookDao是数据库访问中的一个对象现在我们对status这个对象进行修改Autowiredprivate BookDao bookDao;public static ListBookInfo getList(){ListBookInfo bookInfosnew ArrayList();for (BookInfo bookInfo:bookInfos) {if(bookInfo.getStatus()1){bookInfo.setStatusCN(可借阅);}else {bookInfo.setStatusCN(已借出);}}return bookInfos;}
}
Repository
public class BookDao {public ListBookInfo macData(){//创建一个储存图书ListBookInfo bookInfosnew ArrayList();for (int i 1; i 15 ; i) {//找图书BookInfo bookInfonew BookInfo();bookInfo.setBookId(i);bookInfo.setBookName(图书名称i);bookInfo.setAuthor(图书作者i);bookInfo.setNum(new Random().nextInt(100));bookInfo.setPrice(new BigDecimal(new Random().nextInt(100)));bookInfo.setStatus(i%20?2:1);bookInfo.setPublish(出版社i);bookInfos.add(bookInfo);}return bookInfos;}
}
最后调用前端页面的代码 应用分层
三层架构
把整体架构分为表现层、业务逻辑层和数据层.这种分层 ⽅式也称之为三层架构. 1.表现层:就是展⽰数据结果和接受⽤⼾指令的是最靠近⽤⼾的⼀层
2. 业务逻辑层:负责处理业务逻辑, ⾥⾯有复杂业务的具体实现
3. 数据层: 负责存储和管理与应⽤程序相关的数据
这三个部分在Spring中体现为 应用分层的好处
1.降低层与层之间的依赖使结构更加的明确利于各层逻辑的复用
2.开发人员可以只关注某一层极大地降低了开发成本和维护时间
3.更容易用新的实现替换原有的层次的实现 希望能对大家有所帮助
