Web学习笔记

本文介绍: We b 学习笔记 flask库前端基础超链接：空连接：图片：视频（音频）：嵌套使用列表表格格式化表格 input 表单系列网络请求GET方式POST请求通过GET方式获取输入参数通过POST方式获取输入参数注册页面CSS三种使用方式行内式外联式内嵌式选择器1、类选择器2、id 选择器3、标签选择器4、通配符选择器5、属性选择器6、后代选择器CSS样式高度与宽度字体和颜色MySQL基础SQL语言SQL分类DDLDMLDQL约束事务JDBCJa vaSv rip t基础语法BOM对象DOM事件监听HTTPHTTP请求数据格式H

flask库

基本使用方法：python与前端交互

from flask import Flask, render_template, request

app = Flask(__name__, template_folder="templates")

# 用户在浏览器访问/chat时自动执行 index() 函数。
@app.route("/chat")
def index():
    # return "中国联通！"
    # 将html文件放在templates文件夹下
    return render_template("./open1.html") 

@app.route("/chat")
def index2():
    return render_template("./open2.html")  

if __name__ == "__main__":
    app.run(port=8000)  # 自定义端口号（默认5000）

前端基础

&lt;h1&gt;一级标签&lt;/h1&gt;
<h2&gt;二级标签</h2&gt;
<div&gt;块级标签（占一行）</div&gt;
<span&gt;行内标签（不独立占行）</span&gt;

<b>文本加粗</b>
<strong>文本加粗</strong>

<u>下划线</u>
<ins>下划线</ins>

<i>倾斜</i>
<em>倾斜</em>

<s>删除线</s>
<del>删除线</del>

<!-- hr水平分割线 br换行符 p段落 -->
<hr>
<br>

<!-- 空格 -->
我要&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;学习

<!-- 行内式CSS -->
<div>
    /* 注释 */
    <span style="color: red;">时间</span>
    <span>2020.10.10</span>
</div>

超链接：

target=”_blank“在新窗口打开标签，默认是覆盖原网页

<a href="https://www.baidu.com/" target="_blank">百度</a>

空连接：

<a href="#">空链接</a>

图片：

也可以设置 width=10% 这种。

<img src="R.jpg" alt="加载失败的替换文本" title="鼠标悬停时的提示文字" width="400">

视频（音频）：

controls 表示显示播放的控件，auto play 自动播放(部分浏览器不支持)，loop 循环播放

<audio src="时间的尽头.mp3" controls autoplay loop></audio>

嵌套 使用

点击图片即可跳转到链接

<a href="https://www.baidu.com/" target="_blank">
    <img src="../baidu.png" alt="百度一下" width="300px">
</a>

列表

无序列表

<ul>
    <li>榴莲</li>
    <li>香蕉</li>
    <li>苹果</li>
</ul>

有序列表

<ol>
    <li>张三</li>
    <li>李四</li>
    <li>王五</li>
</ol>

自定义列表

<dl>
    <dt>主题1</dt>
    <dd>项目1</dd>
    <dd>项目2</dd>
    <dt>主题2</dt>
    <dd>项目1</dd>
    <dd>项目2</dd>
</dl>

表格

<table border="1" width="300" height="100">
    <caption><strong>学生成绩单</strong></caption>
    <tr> <!-- tr表示行 -->
        <th>姓名</th>   <!-- th表示表头单元格 -->
        <th>成绩</th>
        <th>评语</th>
    </tr>
    <tr>
        <td>司马懿</td>  <!-- tr表示普通单元格 -->
        <td>90</td>
        <td>真棒</td>
    </tr>
    <tr>
        <td>诸葛亮</td>
        <td>100</td>
        <td>非常棒</td>
    </tr>
</table>

格式化表格

<table border="1" width="300" height="100">
    <caption><strong>学生成绩单</strong></caption>
    <thead>
        <tr> <!-- tr表示行 -->
            <th>姓名</th>   <!-- th表示表头单元格 -->
            <th>成绩</th>
            <th>评语</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>司马懿</td>  <!-- tr表示普通单元格 -->
            <td rowspan="2">90</td><!-- rowspan跨行合并 -->
            <td>真棒</td>
        </tr>
        <tr>
            <td>诸葛亮</td>
            <td>非常棒</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td colspan="3">总结</td><!-- colspan跨列合并 -->
        </tr>
    </tfoot>
</table>

input 表单 系列

