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

Web服务器（实验)

news 2026/2/9 14:29:05

目录

  • `nginx`
    • 实验1（快速建站）
    • 实验2（更换默认网页目录）
    • 实验3（内网穿透花生壳）
    • 实验4（综合nginx）
    • 实验5（基于不同IP的虚拟主机网站）
    • 实验6（基于不同端口号的虚拟主机网站）
    • 实验7（基于不同域名的虚拟主机网站）
  • `apache`
    • 实验1（快速建站）
    • 实验2（更换默认网页目录）
    • 实验3（身份验证登录网页）
    • 实验4（密码验证登录网页）

nginx

实验1（快速建站）

  • 快速建站（nginx）
[root@server ~]# yum install nginx -y[root@server ~]# echo "welcome to csdn" > /usr/share/nginx/html/index.html[root@server ~]# systemctl restart nginx[root@server ~]# curl 192.168.160.137
welcome to csdn

也可在浏览器中输入本机ip查看
在这里插入图片描述

实验2（更换默认网页目录）

  • 更换默认网页目录(nginx)
  • 第一步：准备工作
[root@server ~]# setenforce  0[root@server ~]# systemctl stop firewalld[root@server ~]# yum  install nginx  -y[root@server ~]# systemctl start nginx
  • 第二步：新建网页存储目录/web，使用xftp将网页数据上传到/web内
[root@server ~]# mkdir /web
[root@server ~]# cd /web[root@server web]# ls 
css  img  index.html  js
  • 第三步：修改主配置文件
[root@server ~]# vim /etc/nginx/nginx.confroot         /web;   # 找到第42行修改
  • 第四步：重启服务器并测试
[root@server ~]# systemctl restart nginx
#windows端打开浏览器输入服务器的地址进行测试

实验3（内网穿透花生壳）

  • 搭建网站，使用花生壳进行内网穿透，实现公网访问
  • 第一步：准备工作
[root@server ~]# setenforce 0[root@server ~]# systemctl stop firewalld[root@server ~]# yum install httpd -y[root@server ~]# systemctl start httpd[root@server ~]# systemctl enable httpd
  • 第二步：搭建网站，将网页数据/index上传后，编辑主配置文件
[root@server web1]# vim /etc/httpd/conf/httpd.conf
DocumentRoot "/web" 
<Directory "/web"> AllowOverride None# Allow open access:Require all granted
</Directory>
  • 第三步：重启服务器并测试,在浏览器中输入ip地址测试
[root@server ~]# systemctl restart nginx
  • 第四步：使用贝锐花生壳https://hsk.oray.com/进行内网穿透
  • 4.1注册，登录，完成身份证的实名认证
    在这里插入图片描述
    在这里插入图片描述
  • 4.2注册个人账号
    在这里插入图片描述
  • 4.3使用微信扫码快速注册
  • 4.4进行个人认证（需要使用个人身份证进行认证
  • 4.5点击管理平台
    在这里插入图片描述
  • 4.6创建内网映射
    在这里插入图片描述
    在这里插入图片描述
  • 4.7下载Linux客户端
    在这里插入图片描述
    在这里插入图片描述
  • 4.8下载客户端，选择应用平台为RedHat ，“点击复制”
    在这里插入图片描述
  • 4.9Linux客户端下载并安装
[root@server ~]# wget "https://dl.oray.com/hsk/linux/phddns_5.3.0_amd64.rpm" -O phddns_5.3.0_amd64.rpm      [root@server ~]# ls
anaconda-ks.cfg  phddns_5.3.0_amd64.rpm[root@server ~]# rpm -ivh phddns_5.3.0_amd64.rpm
  • 安装完之后出现的信息
    在这里插入图片描述
  • 启动
[root@server ~]# phddns start
phtunnel service start success !
  • 复制下图“右下角的网址”，重新打开浏览器，输入http://b.oray.com，完成账号登录，激活
    在这里插入图片描述
  • 第五步：重新登录，使用SN登录
    在这里插入图片描述
# 查看SN号
[root@server ~]# phddns status+--------------------------------------------------+|          Oray PeanutHull Linux 5.3.0             |+--------------------------------------------------+|              Runstatus: ONLINE                   |+--------------------------------------------------+|              SN: oray1358b95b40a9                |+--------------------------------------------------+|    Remote Management Address http://b.oray.com   |+--------------------------------------------------+

在这里插入图片描述

  • 激活(手机扫码或贝锐账号)
    在这里插入图片描述
  • 第六步：访问网站
    http://9266gd775bt0.vicp.fun(创建内网映射时生成的网址)进行测试
    在这里插入图片描述

