使用Intellij idea新建Java Web项目(servlet) 原理及初步使用

准备

1. JDK       (配置JDK_HOME\bin   和 CLASSPATH)   注：JDK8下载已经需要注册了，请使用JDK11（现在是官方长期支持的版本）     对于我们新手来说，JDK11的门槛更多在于：JDK9以来更新的module管理。 但是对module配置方面陌生不应该是守旧的原因，请看： JDK8过渡到JDK11
2. Tomcat  (需要配置CATALINA_HOME，并为servlet配置CLASSPATH   %CATALINA_HOME%\lib\servlet-api.jar)

   　　　　有关环境配置的知识:   JAVA SE11环境变量配置（Windows）        Java中设置环境变量CLASSPATH的意义

3. 熟悉IDEA最基本操作： IDEA为新手专业打造

4. HttpServlet 详解（基础）

　遇到的坑：

三 级标题

四 级标题

1. Java Web项目中解决中文乱码方法总结
2. IDEA 在同一目录创建多个项目
3. 解决 IDEA 部署 Tomcat 时，输出路径没有静态资源 ：idea输出文件夹没有jsp页面
4. servlet的url-pattern匹配规则详细描述

---

原理了解

1. HTTP协议详解 - 小坦克 - 博客园   (建议看完他的HTTP专题)    [get是requset的一种]

   Python | 解析pcap文件分析HTTP Request/Response报文 | 小武的博客

2. HTML from 表单提交请求到servlet 实例

   Http响应Response详解 - 勇敢的心 - CSDN博客

   　　             利用HTML的表单get提交功能，后台Servlet处理request / response

   [response就是平时HTTP把html文件“送”到浏览器的方式

   抓包中看到的各种元素

   servlet的本质是什么，它是如何工作的？ - 知乎

3. JSP与servlet的关系：javaweb学习总结(十四)——JSP原理

   　　　  　　既然开发Java Web项目，那就默认会HTML开发了

4. JSON教程导读

   　　            事实上关于网页的语言学习都可以看一下国内两个W3cschool网站

　如果想抓包一下，可以用现代浏览器如Chrome Firefox打开一个网页，然后F12开发者工具 - NetWork 勾上“”Preserve log”，F5刷新一下，可以看到一堆文件，随便点一个，点击Header或Response

---

开始

首先按如下方法创建JavaEE Web Application项目

Intellij idea创建javaWeb以及Servlet简单实现 - yhao2014的专栏 - CSDN博客

Ps.记得让防火墙放过IntelliJ idea，Idea的代码提示错误是在右侧边栏，没有窗口的...

(如果Application Server选项里没有Tomcat，可以点击旁边的NEW   选择Tomcat Server，然后JIDEA会自动识别你的环境变量)

附：Tomcat 9.0.X 控制台乱码最优解决方案

然后开始代码实现

如果只改动了资源文件,需要刷新Tomcat

在InteliJ Idea里运行Servlet有个坑，

事实上调试栏上的开始是使用Tomcat 8080端口，这个会使得web.xml生效

而浏览器那一栏是单元测试，是用来测试网页的，修改html后刷新就会生效，和Tomcat无关。默认是使用InteliJ Idea的服务器，不会使用你的web.xml.........

（建议，网页编辑部分用VSCode+Live Server插件，保存即可自动刷新预览）

Ps. 如果修改了 web.xml ，则需要Redeploy重新部署    （直接Update classes and resources是没用的，毕竟Tomcat说了算）

另外，我做了一个示例（JDK11 Tomcat9）

度盘链接: https://pan.baidu.com/s/1smw_cTgQXvV8NkB9HaHtOQ

（由于太小，放github浪费，就丢网盘了）提取码: tasz

稍微深入地理解一下Servlet：Java Web(一) Servlet详解！！   [非常重要]

如果看不懂，请看此处解释：

其实就是利用HTML的<form>表单功能：
填写完HTML表单点击“登录”或“取消”（其实我偷懒，所以取消和登录功能写一样了）
然后就会触发表单的submit，这时通知浏览器发送表单内容
其实就是使用表单指定的方法(这里是GET)发送，其实和你直接浏览器访问
 http://localhost/Login?username=a&password=2
是一样的

然后作为 实现了Servlet和Web等功能的服务器Tomcat，Tomcat 就会按照WEB.xml里描述的去拦截Login这个路径并转由 LoginServlet 这个类处理，这样就使得LoginServlet类并启动并执行。

之后LoginServlet类就接收Request，根据函数体定义处理，最后发回Response
然后浏览器收到了Response

注：Response可以是一个HTML资源，也可以是其他的，最后浏览器根据Response来生成并显示网页内容

---

逐渐增加功能

1, 使用AJAX技术动态加载内容

我参考了：http://www.w3school.com.cn/ajax/index.asp  短短几页，请务必看完

当然，目前还有一种新技术Fetch可以用

 function loadXMLDoc() {
     var xmlhttp = new XMLHttpRequest();
     console.log("Good");
     xmlhttp.open("GET","Login?username=Bill&passwd=jkkdsf",true);
     xmlhttp.send();

     xmlhttp.onreadystatechange=function() {         /*必须先判断状态*/
         if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
             document.getElementById("datalist").innerHTML = xmlhttp.responseText;
         }
     }

 }