具有重置提交按钮的输入框

<form method="post" action="提交地址">
    <input type="text" placeholder="输入用户名"><br>
    <input type="password" placeholder="请输入密码"><br>
    <input type="reset">
    <input type="submit">
</form>

单选框
 checked 表示默认选中

性别：
<input type="radio" name="gender">男
<input type="radio" name="gender" checked>女<br>

多选框

爱好：<input type="checkbox" name="hobby">游泳
    <input type="checkbox" name="hobby">读书
    <input type="checkbox" name="hobby">跑步

下拉菜单

multiple表示多选

<select name="city" multiple>
    <option>北京</option>
    <option>上海</option>
    <option selected>深圳</option>
    <option>广州</option>
</select>

文件选择

选择文件：<input type="file"><br>
选择多个文件：<input type="file" multiple>

多行文本框

<textarea name="more" cols="30" rows="3"></textarea>

网络 请求

GET方式

将请求数据拼接到url中。请求数据作为参数在url中。

POST请求

请求数据在请求头和请求体中。

通过GET方式 获取 输入参数

from flask import Flask, render_template, request

app = Flask(__name__, template_folder="templates")

# 用户在浏览器访问/chat时自动执行 index() 函数。
@app.route("/get/register", methods=["GET"])
def index1():
    # 将html文件放在templates文件夹下
    return render_template("./open.html")  

@app.route("/get/result", methods=["GET"])
def index2():
    # 获得用户输入信息
    print(request.args)
    return "注册成功！"

if __name__ == "__main__":
    app.run(port=8000)  # 自定义端口号（默认5000）

通过POST方式 获取 输入参数

from flask import Flask, render_template, request

app = Flask(__name__, template_folder="templates")

# 用户在浏览器访问/chat时自动执行 index() 函数。
@app.route("/register", methods=['get', 'post'])
def index1():
    # 将html文件放在templates文件夹下
    return render_template("./open.html")  

@app.route("/post/result", methods=["post"])
def index3():
    # 获得用户输入信息
    print(request.form)
    user = request.form.get("user")
    pwd = request.form.get("pwd")
    # getlist获取多标签
    return "注册成功！"

if __name__ == "__main__":
    app.run(port=8000)  # 自定义端口号（默认5000）

注册页面

./open.html文件

method=是请求方式，action=返回地址。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录界面</title>
</head>
<body>
    <form method="post" action="/post/result">
        用户名<input type="text" name="user" placeholder="输入用户名">
        <br>密码
        <input type="password" name="pwd" placeholder="输入密码">
        <br>
        <input type="submit">
        <input type="reset">
    </form>
</body>
</html>

简化版本
 python

from flask import Flask, render_template, request

app = Flask(__name__, template_folder="templates")

# 用户在浏览器访问/chat时自动执行 index() 函数。
@app.route("/register", methods=['get', 'post'])
def register():
    # 将html文件放在templates文件夹下
    return render_template("./open.html")  

@app.route("/result", methods=['get', 'post'])
def do_register():
    # 判断html文件的请求参数的获取方式
    if request.method == "get":
        print(request.args)
        print("get方式")
        print("注册成功！")
    else:
        # post方式获得用户输入信息
        print(request.form)
        user = request.form.get("user")
        pwd = request.form.get("pwd")
        print("post方式")
        return "注册成功！"
    
if __name__ == "__main__":
    app.run(port=8000)  # 自定义端口号（默认5000）

html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录界面</title>
</head>
<body>
    <!-- -->
    <form method="post" action="/result">
        用户名<input type="text" name="user" placeholder="输入用户名">
        <br>密码
        <input type="password" name="pwd" placeholder="输入密码">
        <br>
        <input type="submit">
        <input type="reset">
    </form>
</body>
</html>

CSS

三种使用方式

行内式

<p style="color: red;background-color: darkgreen;">这是一段文字</p>

外联式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 外联语句 -->
    <link rel="stylesheet" href="./my.css">
</head>
<body>
    <p class="x">外联式使用CSS</p>
</body>
</html>

my.css 文档

.x{
    color: brown; 
    font-size: 30px;
    background-color:gold;
    width: 250px;
    height: 50px;
}

内嵌式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /*内嵌式CSS*/
        .x{
           color: brown; 
           font-size: 30px;
           background-color:gold;
           width: 250px;
           height: 50px;
        }
    </style>
</head>
<body>
    <p class="x">这是HTML文件</p>
    这是HTML文件