实验4（综合nginx）

  • 包含了以上两种功能

  • 综合练习：请给openlab搭建web网站，网站需求：

  • 1.基于域名www.openlab.com可以访问网站内容为welcome to openlab!!!

  • 2.给该公司创建三个子界面分别显示学生信息，教学资料和缴费网站，基于www.openlab.com/student网站访问学生信息，www.openlab.com/data网站访问教学资料，www.openlab.com/money网站访问缴费网站

  • 3.要求

    • 学生信息网站只有song和tian两人可以访问，其他用户不能访问。
    • 访问缴费网站实现数据加密基于https访问。

  • 第一步，准备工作

# 恢复快照，关闭安全软件[root@server ~]# yum install nginx -y[root@server ~]# yum install  httpd-tools -y
# windows的C\:windows\system32\drivers\etc\hosts 文件进行DNS映射
192.168.48.130 www.openlab.com # 添加
  • 第二步，创建www.openlab.com网站
[root@server ~]# mkdir -p /www/openlab[root@server ~]# echo 'welcom to csdn'  >  /www/openlab/index.html[root@server ~]# vim /etc/nginx/nginx.conf
server {listen       80;server_name  www.openlab.com;root         /www/openlab;
}[root@server ~]# systemctl restart nginx
# window端打开浏览器输入www.openlab.com测试

在这里插入图片描述

  • 第三步：创建教学资料子网站www.openlab.com/data
[root@server ~]# mkdir /www/openlab/data[root@server ~]# echo 'data' > /www/openlab/data/index.html[root@server ~]# vim /etc/nginx/nginx.confserver {listen       80;server_name  www.openlab.com;root         /www/openlab;# 添加以下配置location /data {alias /www/openlab/data;index index.html index.htm;}
}
[root@server ~]# systemctl restart nginx
# window端打开浏览器输入www.openlab.com/data测试

在这里插入图片描述

  • 第四步: 创建学生信息子网站www.openlab.com/student
[root@server ~]# mkdir /www/openlab/student   [root@server ~]# echo 'student' > /www/openlab/student/index.html[root@server ~]# useradd song  [root@server ~]# passwd song    # 密码123456[root@server ~]# useradd tian[root@server ~]# passwd tian    # 密码654321[root@server ~]# htpasswd -c /etc/nginx/passwd song      # 输入密码123456[root@server ~]# htpasswd  /etc/nginx/passwd tian     # 输入密码654321[root@server ~]# vim /etc/nginx/nginx.confserver {listen       80;server_name  www.openlab.com;root         /www/openlab;location /data {alias /www/openlab/data;index index.html index.htm;}# 添加以下配置location /student {alias /www/openlab/student;index index.html index.htm;auth_basic "Please input password";auth_basic_user_file /etc/nginx/passwd;}}
[root@server ~]# systemctl restart nginx

在这里插入图片描述
在这里插入图片描述

  • 第五步：创建缴费子网站www.openlab.com/money
[root@server ~]# mkdir /www/openlab/money[root@server ~]# echo 'money' > /www/openlab/money/index.html[root@server ~]# openssl genrsa -aes128 2048 > /etc/nginx/money.key
Generating RSA private key, 2048 bit long modulus (2 primes)
...............................................................+++++
........+++++
e is 65537 (0x010001)
Enter pass phrase:       # 输入加密私钥的密码123456
Verifying - Enter pass phrase:     # 再次输入[root@server ~]# openssl req -utf8 -new -key /etc/nginx/money.key -x509 -days 365 -out /etc/nginx/money.crt    # 制作证书
Enter pass phrase for /etc/nginx/money.key:
You are about to be asked to enter information that will be incorporated
into your certificate request.
What you are about to enter is what is called a Distinguished Name or a DN.
There are quite a few fields but you can leave some blank
For some fields there will be a default value,
If you enter '.', the field will be left blank.
-----         #  证书信息
Country Name (2 letter code) [AU]:86
State or Province Name (full name) [Some-State]:shanxi
Locality Name (eg, city) []:xi'an
Organization Name (eg, company) [Internet Widgits Pty Ltd]:openlab
Organizational Unit Name (eg, section) []:RHCE
Common Name (e.g. server FQDN or YOUR name) []:server
Email Address []:andy@qq.com[root@server ~]# cd /etc/nginx[root@server nginx]# cp money.key money.key.org[root@server nginx]# openssl rsa -in money.key.org -out money.key
Enter pass phrase for money.key.org:        # 输入密码123456
writing RSA key[root@server nginx]# vim  /etc/nginx/nginx.conf
# 在上一个server服务下面重新写一个serverserver {listen 443 ssl http2;server_name www.openlab.com;location /money {alias /www/openlab/money;index index.html index.htm;}ssl_certificate    "/etc/nginx/money.crt";ssl_certificate_key  "/etc/nginx/money.key";}[root@server nginx]# systemctl restart nginx# windows端打开浏览器输入https://www.openlab.com/money测试