ajax-demo.js

<!--               </form>标签后面                       -->

        <div id="datalist"></div>

<!--    JS部分放在后面，便于页面内容更快加载展示   -->
    <script src="script/ajax-demo.js"></script>

<!---              </body>之前                              -->

index.html改动部分

由于JS里的get内容是错误的用户名密码，所以LoginServlet类会转发LoginError.html的所有内容到浏览器，

然后JS把response的Text内容都写到id为datalist的元素里

效果（非常粗暴的把LoginError.html全部加载进来了，但是去掉了一些html标签，我猜测是 浏览器自动去掉的）

由此可见，我们可以轻轻松松地用 JDBC  Servlet  AJAX 来做一个动态加载数据库内容的Java Web项目

稍微深入理解一下Servlet

安全方面（web.xml分角色权限）

java - 使用一个JDBC领域，Glassfish 3安全- 基于表单 认证

使用JDBC读写数据库与网页交互

jsp+servlet+jdbc实现表单提交

JSP+Servlet+JDBC+MySQL实现表单生成

将JDBC ResultSet解析为JSON格式

由于我要做管理员界面，所以不考虑SEO，因此全部前后端分离

关于前后端分离：JavaWeb项目为什么我们要放弃jsp？为什么要前后端解耦？为什么要前后端分离？2.0版，为分布式架构打基础。

前后端分离后对http地址路径的处理：用nginx的反向代理机制解决前端跨域问题

---

资料区

非常好非常基础的JavaWeb入门教程(Servlet JSP SSH SSM都讲到了)：https://skyline75489.github.io/Heart-First-JavaWeb/

通过浏览器打开网页的底层故事：What-happens-when 的中文翻译

JS函数式编程学习：https://skyline75489.github.io/learnrx-zh-cn/

AJAX读取JSON的思路和AJAX读取XML差不多
[感想]原来XML和HTML相近的好处：用JS处理时，调用方法一样 如getElementsByTagName("TITLE");

---

[计划(不存在的，永久搁置)]

1. 初步前后端分离，利用JSON传递内容，js处理JSON并修改HTML    (JSON是传递数据的一种格式，比XML简洁高效)
2. 再继续分离，静态页面交给Nginx(性能好)，动态交给Tomcat。    [这个只要让Nginx指定某个路径交给Tomcat就行，权限方面由web.xml配置控制]
3. 单点登录SSO
4. 后续会逐步采用Maven、SSM+SpringBoot
5. 甚至使用nodejs / node-fetch处理JSON

<待写内容>

介绍MVC等抽象模型概念 从Script到Code Blocks、Code Behind到MVC、MVP、MVVM

　　框架 架构 设计模式的区别：  架构、框架和设计模式关系

　　 　【架构】 简单的说架构就是一个蓝图，是一种设计方案，将客户的不同需求抽象成为抽象组件，并且能够描述这些抽象组件之间的通信和调用。

【框架】 软件框架是项目软件开发过程中提取特定领域软件的共性部分形成的体系结构，不同领域的软件项目有着不同的框架类型。框架不是现成可用的应用系统。而是一个半成品，提供了诸多服务，开发人员进行二次开发，实现具体功能的应用系统。

【设计模式】 是一套被反复使用、多数人知晓的、经过分类编目的、代码设计经验的总结，它强调的是一个设计问题的解决方法。
-------------   lfsf802

JSON

<待了解概念>

Java设计模式

设计模式