房地产网站开发公司电话电商运营教程

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

房地产网站开发公司电话,电商运营教程,建设电影网站数据库脚本,网页升级访问永久更新目录 Web核心HTTP概念#xff1a;协议特点#xff1a;请求数据格式响应数据格式 Tomcat简介基本使用配置部署项目IDEA中创建 Maven Web 项目 IDEA使用Tomcat Servlet简介快速入门执行流程生命周期体系结构Servlet urlPattern配置一个Servlet#xff0c;可以配置多个 urlPatt… 目录 Web核心HTTP概念协议特点请求数据格式响应数据格式 Tomcat简介基本使用配置部署项目IDEA中创建 Maven Web 项目 IDEA使用Tomcat Servlet简介快速入门执行流程生命周期体系结构Servlet urlPattern配置一个Servlet可以配置多个 urlPatternurlPattern 配置规则 XML 配置方式编写 Servlet RequestResponseRequest获取请求数据Resquest 继承体系Request 获取请求数据获取请求参数通用方式获取请求参数中文乱码 Request 请求转发 Response设置响应数据Response 设置响应数据功能介绍Response 完成重定向路径问题Response 响应字符数据Response 响应字节数据 JSP简介JSP快速入门JSP原理JSP脚本EL表达式JSTL标签MVC模式和三层架构MVC模式三层架构MVC模式和三层架构的区别 会话跟踪技术CookieCookie基本使用发送 Cookie获取 Cookie Cookie原理Cookie使用细节Cookie 存活时间Cookie存储中文 SessionSession基本使用Session原理Session使用细节Session钝化、活化Session 销毁 Cookie 和 Session 的区别 Filter快速入门执行流程使用细节Filter拦截路径配置过滤器链 ListenerServletContextListener使用 AjaxAJAX快速入门Axios异步框架快速入门请求方式别名 JSON基础语法JSON对象和Java对象转换 VUE快速入门常用指令生命周期 Element快速入门布局组件 Web核心 Web 全球广域网也成为万维网www能够通过浏览器访问的网站 JavaWeb 是用 Java 技术来解决相关 Web 互联网领域的技术栈 JavaWeb技术栈 B/S架构Browser/Sever浏览器/服务器 架构模式特点是客户端只需要浏览器 应用程序的逻辑和数据存储在服务器端浏览器只需要请求服务器获取Web资源服务器把Web资源发给浏览器即可 好处易于维护升级服务器升级后客户端无需任何部署就可以使用到最新的版本 静态资源HTML、CSS、JavaScript、图片等负责页面展现动态资源Serlet、JSP等负责逻辑处理数据库负责存储数据HTTP协议定义通信规则Web服务器负责解析HTTP协议解析请求数据并发送响应数据 HTTP 概念 Hyper Text Transfer Protocol超文本传输协议规定了浏览器和服务器之间数据传输的规则 协议特点 基于TCP协议面向连接、安全基于请求-响应模型的一次请求对应一次响应HTTP协议是无状态的协议对于事务处理没有记忆能力每次请求-响应都是独立的 缺点多次请求间不能共享数据Java中使用会话技术Cookie、Session来解决这个问题优点速度快
请求数据格式 分3部分 请求行请求数据的第一行其中GET表示请求方式/ 表示请求资源路径HTTP/1.1表示协议版本请求头第二行开始格式为keyvalue形式请求体POST请求的最后一部分存放请求参数 GET请求和POST请求区别 GET请求的请求参数在请求行中没有请求体POST请求的请求参数在请求体中GET请求的请求参数大小有限制POST没有 常见的HTTP请求头 Host表示请求的主机名User-Agent浏览器版本例如Chrome浏览器的标识类似Mozilla/5.0……Chrome/79IE浏览器标识类似Mozilla/5.0Windows NT……like GeckoAccpet表示浏览器能接收的资源类型如text/*、image/*或者 */表示所有Accpet-Language表示浏览器偏好的语言服务器可以据此返回不同语言的网页Accept-Encoding表示浏览器可以支持的压缩类型例如gzip、deflate等 响应数据格式 分3部分 响应行响应数据的第一行其中HTTP/1.1表示协议版本200表示响应状态码OK表示状态码描述响应头第二行开始格式为keyvalue形式响应体最后一部分存放响应数据 常见的HTTP响应头 Content-Type表示响应内容的类型例如text/html、image/jpegContent-Length表示响应内容的长度字节数Content-Encoding表示该响应压缩算法例如gzipCache-Control指示客户端应如何缓存例如max-age300表示可以最多缓存300秒 状态码大类 状态码分类说明1xx响应中——临时状态码表示请求已经接受告诉客户端应该继续请求或者如果它已经完成则忽略它2xx成功——表示请求已经被成功接收处理已完成3xx重定向——重定向到其它地方它让客户端再发起一个请求以完成整个处理。4xx客户端错误——处理发生错误责任在客户端如客户端的请求一个不存在的资源客户端未被授权禁止访问等5xx服务器端错误——处理发生错误责任在服务端如服务端抛出异常路由出错HTTP版本不支持等 状态码大全https://cloud.tencent.com/developer/chapter/13553 常见的响应状态码 状态码英文描述解释200OK客户端请求成功即处理成功这是我们最想看到的状态码302Found指示所请求的资源已移动到由Location响应头给定的 URL浏览器会自动重新访问到这个页面304Not Modified告诉客户端你请求的资源至上次取得后服务端并未更改你直接用你本地缓存吧。隐式重定向400Bad Request客户端请求有语法错误不能被服务器所理解403Forbidden服务器收到请求但是拒绝提供服务比如没有权限访问相关资源404Not Found请求资源不存在一般是URL输入有误或者网站资源被删除了428Precondition Required服务器要求有条件的请求告诉客户端要想访问该资源必须携带特定的请求头429Too Many Requests太多请求可以限制客户端请求某个资源的数量配合 Retry-After(多长时间后可以请求)响应头一起使用431 Request Header Fields Too Large请求头太大服务器不愿意处理请求因为它的头部字段太大。请求可以在减少请求头域的大小后重新提交。405Method Not Allowed请求方式有误比如应该用GET请求方式的资源用了POST500Internal Server Error服务器发生不可预期的错误。服务器出异常了赶紧看日志去吧503Service Unavailable服务器尚未准备好处理请求服务器刚刚启动还未初始化好511Network Authentication Required客户端需要进行身份验证才能获得网络访问权限 Tomcat 简介 Tomcat是一个Web服务器应用程序对HTTP协议的操作进行封装使得程序员不必直接对协议进行操作让Web开发更加简便主要功能是“提供网上信息浏览服务” Tomcat 是 Apache 软件基金会的一个核心项目是一个开源免费的轻量级Web服务器支持Servlet/JSP少量的 JavaEE 规范 JavaEEJava Enterprise EditionJava 企业版指 Java 企业级开发的技术规范总和包含13项技术规范JDBC、JNDI、EJB、RMI、JSP、Servlet、XML、JMS、Java IDL、JTS、JTA、JavaMail、JAF Tomcat也被称为Web容器、Servlet容器Servlet需要依赖Tomcat才能运行 官网Apache Tomcat® - Welcome! 基本使用 下载官网下载安装绿色版直接解压即可卸载直接删除目录即可启动双击 bin目录下的 startup.bat 控制台中文乱码TomCat默认字符集是UTF-8Window控制台是GBKconf/logging.properties中的java.util.logging.ConsoleHandler.encoding UTF-8改为GBK 关闭 直接关掉运行窗口强制关闭bin\shutdown.bat正常关闭Ctrl C 正常关闭
配置 修改启动端口号conf/server.xml 注意HTTP协议默认端口号为80如果将Tomcat端口号改为80则将来访问Tomcat时将不用输入端口号 启动时可能出现的问题 端口号冲突找到对应程序将其关闭掉 启动窗口一闪而过检查JAVA_HOME环境变量是否正确配置
部署项目 将项目放置到 webapps 目录下即部署完成 一般 JavaWeb项目会被打成 war 包然后将 war 包放到 webapps目录下Tomcat会自动解压缩 war 文件 IDEA中创建 Maven Web 项目 Web项目结构 Maven Web项目结构开发中的项目 部署的 JavaWeb 项目结构开发完成可以部署
创建项目 使用骨架骨架项目模板 不使用骨架
IDEA使用Tomcat 有两种方式 将本地 Tomcat 集成到 IDEA 中然后进行项目部署即可 IDEA 中使用 Tomcat Maven 插件
Servlet 简介 Servlet 是 Java 提供的一门动态 Web 资源开发技术是 JavaEE 规范之一其实就是一个接口将来需要定义 Servlet 类实现 Servlet 接口并且由 Web 服务器运行 Servlet 快速入门 创建 Web 项目导入 Servlet 依赖坐标 dependencygroupIdjavax.servlet/groupIdartifactIdjavax.servlet-api/artifactIdversion3.1.0/versionscopeprovided/scope //该标签一定要设置的是依赖的范围测试和编译有效运行环境无效因为 Tomcat 中自带了Servlet的jar包运行时会冲突 /dependency创建定义一个类实现 Servlet 接口并重写接口中所有方法并在 service 方法中输入一句话 public class ServletDemo1 implements Servlet {public void service() {} }配置在类上使用 WebServlet 注解配置该 Servlet 的访问路径 WebServlet(/demo1) public class ServletDemo1 implements Servlet {访问启动 Tomcat 浏览器输入 URL 访问该 Servlet http://localhost:8080/Servlet/demo1
执行流程 Servlet 由谁创建 Servlet 方法由谁调用 Servlet 由 Web 服务器创建Servlet方法由 Web 服务器调用 服务器怎么知道 Servlet 中一定有 service 方法 因为我们自己定义的 Servlet必须实现 Servlet 接口并复写其方法而 Servlet 接口中有 service 方法 生命周期 Servlet 对象的生命周期指其从被创建到被销毁的整个过程 Servlet 运行在 Servlet 容器Web服务器中其生命周期由容器来管理分为4个阶段 加载和实例化默认情况下当 servlet 第一次被访问时由容器创建 Servlet 对象 WebServlet(urlPatterns “/demo1”, loadOnStartup 1) 配置路径时配置loadOnstartup参数 负整数默认情况值为-1第一次被访问时创建 Servlet 对象 0或正整数服务器启动时创建 Servlet 对象数字越小优先级越高 初始化在 Servlet 实例化之后容器将调用 Servlet 的 init() 方法初始化这个对象完成一些如加载配置文件、创建连接等初始化的工作该方法只调用一次 请求处理每次请求 Servlet 时Servlet 容器都会调用 Servlet 的 service() 方法对请求进行处理 服务终止当需要释放内存或者容器关闭时容器就会调用 Servlet 实例的 destroy() 方法完成资源的释放在 destroy() 方法调用之后容器会释放这个 Servlet 实例该实例随后会被 Java 的垃圾收集器所回收
体系结构 将来针对的B/S架构的web项目都是针对HTTP协议所以自定义Servlet会继承HttpServlet WebServlet(/demo4) public class ServletDemo4 extends HttpServlet {Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println(Get……);//Get 请求方式处理逻辑}Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {System.out.println(Post……);//Post 请求方式处理逻辑} }HttpServlet 中为什么要根据请求方式的不同调用不同方法如何调用 HttpServlet 原理 HTTP协议中GET和POST请求方式的数据格式不一样将来想要在 Servlet 中处理请求参数得在 service() 方法中判断请求方式并且根据请求方式的不同分别进行处理 HttpServlet 使用步骤 继承 HttpServlet重写 doGet 和 doPost 方法 HttpServlet原理 获取请求方式并根据不同的请求方式调用不同的 doXXX 方法 Servlet urlPattern配置 Servlet 要想被访问必须配置其访问路径urlPattern 一个Servlet可以配置多个 urlPattern WebServlet(urlPatterns {/demo5, /demo6}) 该注解加在类上面urlPattern 配置规则 精确匹配 配置路径WebServlet(“/user/select”) 访问路径 localhost:8080/web-demo/user/select 目录匹配 配置路径WebServlet(“/user/”) 访问路径 localhost:8080/web-demo/user/aaa localhost:8080/web-demo/user/bbb 注意 如果精确匹配和目录匹配出现冲突相同的目录精确匹配的优先级比目录匹配的优先级高 扩展名匹配 配置路径WebServlet(“*.do”) 访问路径 localhost:8080/web-demo/aaa.do localhost:8080/web-demo/bbb.do 注意 .do之前不可以加斜杠( / ) 任意匹配 配置路径 WebServlet(“/”) WebServlet(“/”) 访问路径 localhost:8080/web-demo/hehe localhost:8080/web-demo/haha 注意 / 和 /* 的区别 当项目中的 Servlet 配置了 / 会覆盖掉 tomcat 中的 DefaultServlet(conf文件夹下的web.xml中defaultServlet会处理项目中的静态资源如果覆盖掉会导致静态资源访问不到)当其他的 url-pattern 都匹配不上时会走这个 Servlet 当项目中配置了 /* 意味着匹配任意访问路径
优先级 精确路径 目录路径 扩展名路径 /* / XML 配置方式编写 Servlet Servlet 从3.0版本后开始支持使用注解配置3.0版本前只支持 XML 配置文件的配置方式 步骤 编写 Servlet 类 在 web.xml 中配置该 Servlet !–Servlet 全类名– servlet //servlet名可以随便起servlet-namedemo6/servlet-name //java文件全路径servlet-classcom/xixi/web/ServletDemo6.java/servlet-class /servlet!–Servlet 访问路径– servlet-mapping //上方servlet的名字servlet-namedemo6/servlet-name //网页上资源的访问路径url-pattern/demo6/url-pattern /servlet-mappingRequestResponse Request获取请求数据 Resquest 继承体系 Tomcat 需要解析请求参数封装为 Request对象并且创建 Request 对象传递到service方法中使用 Request对象查阅 JavaEE API 文档的 HttpServletRequest 接口 Request 获取请求数据 获取请求参数 请求数据的3部分 请求行GET/request-demo/req1?usernamezhangsan HTTP/1.1 String getMethod()获取请求方式GET String getContextPath()获取虚拟目录项目访问路径/request-demo ​ 通过在pom.xml中的tomcat中添加项目的访问路径的方式来进行动态获取路径 buildplugins!– tomcat 插件 –plugingroupIdorg.apache.tomcat.maven/groupIdartifactIdtomcat7-maven-plugin/artifactIdversion2.2/version !– configurationpath/xxx/path 通过动态的项目访问路径/configuration–/plugin/plugins/buildStringBuffer getRequesetURL()获取URL统一资源定位符http://localhost:8080/request-demo/req1 String getRequestURI()获取URI统一资源标识符/request-demo/req1 String getQueryString()获取请求参数GET方式usernamezhangsans…… 请求头User-Agent:Mozilla/5.0 Chrome/91.0.4472.106 String getHeader(String name)根据请求头名称获取值 请求体usernamesuperbabypassword123 ServletInputStream getInputStream()获取字节输入流 BufferedReader getReader()获取字符输入流
通用方式获取请求参数 请求参数获取方式 GET 方式 String getQueryString() POST 方式 BufferedRead getReader() 通用方式获取请求参数 MapString, String[ ] getParameterMap()获取所有参数Map集合 // 1.获取所有参数的 Map 集合 MapString, String[] map req.getParameterMap(); for (String key : map.keySet()) {System.out.print(key :);// 获取值String[] values map.get(key);for (String value : values) {System.out.print(values );}System.out.println(); }System.out.println(——);String[ ] getParameterValues(String name)根据名称获取参数值数组 // 2. 根据 key 获取参数值数组 String[] hobbies req.getParameterValues(hobby); for (String hobby : hobbies) {System.out.println(hobby); }String getParameter(String name)根据名称获取参数值单个值 // 3. 根据 key 获取单个参数值 String username req.getParameter(username); String password req.getParameter(password);System.out.println(username); System.out.println(password);中文乱码 POST 方式设置输入流的编码req.setCharacterEncoding(UTF-8); //1.解决中文乱码POST方式getReader() req.setCharacterEncoding(UTF-8);//2.获取 username String username req.getParameter(username); System.out.println(username);通用方式GET / POST先解码再编码 // GET 获取参数方式getQueryString // 乱码原因tomcat进行URL解码默认字符集是 ISO-8859-1 String username 张三;// 1. 先对乱码数据进行编码转为字节数组 //byte[] bytes username.getBytes(StandardCharsets.ISO_8859_1);// 2. 字节数组解码 //username new String(bytes, StandardCharsets.UTF_8); //替换上方两行代码 username new String(username.getBytes(StandardCharsets.ISO_8859_1), StandardCharsets.UTF_8);URL 编码实现方式 编码 URLEncoder.encode(str, “utf-8”); 解码 URLDecoder.decode(str, “ISO-8859-1”); Request 请求转发 请求转发forward一种在服务器内部的资源跳转方式 实现方式 req.getRequestDispatcher(“资源B路径”).forward(req, resp); 请求转发资源间共享数据使用 Request 对象 void setAttribute(String name, Object o)存储数据到 request 域中 Object getAttribute(String name)根据key获取值 void removeAttribute(String name)根据key删除该键值对 请求转发特点 浏览器地址栏路径不发生变化 只能转发到当前服务器的内部资源 一次请求可以在转发的资源间使用 request 共享数据 Response设置响应数据 Response 设置响应数据功能介绍 响应数据分为3部分 响应行HTTP/1.1 200 Ok void setStatus(int sc)设置响应状态码 响应头Content-Type:text/html void setHeader(String name, String value)设置响应头键值对 响应体htmlhead/headbody/body/html PrintWrite getWrite()获取字符输出流 ServletOutputStream getOutputStream()获取字节输出流
Response 完成重定向 重定向Redirect一种资源跳转方式 实现方式 resp.setStatus(302);//1.设置响应状态码302 resp.setHeader(“location”, “资源B的路径”);//2.设置响应头Location 代码简化 String contextPath req.getContextPath(); //动态获取虚拟路径 resp.sendRedirect(contextPath虚拟路径 “资源B的路径”); 重定向特点 浏览器地址栏路径发生变化 可以重定向到任意位置的资源服务器内部、外部均可 两次请求不能在多个资源使用 request 共享数据 路径问题 明确路径谁使用 浏览器使用需要加虚拟目录项目访问路径服务端使用不需要加虚拟目录 Response 响应字符数据 使用 通过 Response 对象获取字符输出流 PrintWriter writer resp.getWrite(); 写数据 writer.write(“aaa”);
注意 该流不需要关闭随着响应结束response 对象销毁由服务器关闭 中文数据乱码原因通过 Response 获取的字符输出流默认编码ISO-8859-1 resp.setContentType(“text/html;charsetutf-8”);//设置响应的数据格式和数据的字符集
Response 响应字节数据 使用 通过 Response 对象获取字符输出流 ServletOutputStream outputStream resp.getOutputStream(); 写数据 outputStream.write(字节数据); //1. 读取文件 FileInputStream fileInputStream new FileInputStream(d:a.jpg); //2. 获取 response 字节输出流 ServletOutputStream outputStream resp.getOutputStream(); //3. 完成流的 copy byte[] buff new byte[1024]; int len 0; while((len fileInputStream.read(buff)) ! -1) {outputStream.write(buff, 0, len); } // 关闭资源 fileInputStream.close();IOUtils 工具类使用 导入坐标 dependencygroupIdcommons-io/groupIdartifactIdcommons-io/artifactIdversion2.6/version /dependency使用 IOUtils.copy(输入流 输出流)
JSP 简介 Java Server PagesJSP HTML JavaJava 服务端页面它是一种动态的网页技术其中既可以定义 HTML、JS、CSS等静态内容还可以定义 Java 代码的动态内容用于简化开发避免了在 Servlet 中直接输出 HTML 标签 JSP快速入门 导入 JSP 坐标 dependencygroupIdjavax.servlet.jsp/groupIdartifactIdjsp-api/artifactIdversion2.2/versionscopeprovided/scope //注意这里要设置好范围 /dependency创建 JSP 文件 编写 HTML 标签和 Java 代码 bodyh1 hello jsp~ /h1%System.out.println(hello jsp~);// 里面是 Java 代码% /bodyJSP原理 JSP 本质上是一个Servlet JSP在被访问时由 JSP 容器Tomcat将其转换为 Java 文件Servlet再由 JSP 容器Tomcat将其编译最终对外提供服务的其实就是这个字节码文件 JSP脚本 JSP 脚本用于在 JSP 页面内定义 Java 代码 分类 %……%内容会直接放到 _jspService() 方法中%……%内容会放到 out.print()中作为out.print()的参数%……%内容会放到 _jspService()方法之外被类直接包含 EL表达式 Expression Language表达式语言用于简化 JSP 页面内的 Java 代码主要功能是获取数据 语法\({expression} \){brand}获取域中存储的 key 为 brand 的数据 JavaWeb 中的四大域对象 page当前页面有效request当前请求有效session当前会话有效application当前应用有效 el 表达式获取数据会依次从这4个域中寻找直到找到为止 JSTL标签 Jsp Standarded Tag LibraryJSP 标准标签库使用标签取代 JSP 页面上的 Java 代码 导入坐标(pom.xml文件中) !–jstl– dependencygroupIdjstl/groupIdartifactIdjstl/artifactIdversion1.2/version /dependencydependencygroupIdtaglibs/groupIdartifactIdstandard/artifactIdversion1.1.2/version /dependency在JSP页面上引入 JSTL 标签库jsp文件开头 % taglib prefixc urihttp://java.sun.com/jsp/jstl/core % %– 其中prefix属性是标签前缀uri是引入标签库的位置地址 –%使用 // if用法 c:if testtrueh1true/h1 /c:if c:if testfalseh1false/h1 /c:if// forEach用法 c:forEach itemsbrands varbrand varStatusstatus%– 其中brands属性代表被遍历的容器var属性代表遍历产生的临时变量 varStatus属性代表遍历状态对象–%tr aligncenter %– td\({brand.id}/td--%td\){status.index}/tdtd\({brand.brandName}/tdtd\){brand.companyName}/tdtd\({brand.order}/tdtd\){brand.description}/tdc:if test\({brand.status 1}td启用/td/c:ifc:if test\){brand.status ! 0}td禁用/td/c:if/tr/c:forEachc:forEach begin0 end2 step1 vari%–其中begin属性是开始位置、end属性是结束位置、step属性是步长、var是循环遍历i–%%– 相当于for(int i0;i2;i) –%${i} /c:forEachMVC模式和三层架构 MVC模式 MVC 是一种分层开发的模型其中 MModel业务模型处理业务VView视图界面展示CControl控制器处理请求调用模型和视图 MVC好处 职责单一有利于分工协作有利于组件重用 三层架构 数据访问层对数据库的CRUD基本操作业务逻辑层对业务逻辑进行封装组合数据访问层中的基本功能形成复杂的业务逻辑功能表现层接受请求封装数据调用业务逻辑层响应数据 MVC模式和三层架构的区别 MVC 是一种思想而三层架构是对MVC思想的一种实现 会话跟踪技术 会话用户打开浏览器访问 web 服务器的资源会话建立直到有一方断开连接会话结束。在一次会话中可以包含多次请求和响应 会话跟踪一种维护浏览器状态的方法服务器需要识别多次请求是否来自于同一浏览器以便在同一次会话的多次请求间共享数据 HTTP 协议是无状态的每次浏览器向服务器请求时服务器都会将该请求视为新的请求因此需要会话跟踪技术来实现会话内数据共享 实现方式 客户端会话跟踪技术Cookie服务端会话跟踪技术Session Cookie Cookie客户端会话技术将数据保存到客户端以后每次请求都携带 Cookie 数据进行访问 Cookie基本使用 发送 Cookie 创建 Cookie 对象设置数据 Cookie cookie new Cookie(“key”, value); 发送 Cookie 到客户端使用 response 对象 response.addCookie(cookie);
获取 Cookie 获取客户端携带的所有 Cookie使用 request 对象 Cookie[ ] cookies request.getCookies(); 遍历数组获取每一个 Cookie 对象for 使用 Cookie 对象方法获取数据 cookie.getName(); cookie.getValue();
Cookie原理 Cookie 的实现是基于 HTTP 协议的 响应头set-cookie请求头cookie Cookie使用细节 Cookie 存活时间 默认情况下Cookie 写入浏览器内存中当浏览器关闭内存释放则 Cookie 被销毁 setMaxAge(int seconds)设置 Cookie 存活时间 正数 将 Cookie 写入浏览器所在电脑的硬盘持久化存储到时间自动删除负数默认值Cookie 在当前浏览器内存中当浏览器关闭则 Cookie 被销毁零删除对应 Cookie Cookie存储中文 Cookie 不能直接存储中文 如需要存储则需要进行转码URL编码通过API Session Session服务端会话跟踪技术将数据保存到服务端是 JavaEE 提供的 HttpSession 接口来实现一次会话的多次请求间数据共享功能 Session基本使用 获取 Session 对象 HttpSession session request.getSession( ); Session 对象功能 void setAttribute(String name, Object o)存储数据到 session 域中Object getAttribute(String name)根据 key获取值void removeAttribute(String name)根据 key删除该键值对
Session原理 Session 是基于 Cookie 实现的 Session使用细节 Session钝化、活化 服务器重启后Session 中的数据是否还存在 钝化在服务器正常关闭后Tomcat 会自动将 Session 数据写入硬盘的文件中活化再次启动服务器后从文件中加载数据到 Session 中 注意Session 的 ID 默认是存储在 Cookie 中的如果重启浏览器那么会导致 Session 重新建立也就是说Session 是一个新的会话 Session 销毁 默认情况下无操作30分钟自动销毁 session-configsession-timeout30/session-timeout
/session-config调用 Session 对象的 invalidate() 方法
Cookie 和 Session 的区别 Cookie 和 Session 都是来完成一次会话内多次请求间数据共享的 区别 存储位置Cookie 将数据存储在客户端Session 将数据存储在服务端安全性Cookie 不安全Session 安全数据大小Cookie 最大是3KBSession 无限制存储时间Cookie 可以长期存储Session 默认30分钟服务器性能Cookie 不占用服务器资源Session 占用服务器资源、 Cookie 是用来保证用户未登录状态下的身份识别的 Session 是用来保存用户登陆之后的数据 Filter 概念Filter 表示过滤器是 JavaWeb 三大组件Servlet、Filter、Listener之一 过滤器可以把对资源的请求拦截下来从而实现一些特殊的功能 过滤器一般完成一些通用的操作比如权限控制、统一编码处理、敏感字符处理等等…… 快速入门 定义类实现 Filter 接口并重写其所有方法 public class FilterDemo implements Filter {//注意这里的Fileter包是javax.servlet下的不要导错包public void init(FilterConfig filterConfig){} //初始化public void doFilter(ServletRequest request,ServletResponse response,FilterChain chain){} //真正的拦截处理方法public void destroy(){} //销毁 }配置 Filter 拦截资源的路径在类上定义 WebFilter 注解 WebFilter(/*)// /意思是拦截所有 public class FilterDemo implements Filter {}在 doFilter 方法中输出一句话并放行 public void doFilter(ServletRequest request,ServletResponse response,FilterChain chain) {System.out.println(放行前逻辑);chain.doFilter(request,response);//放行System.out.println(放行后逻辑); }执行流程 放行后访问对应资源资源访问完成后还会回到 Filter 中而且回到 Filter 中是继续执行放行后的逻辑 放行前一般是对 Request 中的数据进行处理放行后则是对 Response 中的数据进行处理因为放行前有 Request 中是有数据的而 Response 中则是没有数据Response 中数据是需要放行后访问完资源在资源中设置的 使用细节 Filter拦截路径配置 Filter 可以根据需求配置不同的拦截资源路径在WebFilter注解中设置 拦截具体的资源“/index.jsp” 只有访问index.jsp时才会被拦截目录拦截“/user/” 访问 /user 下的所有资源都会被拦截后缀名拦截“.jsp” 访问后缀名为 jsp 的资源都会被拦截拦截所有“/” 访问所有资源都会被拦截 过滤器链 一个Web应用可以配置多个过滤器这多个过滤器称为过滤器链 注解配置的 Filter 优先级按照过滤器类名字符串的自然顺序 Listener 概念Listener表示监听器是 JavaWeb 三大组件Servlet、Filter、Listener之一可以监听就是在application、session、request三个对象创建、销毁或者往其中添加修改删除属性时自动执行代码的功能组件 Listener分类JavaWeb 中提供了8个监听器 监听器分类监听器名称作用ServletContext监听ServletContextListener用于对 ServletContext 对象进行监听创建、销毁ServletContextAttributeListener对 ServletContext 对象中属性的监听增删改属性Session监听HttpSessionListener对 Session 对象的整体状态的监听创建、销毁HttpSessionAttributeListener对 Session 对象中的属性监听增删改属性HttpSessionBindingListener监听对象于 Session 的绑定和解除HttpSessionActivationListener对 Session 数据的钝化和活化的监听Request监听ServletRequestListener对 Request 对象进行监听创建、销毁ServletRequestAttributeListener对 Request 对象中属性的监听增删改属性 ServletContextListener使用 定义类实现 ServletContextListener 接口 在类上添加 WebListener 注解 WebListener//注解 public class ContextLoaderListener implements ServletContextListener {//实现接口Overridepublic void contextInitialized(ServletContextEvent servletContextEvent) {//加载资源System.out.println(ContextLoadListener……);}Overridepublic void contextDestroyed(ServletContextEvent servletContextEvent) {//释放资源} }Ajax 概念AJAXAsynchronous JavaScript And XML异步的 JavaScript 和 XML 作用 与服务器进行数据交换通过 AJAX 可以给服务器发送请求并获取服务器响应的数据 使用了 AJAX 和服务器进行通信就可以使用 HTMLAJAX 来替换 JSP 页面 异步交互可以在不重新加载整个页面的情况下与服务器交换数据并更新部分网页的技术如搜索联系、用户名是否可用校验等等…… 同步和异步 AJAX快速入门 编写 AjaxServlet并使用 response 输出字符串 创建 XMLHttpRequest 对象用于和服务器交换数据 var xmlhttp; if(window.XMLHttpRequest) {//code for IE7,Firefox,Chrome,Safarixmlhttp new XMLHttpRequest(); } else {xmlhttp new ActiveXObject(Microsoft.XMLHTTP); }向服务器发送请求 xmlhttp.open(GET,url);//url中一般是填写全路径网页地址因为前后端分离之后业务不是在同一个服务器上部署的 xmlhttp.send();//发送请求获取服务器响应数据 xmlhttp.onreadystatechange function() {if(xmlhttp.readState 4 xmlhttp.status 200) {alert(xmlhttp.responseText);} }详情访问AJAX 简介 (w3school.com.cn) Axios异步框架 Axios 对原生的 AJAX 进行封装简化书写 快速入门 引入 axios 的 js 文件 script srvjs/axios-0.18.0.js/script使用 axios 发送请求并获取响应结果 // 括号内大括号代表一javascript个对象 // GET 方式 axios({method:get,url:http://localhost:8080/ajax-demo1/aJAXDemo1?usernamezhangsan }).then(function(resp){alert(resp.data); })// POST 方式 axios({method:post,url:http://localhost:8080/ajax-demo1/aJAXDemo1,data:usernamezhangsan }).then(function(resp){alert(resp.data); })请求方式别名 为方便Axios 已将为所有支持的请求方法提供了别名 axios.get(url[,config]) axios.delete(url[,config]) axios.head(url[,config]) axios.options(url[,config]) axios.post(url[,data[,config]]) axios.put(url[,data[,config]]) axios.patch(url[,data[,config]]) 实例 // GET axios.get(url).then(function(resp){alert(resp.data);}); // POST axios.post(url,参数).then(function(resp){alert(resp.data);});JSON 概念JavaScript Object NotationJavaScript对象表示法键值对方式传输数据 语法简单层次结构鲜明多用于作为数据载体在网络中进行数据传输 基础语法 定义 var 变量名 { ​ “key1”: value1, ​ “key2”: value2, ​ …… }; value 的数据类型为 数字整数或浮点数字符串在双引号中逻辑值true或false数组在方括号中对象在花括号中null 获取数据 变量名.key JSON对象和Java对象转换 请求数据JSON 字符串转为 Java 对象 响应数据Java 对象转为 JSON 字符串 Fastjson 是阿里巴巴提供的一个 Java 语言编写的高性能功能完善的 JSON 库是目前 Java 语言中最快的 JSON库可以实现 Java 对象和 JSON 字符串的相互转换 使用 导入坐标 dependencygropIdcom.alibaba/groupIdartifactIdfastjson/artifactIdversion1.2.62/version /dependencyJava 对象转 JSON String jsonStr JSON.toJSONString(obj); JSON 字符串转 Java 对象 User user JSON.parseObject(jsonStr, User.class);
VUE Vue 是一套前端框架免除原生 JavaScript 中的 DOM 操作简化书写 基于 MVVMModel-View-ViewModel思想实现数据的双向绑定将编程的关注点放在数据上 官网Vue.js - 渐进式 JavaScript 框架 | Vue.js (vuejs.org) 快速入门 新建 HTML 页面引入 Vue.js 文件 script srcvue.js文件的路径:js/vue.js/script在 JS 代码区域创建 Vue 核心对象进行数据绑定 new Vue ({el:#app,//选择器data() {return {username://username是注册的模型//模型都在这里注册键值对结构}}/data: function() {return {username:}}/ });编写视图 div idappinput nameusername v-modelusername{{username}}//插值表达式 /div常用指令 指令HTML 标签上带有 v- 前缀的特殊属性不同指令具有不同含义例如v-if、v-for…… 常用指令 指令作用v-bind为 HTML 标签绑定属性值如设置 href、css 样式等v-model在表单元素上创建双向数据绑定v-on为 HTML 标签绑定事件v-ifv-else条件性的渲染某元素判定为true时渲染否则不渲染v-else-ifv-show根据条件展示某元素区别在于切换的是 display 属性的值v-for列表渲染遍历容器的元素或者对象的属性 v-bind: a v-bind:hrefurlXXXX/a//v-bind 可以省略a :hrefurlXXXX/av-model: input nameusername v-modelusernamev-on: html:input typebutton value一个按钮 v-on:clickshow()input typebutton value一个按钮 clickshow() vue:new Vue ({el:#app,methods:{show() {alert(我被点了);}}});v-if、v-else、v-else-if、v-show v-if div v-ifcount(模型名)3div1/div div v-else-ifcount(模型名)2div2/div div v-elsediv3/div v-show div v-showcount3div4/divv-for v-fordiv v-foraddr in addrs{{addr}}br /div 加索引div v-for(addr,i) in addrs{{i1}:{addr}}br//下标i从0开始/div生命周期 生命周期分为八个阶段每触发一个生命周期事件会自动执行一个生命周期方法钩子 状态阶段周期beforeCreate创建前created创建后beforeMount载入前mounted挂载完成beforeDestroy更新前updated更新后beforeDestroy销毁前destroyed销毁后 mounted挂载完成Vue初始化成功HTML页面渲染成功可以发送异步请求加载数据 new Vue ({el:#app,mounted() {alert(vue 挂载完成发送异步请求);} })Element Element是饿了么公司前端开发团队提供的一套基于 Vue 的网站组件库用于快速构建网页 组件组成网页的部件例如超链接、按钮、图片、表格等等 快速入门 引入 Element 的 css、js 文件和 Vue.js script srcvue.js/script script srcelement-ui/lib/index.js/script link relstylesheet hrefelement-ui/lib/theme-chalk/index.css创建 Vue 核心对象 scriptnew Vue({el:#app}) /script官网复制 Element 组件代码 Element - 网站快速成型工具
布局 Layout布局通过基础的 24 分栏迅速简便的创建布局 COntainer 布局容器用于布局的容器组件方便快速搭建页面的基本结构 组件 官网抄