在这里插入图片描述

实验5（基于不同IP的虚拟主机网站）

  • 第一步：准备工作
[root@server ~]# setenforce  0[root@server ~]# systemctl stop firewalld[root@server ~]# yum  install nginx  -y[root@server ~]# systemctl start nginx
  • 第二步 查看并添加IP地址
[root@server ~]# ip a
1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNKNOWN group defaul                                                                        t qlen 1000link/loopback 00:00:00:00:00:00 brd 00:00:00:00:00:00inet 127.0.0.1/8 scope host lovalid_lft forever preferred_lft foreverinet6 ::1/128 scope hostvalid_lft forever preferred_lft forever
2: ens32: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc fq_codel state UP gro                                                                        up default qlen 1000link/ether 00:0c:29:ac:68:d3 brd ff:ff:ff:ff:ff:ffinet 192.168.160.137/24 brd 192.168.160.255 scope global noprefixroute ens32valid_lft forever preferred_lft foreverinet6 fe80::20c:29ff:feac:68d3/64 scope link noprefixroutevalid_lft forever preferred_lft forever
[root@server ~]# nmcli c modify ens32 +ipv4.address 192.168.160.200/24
[root@server ~]# nmcli c modify ens32 +ipv4.address 192.168.160.201/24
[root@server ~]# ip a
1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNKNOWN group default qlen 1000link/loopback 00:00:00:00:00:00 brd 00:00:00:00:00:00inet 127.0.0.1/8 scope host lovalid_lft forever preferred_lft foreverinet6 ::1/128 scope hostvalid_lft forever preferred_lft forever
2: ens32: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc fq_codel state UP group default qlen 1000link/ether 00:0c:29:ac:68:d3 brd ff:ff:ff:ff:ff:ffinet 192.168.160.137/24 brd 192.168.160.255 scope global noprefixroute ens32valid_lft forever preferred_lft foreverinet 192.168.160.200/24 brd 192.168.160.255 scope global secondary noprefixroute ens32valid_lft forever preferred_lft foreverinet 192.168.160.201/24 brd 192.168.160.255 scope global secondary noprefixroute ens32valid_lft forever preferred_lft foreverinet6 fe80::20c:29ff:feac:68d3/64 scope link noprefixroutevalid_lft forever preferred_lft forever
  • 第三步：创建两个IP的启动主页面
[root@server ~]# mkdir -p /www/ip200
[root@server ~]# mkdir -p /www/ip201
[root@server ~]# echo '200' > /www/ip200/index.html
[root@server ~]# echo '201' > /www/ip201/index.html
  • 第四步 更改主配置文件
[root@server ~]# vim /etc/nginx/nginx.confserver {listen       80;listen       [::]:80;server_name  _;root         /usr/share/nginx/html;# Load configuration files for the default server block.include /etc/nginx/default.d/*.conf;error_page 404 /404.html;location = /40x.html {}error_page 500 502 503 504 /50x.html;location = /50x.html {}}server {listen 80;server_name 192.168.160.200;root /www/ip200;}server {listen 80;server_name 192.168.160.201;root /www/ip201;}
  • 第四步：重启nginx,打开window输入192.168.160.200测试
[root@server ~]# systemctl restart nginx# 在虚拟机上测试
[root@server ~]# curl 192.168.160.200 
200
[root@server ~]# curl 192.168.160.201
201

实验6（基于不同端口号的虚拟主机网站）

  • 第一步：准备工作
[root@server ~]# setenforce  0[root@server ~]# systemctl stop firewalld[root@server ~]# yum  install nginx  -y[root@server ~]# systemctl start nginx
  • 第二步：创建两个不同端口网页
[root@server ~]# mkdir -p /www/port5111
[root@server ~]# mkdir -p /www/port5222
[root@server ~]# echo "5111" > /www/port5111/index.html
[root@server ~]# echo "5222" > /www/port5222/index.html
  • 第三步：配置主配置文件
[root@server ~]# vim /etc/nginx/nginx.confserver {listen       80;listen       [::]:80;server_name  _;root         /usr/share/nginx/html;# Load configuration files for the default server block.include /etc/nginx/default.d/*.conf;error_page 404 /404.html;location = /40x.html {}error_page 500 502 503 504 /50x.html;location = /50x.html {}}server{listen 5111;server_name 192.168.160.137;root  /www/port5111;}server{listen 5222;server_name 192.168.160.137;root  /www/port5222;}
  • 第四步：重启测试