</body>
</html>

选择器

1、类选择器

如果同时使用两个类选择器，并且有格式冲突，那么默认选择style中位置靠后的格式，如果不想被覆盖，可以在前面的某个格式属性中加入!important作为标注，如：color:red !important;

<head>
    <style>
        /*定义CSS类，以.开头*/
        .red{
            color: crimson;
        }
        .size{
            font-size: 66px;
        }
    </style>
</head>
<body>
    <!-- 使用CSS类 -->
    <p class="red size">222</p>

</body>

2、id选择器

<head>
    <style>
        #a{
            color: chartreuse;
        }
    </style>
</head>
<body>
    <!-- 但一个id只能使用一次，一般配合JS使用 -->
    <p id="a">一段文字</p>
</body>

3、标签选择器

<head>
    <style>
        p{
            color: chartreuse;
        }
    </style>
</head>
<body>
    <!-- 所有的p标签都会被使用 -->
    <p>一段文字</p>
</body>

4、通配符选择器

<head>
    <style>
        /*所有标签的都会被渲染，一般用于处理文字格式*/
        *{
            color: blueviolet;
            padding: 0;
            margin: 0;
        }
    </style>
</head>
<body>
    <p>先改年号</p>
    <div>你好</div>
    <span>我好</span>
</body>

5、属性选择器

<style>
    input[type="text"]{
        border: 1px solid red;
    }
</style>

<!-- text输入框会有红色边框 -->
<input type="text">
<input type="password">

或者如下：

<style>
    .v1[xx="123"]{
        color: gold;
    }
</style>

<!-- 第一行文字变成金色 -->
<div class="v1" xx="123">s</div>
<div class="v1" xx="456">s</div>
<div class="v1" xx="789">s</div>

6、后代选择器

<style>
    /* 如果写成.yy > li 则只会查找子代标签，不会查找孙代标签 */
    .yy li{
        color: red;
    }
</style>

<div class="yy">
    <ul>
        <li>美国</li>
        <li>日本</li>
        <li>韩国</li>
    </ul>
</div>

CSS样式

高度与宽度

.c{
    height: 300px;
    width: 50%;
}

备注：

宽度支持百分比，高度不支持。
行内标签默认无效，块级标签会占用一整行。
可以通过 display:inline-block;修改。（兼具行内与块级标签的优势）。

字体和颜色

颜色、大小、加粗、字体

.c{
    color: #00FF7F;
    font-size: 58px;
    font-weight: bolder;
    font-family: 'Times New Roman', Times, serif;

    border: 1px solid red; /*边框*/
    text-align: center;    /*水平方向居中*/
    line-height: 59px;     /*垂直方向居中，跟方框大小相关*/
}

块级标签的浮动

.c{
    /* 标签浮动 */
    float: left;
    height: 100px;
    width: 100px;
    border: 1px solid red;
}

<div>
    <div class="c"></div>
    <div class="c"></div>
    <div class="c"></div>
    <!-- 将浮动的标签拽回 -->
    <div style="clear: both;"></div>
</div>

设置div的边距（内边距） “`css .c{ padding–top:20px; padding-left:20px; padding:20px; /*上下左右都设置*/ padding: 20px 10px 5px 20px; /*上右下左*/ } “` 外边距（离其他div块的距离） “`css .c{ margin–top:20px; } “` 区域居中 “`css mar gin: 2px auto; /*上边两个像素，左右自动居中*/ “`

MySQL基础

下载：https://downloads.mysql.com/archives/community/

启动关闭：

启动：net start mysql
关闭：net stop mysql

登陆：mysql -uroot -p
退出：exit

登陆参数：

mysql -u用户名 -h服务器地址（默认127.0.0.1） -P端口号（默认3306）

卸载：

net stop mysql
mysqld -remove mysql
删除相关目录和环境变量

SQL语言

show databases; -- 分号结尾，不区分大小写
-- 单行注释
# mysql特有单行注释
/*多行注释*/

SQL分类

DDL：数据定义语言，操作数据库和表
DML：数据操作语言：对数据增删改
DQL：数据查询语言：对数据查询
DCL：数据控制语言：定义数据库的访问权限和安全级别，以及创建用户。

DDL

创建数据库

create database db1;
create database if not exists db1;

删除数据库

drop database db2;
drop database if exists db2;

使用数据库

use db1;
-- 查看当前使用的数据库
select database();