# 或在window端输入192.168.160.137:5111测试
[root@server ~]# curl  192.168.160.137:5111
5111
[root@server ~]# curl  192.168.160.137:5222
5222

实验7（基于不同域名的虚拟主机网站）

  • 第一步：准备工作
[root@server ~]# setenforce  0[root@server ~]# systemctl stop firewalld[root@server ~]# yum  install nginx  -y[root@server ~]# systemctl start nginx
  • 第二步：创建两个域名网页
[root@server ~]# mkdir -p /www/guan
[root@server ~]# mkdir -p /www/test
[root@server ~]# echo "guan" > /www/guan/index.html
[root@server ~]# echo "test" > /www/test/index.html
  • 第三步：修改配置文件
[root@server ~]# vim /etc/hosts  # 在下面添加
192.168.160.137 www.guan.com
192.168.160.137 www.test.com[root@server ~]# vim /etc/nginx/nginx.confserver {listen       80;listen       [::]:80;server_name  _;root         /usr/share/nginx/html;# Load configuration files for the default server block.include /etc/nginx/default.d/*.conf;error_page 404 /404.html;location = /40x.html {}error_page 500 502 503 504 /50x.html;location = /50x.html {}}server {listen 80;server_name www.test.com;root /www/test;}server {listen 80;server_name www.guan.com;root /www/guan;}
  • 第四步：重启测试
[root@server ~]# systemctl restart nginx
# 或在window端输入www.guan.com测试
[root@server ~]# curl www.guan.com
guan
[root@server ~]# curl www.test.com
test

apache

实验1（快速建站）

  • 快速建站（apache）
[root@server ~]# yum install httpd -y[root@server ~]# echo "welcome to csdn" > /var/www/html/index.html[root@server ~]# ls /var/www/html
index.html[root@server ~]# systemctl restart httpd[root@server ~]# curl 192.168.160.137
welcome to csdn

实验2（更换默认网页目录）

  • 更换默认网页目录(apache)
  • 第一步：准备工作
[root@server ~]# setenforce 0[root@server ~]# systemctl stop firewalld[root@server ~]# yum install httpd -y[root@server ~]# systemctl start httpd[root@server ~]# systemctl enable httpd[root@server ~]# yum remove nginx -y   # 用于删除nginx
  • 第二步：新建网页存储目录/web，使用xftp将网页数据上传到/web内
[root@server ~]# mkdir /web
[root@server ~]# cd /web[root@server ~]# ls /web
css  img  index.html  js
  • 第三步：修改主配置文件
[root@server web1]# vim /etc/httpd/conf/httpd.conf
# 第121行修改为真实的网页存储目录
DocumentRoot "/web" 
# 第126行修改网页存储目录的访问权限
<Directory "/web"> AllowOverride None# Allow open access:Require all granted
</Directory>
  • 第四步：重启服务器并测试
[root@server ~]# systemctl restart httpd
# windows端打开浏览器输入服务器的地址进行测试

实验3（身份验证登录网页）

  • 搭建一个个人用户主页功能网站，实现通过身份验证功能来访问数据
  • 如果想在系统中为每一位用户建立一个独立的网站，通常使用基于虚拟主机的功能来创建部署多个网站，但这个工作会让管理者苦不堪言，尤其是用户数据量很大的情况时，而且用户自行管理网站时，还会碰到权限限制，需要为此做很多额外的工作，其实，httpd服务程序提供的个人主页功能可以完全胜任此工作，该功能可以让系统内所有用户在自己的家目录中管理个人网站，且访问也非常容易
  • 第一步：准备工作
# 恢复快照[root@server ~]# setenforce  0[root@server ~]# systemctl stop firewalld[root@server ~]# yum  install httpd  -y[root@server ~]# systemctl start httpd[root@server ~]# systemctl enable httpd
  • 第二步：编辑httpd目录中的用户主页配置文件（不是httpd.conf）
[root@server ~]# vim /etc/httpd/conf.d/userdir.conf
#UserDir disabled  # 插入#，注释掉，表示开启用户主页功能
UserDir public_html   # 去掉#，启动网站存储数据的默认目录，路径：/home/账户名/public_html
  • 第三步：新建账户，设置权限