创建表Create

show tables; -- 查询表
desc da1;    -- 查询表结构

create table tb_user( -- tb_user是表名
    id int,           -- id 表头，数据类型为int
    username varchar(20), -- 最大20位字符串（变长）
    password varchar(20), 
);

tb_user

id	username	pass word

删除表

drop table if exists tb_user;

修改表

-- 修改表名
alter table 表名 rename to 新表名;
-- 添加列
alter table 表名 add 列名 数据类型;
-- 修改数据类型
alter table 表名 modify 列名 新数据类型;
-- 修改列名与数据类型
alter table 表名 change 列名 新列名 新数据类型;
-- 删除列
alter table 表名 drop 列名;

DML

添加数据

指定列添加数据(列与值一一对应)

insert into 表名(列名1，列名2...) values(值1，值2，...);

全部列添加数据(需要与表头数量相等)

insert into 表名 values(值1，值2，...);

批量添加数据

insert into 表名(列名1，列名2...) values(值1，值2，...),(值1，值2，...),(值1，值2，...),...;
insert into 表名 values(值1，值2，...),(值1，值2，...),(值1，值2，...),...;

修改数据
如果没有写条件会改变所有记录

-- 格式：updata 表名 set 列名1=值1，列名2=值2，...[where 条件];
update stu set sex = '女' where name = '张三';

删除数据

delete from 表名 while 条件;

DQL

单表查询

select 列名1，列名2，... from 表名;

-- 去除重复结果
select distinct 列名1，列名2，... from 表名;

-- 起别名
select name as 姓名，sex as 性别, ... from 表名;

条件查询

select * from 表名 while 条件;

模糊查询

select * from 表名 while name like '_化%'; -- like关键字，_匹配一个字符，%匹配多个字符

排序查询

select 列表字段 from 表名 order by 排序字段名1[排序方式],排序字段名2[排序方式],...;

排序方式

asc 升序(默认)
desc降序

聚合函数：将一列作为整体纵向计算。

count(列名) 统计数量
sum(列名) 求和
max(列名) 最大值
min(列名) 最小值
avg(列名) 平均值

select count(id) from stu;  -- 统计id数量

分页查询(limit是MySQL的方言)

select 字段列表 from limit 起始索引，查询条目数;

起始索引 = （当前页码-1）*每页条目数

约束

主键约束：primary key
非空约束：not null
唯一约束：unique
检查约束：check
默认约束：default (未填写数据时使用默认数据)

create table emp(
    id int primary key,
    name varchar(10) not null unique,
    salary double(7,2) default 0
);

事务

一组数据库操作命令，要么同时失败要么同时成功（绑定）

-- 开启事务
begin;
-- 提交事务(操作成功时提交)
commit;
-- 回滚事务(回到事务开启之前的操作)
rollback;

JDBC

使用java 操作数据库(Java DataBase Connectivity)
首先在创建工程之后应该导入驱动包。
框架

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.Statement;

public class JDBCDemo {
    public static void main(String[] args) throws Exception {
        //注册驱动
        Class.forName("com.mysql.jdbc.Driver");
        //获取连接
        String url = "jdbc:mysql://127.0.0.1:3306/db1";
        String username = "root";
        String password = "012811";
        Connection conn = DriverManager.getConnection(url, username, password);
        //定义sql语句
        String sql = "update account set money = 2000 whrer id = 1";
        //获取sql的对象statement
        Statement stmt = conn.createStatement();
        //执行sql语句，返回修改行数
        int count = stmt.executeUpdate(sql);
        //释放资源
        stmt.close();
        conn.close();
    }
}

ctrl+alt+T快捷键：生成嵌套语句

通过事务方式执行sql语句：

try {
    //开启事务
    conn.setAutoCommit(false);
    //执行语句
    int count1 = stmt.executeUpdate(sql1);
    int count2 = stmt.executeUpdate(sql1);
    //提交事务
    conn.commit();
} catch (Exception e) {
    //回滚事务
    conn.rollback();
}

Statement作用：执行sql语句。

int num = stmt.executeUpdate(sql);//执行DML、DDL语句（返回修改行数）
ResultSet result = executeQue ry(sql);//执行DQL语句，（返回查询结果集）

whlie(result.next()){
    int id = result.getInt(1);//可以通过下标签获取数据（默认从1开始）
    String name = result.getString("name");//可以通过列名获取数据
}
result.close();

JavaSvript

基础语法

引入方式

<script>
    alert("你好！");//内部方式
</script>

//外部方式
<script src="./demo.js"></script>

基础语法

区分大小写
结尾有;
注释：单行注释//，多行注释/**/
大括号表示代码块
输出语句：

window.alert()//写入警告框
document.write()//写入HTML输出
 console.log()//写入浏览器控制台

变量

var num = 123;
num = "nihao";
//var关键字定义的变量相当于全局变量，并可以重复定义
{
    let num = 2; //相对于局部变量
}

count num1 = 10; //常量，定义后不可修改

数据类型

number：数字（整数，小数，NaN）
string:字符，字符串，单双引号均可以
boolean:布尔
null:空对象
 undefined:申明的变量未初始化
可以使用typeof 获取数据类型，如alert(typeof num);
运算符

== ：判断值是否相等，如20==”20″返回 true。
=== ：判断是否完全等于。
类型转换】
字符串转number，前面加个+号，不能转为数字则转为NaN；
var num = +“20”;
或者使用parseInt()，如parseInt(str)；
```
var flag=3;
if(flag){
  alert("转为ture");  
}else{
  alert("转为false");  
}
```
字符串转布尔：空字符串转为false
数字转为布尔：NaN和0转为false
null 和 undefined 转为 fa lse
流程控制语句：跟java 相同：if…else swith…case while do…while for

函数

function add(a,b){ //function关键字
    return a+b;
}

let result = add(1,2);  //调用

数组 var arr = [1,2,3]; 或者var arr = new Array(1,2,3); 长度和类型不固定。

获取长度 arr.lrngth
添加元素 arr.push(10);
删除元素 arr.splice(0,1); //从0开始删除1个元素
字符串 var str = new String(s); 或者var str = s;
可以通过length获取长度

str.trim() //删除前后两端的空格

自定义对象

var person{
    name:"张三";
    age:23;
    eat:function(){
        alert("干饭");
    }
}

person.name;
person.eat;

BOM对象

Browser Obiect Model

弹窗：

var flag = confirm("是否删除？");
if(flag){
    alert("删除成功！");
}else{
    ;
}

定时器:

setTimeout(function(){alert("等待3s")}, 3000);//等待3s后弹一次
setInterval(function(){alert("等待3s")}, 3000);//间隔3s循环弹出

location.herf

<script>
    document.write("三秒后跳转到首页...");
    setTimeout(function(){
        location.href = "https://www.baidu.com";
    }, 3000)
</script>

DOM

Document Object Model
对HTML文档进行操作

对象获取

document.getElementById;
document.getElementsByName;
document.getElementsByClassName;
document.getElementsByTagName;

.src=“” 替换路径或者网址
.style 设置CSS样式
.innerHTML:设置元素内容

可以通过 https://www.w3school.com.cn/ 查看

事件 监听

方式一：通过html标签绑定

<input type="button" onclick='on()'>

function on(){
    alert("我被点了");
}

方式二：通过DOM元素属性绑定

<input type="button" id="btn">

document.getElementByld("btn").οnclick=function(){
    alert("我被点了");
}

表单验证

<script>
    document.getElementById("register").onsubmit = function(){
        var username = document.getElementById("user").value;
        var passward = document.getElementById("pwd").value;
        if(username.length > 6){
            alert(username.length)
            alert("登陆成功！");
            return true;
        }else{
            alert("请重新输入！");
            return false;
        }
    }
</script>

HTTP

状态码:
https://cloud.tencent.com/developer/ch apter/13553

HTTP请求数据格式

HTTP响应 数据格式

Tomcat

tomcat是一个 web 服务器，支持Servlet/JSP等JavaEE规范。也可以称为 servlet 容器或者web容器。

将文件夹删除即可卸载软件。ctrl+C关闭tomcat。

使用：将java项目或前端项目放到 tomcat/webapps 文件夹下即可，为了提高复制速度，也可以打包成war文件直接复制过去（会自动解压缩），其他人即可通过浏览器访问。

端口号 ：默认8080，在conf/server.xml中修改

Maven Web项目

项目结构

IDEA自动创建

Servlet

java提供的动态web开发技术，是一个java 接口

创建web项目，导入Servlet 坐标

  <dependencies>
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>servlet-api</artifactId>
      <version>2.5</version>
      <scope>provided</scope>
    </dependency>
  </dependencies>