[root@server ~]# useradd andy
[root@server ~]# passwd andy  # 密码123456[root@server ~]# useradd jenny
[root@server ~]# passwd jenny  # 密码65421
[root@server ~]# id andy
用户id=1004(andy) 组id=1004(andy) 组=1004(andy)
[root@server ~]# id jenny
用户id=1003(jenny) 组id=1003(jenny) 组=1003(jenny)

[root@server ~]# mkdir /home/andy/public_html
[root@server ~]# cd /home/andy/public_html
[root@server public_html]# ls
test[root@server public_html]# cd
[root@server ~]# mkdir /home/jenny/public_html
[root@server ~]# cd  /home/jenny/public_html
[root@server public_html]# ls
test
[root@server ~]$ chmod  -Rf  755  /home/jenny
[root@server ~]$ chmod  -Rf  755  /home/andy
  • 第四步：重启服务并测试
[root@server andy]# systemctl restart httpd
# 在window浏览器中输入：
# 192.168.160.137/~jenny
# 192.168.160.137/~andy

下面的这个图是错误的，在/home/*/public_html 下传输文件时，不要再有文件，应直接是index.html文件
在这里插入图片描述

  • 第五步：增加密码访问控制
[root@server ~]# htpasswd -c /etc/httpd/passwd andy
New password:
Re-type new password:
Adding password for user andy# 分析：# htpasswd：生成密码数据的命令# -c：表示第一次生成会创建存储密码加密密文的存储文本，第二次创建时就不能增加-c选项，否则存储密码密文文件内容会被覆盖# andy：需要验证密码登录的账户[root@server ~]# cat /etc/httpd/passwd
andy:$apr1$PZxZc7OD$vWsqZOqxpbXBgsZxvQs7i0
[root@server ~]# htpasswd  /etc/httpd/passwd jenny
New password:
Re-type new password:
Adding password for user jenny[root@server ~]# cat /etc/httpd/passwd
andy:$apr1$PZxZc7OD$vWsqZOqxpbXBgsZxvQs7i0
jenny:$apr1$fW2KOC6b$BvukKHN9CPaMuG7SmHFli/
  • 第六步：编辑个人主页配置文件，设置访问控制策略
[root@server ~]# vim  /etc/httpd/conf.d/userdir.conf
<Directory "/home/andy/public_html">  # 设置andy账户目录的区域配置authuserfile  "/etc/httpd/passwd"  # 设置验证密码的存储文件位置authname    "My  privately"   # 登录时的提示信息，可能不显示authtype    basic     # 加密模式require  user  andy    # 需要验证密码的账户名
</directory><Directory "/home/jenny/public_html">authuserfile "/etc/httpd/passwd"authname    "My privately"authtype        basicrequire user  jenny
</Directory>
  • 第七步：重启服务并测试
[root@server andy]# systemctl restart httpd
# 在window浏览器中输入：
# 192.168.160.137/~jenny
# 192.168.160.137/~andy

在这里插入图片描述
在这里插入图片描述

实验4（密码验证登录网页）

  • 通过主配置文件实现密码验证访问网站
  • 第一步：准备工作
# 恢复快照
[root@server ~]# setenforce  0[root@server ~]# systemctl stop firewalld[root@server ~]# yum  install httpd  -y[root@server ~]# systemctl start httpd[root@server ~]# systemctl enable httpd
  • 第二步：新建账户设置密码
[root@server ~]# useradd t1
[root@server ~]# passwd t1  # 密码123456
更改用户 t1 的密码 。
新的密码：
无效的密码： 密码少于 8 个字符
重新输入新的密码：
passwd：所有的身份验证令牌已经成功更新。[root@server ~]# useradd t2
[root@server ~]# passwd t2 # 密码654321
更改用户 t2 的密码 。
新的密码：
无效的密码： 密码少于 8 个字符
重新输入新的密码：
passwd：所有的身份验证令牌已经成功更新。
  • 第三步：搭建网站，设置密码访问控制
[root@server ~]# mkdir -p /www/test[root@server ~]# htpasswd -c /etc/httpd/passwdtest   t1     # 密码123456
New password:
Re-type new password:
Adding password for user t1[root@server ~]# htpasswd  /etc/httpd/passwdtest   t2    # 密码654321
New password:
Re-type new password:
Adding password for user t2[root@server ~]# vim /etc/httpd/conf/httpd.conf
121 DocumentRoot "/www/test"126 <Directory "/www/test">133 <Directory "/www/test">
134         authuserfile "/etc/httpd/passwdtest"
135         authname   "My privately"
136         authtype    "basic"
137         require user t1 t2
163  </Directory>
  • 第四步：重启服务，测试
[root@server ~]# systemctl restart httpd
# 浏览器中输入ip地址后输入账户及密码即可登录

相关文章：

Web服务器（实验)

目录 nginx实验1&#xff08;快速建站&#xff09;实验2&#xff08;更换默认网页目录&#xff09;实验3&#xff08;内网穿透花生壳&#xff09;实验4&#xff08;综合nginx&#xff09;实验5&#xff08;基于不同IP的虚拟主机网站&#xff09;实验6&#xff08;基于不同端口号…...

编程日记 2024/11/5 6:57:08

【湖南-常德】《市级信息化建设项目初步设计方案编制规范和支出预算编制标准（试行）》-省市费用标准解读系列05

《市级信息化建设项目初步设计方案编制规范和支出预算编制标准&#xff08;试行&#xff09;》&#xff08;常行审 〔2023〕7号&#xff09;标准是湖南省常德市行政审批服务局、常德市财政局2023年12月29日发布的费用标准&#xff08;了解更多可直接关注我们咨询&#xff09;。…...

编程日记 2024/11/5 6:56:07

微信小程序 https://pcapi-xiaotuxian-front-devtest.itheima.net 不在以下 request 合法域名

微信小程序在调用接口的时候出现以上报错&#xff0c;接口没有问题&#xff0c;是因为小程序自动校验了合法域名 打开本地设置&#xff1a; 勾选不校验合法域名&#xff0c;即可 效果如下&#xff1a;...

编程日记 2024/11/5 6:55:05

vue什么时候渲染旧的VDOM，什么时候渲染新的VDOM

在 Vue 中&#xff0c;决定渲染旧的 VDOM 还是新的 VDOM 的关键在于组件的数据变化和 Vue 的响应式系统。一些常见的情况可以帮助理解这个过程&#xff1a; 1. 渲染新 VDOM 的情况 数据变化&#xff1a;当组件的响应式数据&#xff08;如 data、props 或计算属性&#xff09;发…...

编程日记 2024/11/5 6:54:04

【Qwen2技术报告分析】从模型架构 数据构建和模型评估出发

目录 前言 一、Tokenizer 二、模型结构 dense模型 MoE模型 模型参数设置 三、Pre-Training Pre-Training DATA LONG-CONTEXT TRAINING 四、Post-Training Post-Training DATA 人工数据注释&#xff08;collaborative data annotation&#xff09; 自动数据合成&a…...

编程日记 2024/11/5 6:51:52

Naive UI 选择器 Select 的:render-option怎么使用（Vue3 + TS）（鼠标悬停该条数据的时候展示全部内容）

项目场景&#xff1a; 在渲染select选择器后&#xff0c;当文字过长的时候&#xff0c;多出来的部分会显示成省略号&#xff0c;这使我们不能很清晰的看到该条数据的完整信息&#xff0c;就需要加一个鼠标悬停展示完整内容。 解决方案&#xff1a; vue代码&#xff1a; <n…...

编程日记 2024/11/5 6:49:48

使用Mac如何才能提高OCR与翻译的效率

OCR与截图大家都不陌生&#xff0c;或许有的朋友对于这两项功能用到的不多&#xff0c;但是如果经常会用到的话&#xff0c;那你就该看看了 iOCR&#xff0c;快捷键唤出翻译窗口&#xff0c;不论是截图翻译、划词翻译、输入翻译、剪切板翻译&#xff0c;统统快捷键完成&#x…...

编程日记 2024/11/5 6:48:45

QML----复制指定下标的ListModel数据

我现在有一个写好的listmodel,我需要从里边抽取35个数据作为展示 头文件 #ifndef GETONEPAGESIZEMEMBERLISTMODEL_H #define GETONEPAGESIZEMEMBERLISTMODEL_H#include <QObject> #include <QAbstractListModel> #include <QDebug> #include "mylistm…...

编程日记 2024/11/5 6:45:41

CSS Text(文本)

CSS Text(文本) CSS Text 是一种用于控制网页中文本显示样式的技术。通过使用 CSS Text 属性，开发者可以轻松地调整文本的字体、大小、颜色、对齐方式等，从而实现更加美观和个性化的网页设计。本文将详细介绍 CSS Text 的各种属性及其应用方法。 一、字体属性 1. font-fam…...

编程日记 2024/11/5 6:44:38

聊一聊Spring中的@Transactional注解【下】【注解失效场景】

前言 尽管 Transactional 注解在 Spring 中提供了方便的事务管理功能&#xff0c;我们在使用过程中却常常面临其失效的问题。事务失效可能导致意想不到的数据状态和错误&#xff0c;影响应用的稳定性和可靠性。本文将探讨一些常见的 Transactional 失效场景&#xff0c;包括异常…...

编程日记 2024/11/5 6:43:38

对称加密与非堆成加密

http通信有一些什么问题 窃听 - 对称加密传递密钥 - 非对称加密安全速度 - 非对称加密 对称加密中间人攻击 - 证书证书伪造 - 消息摘要摘要伪造 - 数字签名 可能被窃听 http本身不具备加密功能&#xff0c;http报文使用明文方式发送 还可能存在验证问题 无法确认发送到的…...

编程日记 2024/11/5 6:42:37

江协科技STM32学习- P28 USART串口数据包

&#x1f680;write in front&#x1f680; &#x1f50e;大家好&#xff0c;我是黄桃罐头&#xff0c;希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流 &#x1f381;欢迎各位→点赞&#x1f44d; 收藏⭐️ 留言&#x1f4dd;​…...

编程日记 2024/11/5 6:40:30

Linux脚本循环(for、while、until)

文章目录 for基础风格for列表风格for与seq组合for与大括号for循环处理脚本参数组合命令while基础while数字累加utilcontinue for基础风格 这种风格最像高级程序中的for循环 #!/bin/bashfor(( i0; i<10; i )) doecho "第$i次for循环" donefor列表风格 #!/bin/ba…...

编程日记 2024/11/5 6:39:25

文件系统上云的挑战

优质博文&#xff1a;IT-BLOG-CN 一、挑战/注意事项 【1】因文件系统HDFS没有关联信息OrderId等&#xff0c;不能对存量数据进行有策略的同步&#xff0c;因此目前是将所有的文件同步至云服务器SIN&#xff1b; 【2】海外数据和国内数据上传到各自的文件服务器后&#xff0c;…...

编程日记 2024/11/5 6:34:20

【北京迅为】《STM32MP157开发板嵌入式开发指南》-第七十一章 制作Ubuntu文件系统

iTOP-STM32MP157开发板采用ST推出的双核cortex-A7单核cortex-M4异构处理器&#xff0c;既可用Linux、又可以用于STM32单片机开发。开发板采用核心板底板结构&#xff0c;主频650M、1G内存、8G存储&#xff0c;核心板采用工业级板对板连接器&#xff0c;高可靠&#xff0c;牢固耐…...

编程日记 2024/11/5 6:32:16

中间件漏洞总结

参考&#xff1a;Tomcat漏洞详解-CSDN博客 tomcat 历史漏洞 阿里云漏洞库 (aliyun.com) 弱口令和war远程部署漏洞 弱口令 Tomcat8.* 登录页面&#xff1a;/manager/html 弱口令&#xff1a;tomcat/tomcat 后台Getshell 登录到后台后可以通过部署 war 包进行 getshell wa…...

编程日记 2024/11/5 6:30:15

PySpark Yarn集群模式

目录 简介 一、PySpark简介 二、YARN模式概述 三、配置环境 1. 安装与配置Spark 2. 配置Hadoop和YARN 3. 启动yarn 四、编写PySpark脚本 五、提交PySpark作业到YARN 参数解释&#xff1a; 六、常见问题及解决 七、总结 简介 随着大数据的普及&#xff0c;Spark作为…...

编程日记 2024/11/5 6:29:14

Matlab基于经纬度点并行提取指定日期的tiff栅格位置的值

文章目录 前言一、基本说明二、代码 前言 该 MATLAB 代码用于从 GeoTIFF 文件中提取基于特定地理位置&#xff08;经纬度&#xff09;和日期的某个点的相关数据。代码首先读取一个包含事件数据&#xff08;日期、经纬度&#xff09;的 Excel 文件&#xff0c;然后根据日期和位…...

编程日记 2024/11/5 6:26:11

npm入门教程19：npm包管理

一、代码更新 遵循语义化版本控制&#xff1a; 在更新包时&#xff0c;应遵循语义化版本控制&#xff08;Semantic Versioning&#xff0c;简称SemVer&#xff09;规范。这意味着版本号的变更应反映代码变更的程度&#xff0c;通常遵循主版本号.次版本号.修订号的格式。主版本号…...

编程日记 2024/11/5 6:25:08

【NOIP提高组】虫食算

【NOIP提高组】虫食算 C语言C &#x1f490;The Begin&#x1f490;点点关注&#xff0c;收藏不迷路&#x1f490; 所谓虫食算&#xff0c;就是原先的算式中有一部分被虫子啃掉了&#xff0c;需要我们根据剩下的数字来判定被啃掉的字母。来看一个简单的例子&#xff1a; 43#98…...

编程日记 2024/11/5 6:24:06

C++实现分布式网络通信框架RPC(3)--rpc调用端

目录 一、前言 二、UserServiceRpc_Stub 三、 CallMethod方法的重写 头文件 实现 四、rpc调用端的调用 实现 五、 google::protobuf::RpcController *controller 头文件 实现 六、总结 一、前言 在前边的文章中&#xff0c;我们已经大致实现了rpc服务端的各项功能代…...

编程新知 2026/2/8 20:42:58

java 实现excel文件转pdf | 无水印 | 无限制

文章目录 目录 文章目录 前言 1.项目远程仓库配置 2.pom文件引入相关依赖 3.代码破解 二、Excel转PDF 1.代码实现 2.Aspose.License.xml 授权文件 总结 前言 java处理excel转pdf一直没找到什么好用的免费jar包工具，自己手写的难度，恐怕高级程序员花费一年的事件，也…...

编程新知 2025/11/5 4:10:42

对WWDC 2025 Keynote 内容的预测

借助我们以往对苹果公司发展路径的深入研究经验&#xff0c;以及大语言模型的分析能力&#xff0c;我们系统梳理了多年来苹果 WWDC 主题演讲的规律。在 WWDC 2025 即将揭幕之际&#xff0c;我们让 ChatGPT 对今年的 Keynote 内容进行了一个初步预测&#xff0c;聊作存档。等到明…...

编程新知 2026/2/6 23:56:39

AI，如何重构理解、匹配与决策？

AI 时代&#xff0c;我们如何理解消费&#xff1f; 作者&#xff5c;王彬 封面&#xff5c;Unplash 人们通过信息理解世界。 曾几何时&#xff0c;PC 与移动互联网重塑了人们的购物路径&#xff1a;信息变得唾手可得&#xff0c;商品决策变得高度依赖内容。 但 AI 时代的来…...

编程新知 2026/1/30 2:33:11

技术栈RabbitMq的介绍和使用

目录 1. 什么是消息队列&#xff1f;2. 消息队列的优点3. RabbitMQ 消息队列概述4. RabbitMQ 安装5. Exchange 四种类型5.1 direct 精准匹配5.2 fanout 广播5.3 topic 正则匹配 6. RabbitMQ 队列模式6.1 简单队列模式6.2 工作队列模式6.3 发布/订阅模式6.4 路由模式6.5 主题模式…...

编程新知 2026/1/23 10:10:53

安卓基础（Java 和 Gradle 版本）

1. 设置项目的 JDK 版本 方法1&#xff1a;通过 Project Structure File → Project Structure... (或按 CtrlAltShiftS) 左侧选择 SDK Location 在 Gradle Settings 部分&#xff0c;设置 Gradle JDK 方法2&#xff1a;通过 Settings File → Settings... (或 CtrlAltS)…...

编程新知 2025/7/10 0:32:50

MySQL 主从同步异常处理

阅读原文&#xff1a;https://www.xiaozaoshu.top/articles/mysql-m-s-update-pk MySQL 做双主&#xff0c;遇到的这个错误&#xff1a; Could not execute Update_rows event on table ... Error_code: 1032是 MySQL 主从复制时的经典错误之一&#xff0c;通常表示&#xff…...

编程新知 2025/11/7 10:02:17

Cilium动手实验室: 精通之旅---13.Cilium LoadBalancer IPAM and L2 Service Announcement

Cilium动手实验室: 精通之旅---13.Cilium LoadBalancer IPAM and L2 Service Announcement 1. LAB环境2. L2公告策略2.1 部署Death Star2.2 访问服务2.3 部署L2公告策略2.4 服务宣告 3. 可视化 ARP 流量3.1 部署新服务3.2 准备可视化3.3 再次请求 4. 自动IPAM4.1 IPAM Pool4.2 …...

编程新知 2026/2/5 17:29:21

FFmpeg avformat_open_input函数分析

函数内部的总体流程如下&#xff1a; avformat_open_input 精简后的代码如下&#xff1a; int avformat_open_input(AVFormatContext **ps, const char *filename,ff_const59 AVInputFormat *fmt, AVDictionary **options) {AVFormatContext *s *ps;int i, ret 0;AVDictio…...

编程新知 2026/2/6 5:56:22

软件工程 期末复习

瀑布模型&#xff1a;计划 螺旋模型&#xff1a;风险低 原型模型: 用户反馈 喷泉模型:代码复用 高内聚 低耦合&#xff1a;模块内部功能紧密 模块之间依赖程度小 高内聚&#xff1a;指的是一个模块内部的功能应该紧密相关。换句话说&#xff0c;一个模块应当只实现单一的功能…...

编程新知 2026/2/7 0:13:47