实现Servlet接口，重写所有方法，并在servlet中输出一句话，并在类上使用@WebServlet注解，配置访问路径

@WebServlet("/demo")
public calss ServletDemo implements Servlet{
    @Override
    public coid service(){}
}

启动 tomcat，在浏览器中输入URL访问Servlet。

常见错误

java: 错误: 不支持发行版本 6：解决Error java 错误不支持发行版本
Cannot resolve symbol ‘WebServlet： Idea报错Cannot resolve symbol ‘HttpServlet’

Servlet会被Tomcat 创建

Servlet生命周期

以后经常使用HttpServlet(封装好的类)，重写 doGet和doPost方法即可。

request

package demo1;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.BufferedReader;
import java.io.IOException;
import java.util.Map;
import java.util.Set;

@WebServlet("/demo")
public class ServletDemo1 extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        /*请求行*/
        //获取请求方式
        String method = req.getMethod();
        System.out.println(method);

        //获取虚拟目录
        String contextPath = req.getContextPath();
        System.out.println(contextPath);

        //获取URL（统一资源定位符）
        StringBuffer url = req.getRequestURL();
        System.out.println(url.toString());

        //获取URI（统一资源标识符）
        String uri = req.getRequestURI();
        System.out.println(uri);

        //获取请求参数
        String queryString = req.getQueryString();
        System.out.println(queryString);

        //--------------------------------------------
        /*请求头*/
        String agent = req.getHeader("user-agent");
        System.out.println(agent);

        //获取输入参数的键值对
        Map<String, String[]> map = req.getParameterMap();
        Set<String> keySet=map.keySet();
        for (String key:keySet) {
            System.out.print(key + ":");
            String[] values = map.get(key);
            for(String value:values){
                System.out.print(value+" ");
            }
            System.out.println();
        }

        //获取对应的参数值
        String[] username = req.getParameterValues("username");
        for(String name:username){
            System.out.println(name);
        }

    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //获取字节输入流
        BufferedReader br = req.getReader();
        //读取数据
        String line = br.readLine();
        System.out.println(line);
        
        this.doGet(req,resp);
    }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--将表单提交到/tomcat_demo_war/demo路径，Servlet会获取参数-->
<form action="/tomcat_demo_war/demo" method="get">
    <label>
        <input type="text" name="username">
    </label>
    <label>
        <input type="password" name="password">
    </label>
    <input type="submit">
</form>
</body>
</html>

解决中文乱码问题

//POST方式
req.setCharacterEncoding("UTF-8");
//GET方式
username = new String(username.getBytes(StandardCharsets.ISO_8859_1), StandardCharsets.UTF_8);

URL编码与解码

//编码
String encode = URLEncoder.encoder(str, "utf-8");
//解码
String decode = URLDecoder.decoder(encoder, "ISO-8859-1");
//字符转换为字节
byte[] bytes = getBytes("ISO-8859-1");
//将字节转换为字符串
new String(bytes, "utf-8");

请求转发(服务器内部共享资源，分工合作)，不用加虚拟目录

request.getRequestDispatcher("/path").forward(request, response);

response

重定向：自动跳转到其他资源

response 中文乱码

resp.setContentType("text/html;charset=utf-8");

//获取输出流
PrintWriter writer = resp.getWriter();
writer.write("aaa");

原文地址:https://blog.csdn.net/weixin_50232758/article/details/134682717

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。

如若转载，请注明出处：http://www.7code.cn/show_37642.html

如若内容造成侵权/违法违规/事实不符，请联系代码007邮箱：suwngjj01@126.com进行投诉反馈，一经查实，立即删除！

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。

web 表格选择器

Web学习笔记

flask库

前端基础

超链接：

空连接：

图片：

视频（音频）：

格式化表格

GET方式

POST请求

通过GET方式获取输入参数

通过POST方式获取输入参数

注册页面

CSS

三种使用方式

行内式

外联式

内嵌式

选择器

1、类选择器

2、id选择器

3、标签选择器

4、通配符选择器

5、属性选择器

6、后代选择器

CSS样式

高度与宽度

字体和颜色

MySQL基础

SQL语言

SQL分类

DDL

DML

DQL

约束

JDBC

JavaSvript

基础语法

BOM对象

DOM

HTTP

HTTP请求数据格式

HTTP响应数据格式

Tomcat

Maven Web项目

Servlet

request

相关文章

发表回复 取消回复

We b 学习笔记

发表回复取消回复