基于域名的虚拟主机、多虚拟主机的配置、基于ip的虚拟主机及上线静态的前端系统(商城系统)

news2024/12/23 18:40:15

Day 14

基于域名的虚拟主机

说明:

一个配置文件一般只有一个http模块;

一个http模块可以有多个server模块;

一个server模块就是一套web项目;

一个server模块中可以有多个location;

location就是项目中的url路由

# 修改配置文件,设置为默认的首页文件

[root@static-server ~]# vim /usr/local/nginx/conf/nginx.conf

server {

        listen       80;

        server_name  localhost;

        root html;

location / {

            index  index.html;

        }

# 创建目录,用于部署在nginx中发布到网络

[root@static-server ~]# mkdir /hua

# 在/hua目录下创建一个index.html

[root@static-server ~]# echo "hello, i am huajuan" > /hua/index.html

[root@static-server ~]# cat /hua/index.html

hello, i am huajuan

# 修改配置文件,增加一个server

http{

keepalive_timeout  65;  # 在此行下面添加

       server{

                listen  80;

                server_name www.huajuan.com;

                root    /hua;

                location / {

                        index index.html;

                }

        }

server{...}

}

# 重载nginx服务

[root@static-server ~]# /usr/local/nginx/sbin/nginx -s reload

# 设置hosts劫持

[root@static-server ~]# vim /etc/hosts

192.168.2.22 www.huajuan.com

[root@static-server ~]# curl www.huajuan.com

hello, i am huajuan

[root@static-server ~]# ls /etc/hosts

/etc/hosts

总结

1)使用ip访问,返回的是下面的/usr/local/nginx/html/index.html下的内容;

[root@static-server ~]# cat /usr/local/nginx/html/index.html

i am static-server

即以下server里的内容:

server {

        listen       80;

        server_name  localhost;

        root html;

        location / {

            index  index.html;

        }

}

2)使用域名,返回的是/hua/index.html的内容

[root@static-server ~]# cat /hua/index.html

hello, i am huajuan

即以下server里的内容:

server{

listen 80;

server_name www.huajuan.com;

root /hua;

location / {

index index.html;

}

}

3)windows下也有此文件(路径为:C:\Windows\System32\drivers\etc),但是要注意要设置读写权限,取消只读,设置权限,如果还不行,就直接创建新的host文件覆盖掉。并且此设置只能本机有效,若想要别人也能访问到,需配置DNS服务器。

步骤:在此目录下找到hosts文件,发现只读,编辑不了。将其复制一份到E盘进行编辑,编辑成功后,将其复制到C盘进行全覆盖即可;在host文件中新增一行, 192.168.2.23 www.huajuan.com

多虚拟主机的配置

背景:一个服务器上同时部署多个项目,为了方便维护,可以将server模块单独抽离出来创建conf文件,然后在主配置文件中使用include添加外部配置,这样让操作更加模块化。

# 在nginx目录下创建新的目录conf.d

[root@static-server ~]# mkdir /usr/local/nginx/conf.d

[root@static-server ~]# touch /usr/local/nginx/conf.d/hua.conf

[root@static-server ~]# sed -n '33,40p' /usr/local/nginx/conf/nginx.conf  # 先进行搜索

       server{

listen 80;

server_name www.huajuan.com;

root /hua;

location / {

index index.html;

}

}

# 将刚才配置的server模块保存到一个新的文件中

[root@static-server ~]# sed -n '33,40p' /usr/local/nginx/conf/nginx.conf > /usr/local/nginx/conf.d/hua.conf

[root@static-server ~]# cat /usr/local/nginx/conf.d/hua.conf

# 删除nginx.conf中原有的自定义server模块

[root@static-server ~]# se -i '33,40d' /usr/local/nginx/conf/nginx.conf  # -i选项:文件发生改变

[root@static-server ~]# cat /usr/local/nginx/conf/nginx.conf

[root@static-server ~]# /usr/local/nginx/sbin/nginx -s reload

# 在主配置文件中添加和huanjuan.conf的链接

[root@static-server ~]# vim /usr/local/nginx/conf/nginx.conf

keepalive_timeout  65;

      # 此行下添加

      include   ../conf.d/*.conf;

注意:..表示当前目录,即/usr/local/nginx,这里也可以写成相对路径

# 重载nginx配置文件,测试

[root@static-server ~]#/usr/local/nginx/sbin/nginx -s reload

基于ip的虚拟主机

#创建新的ip挂在这个网卡上

[root@static-server ~]# yum search ifconfig

[root@static-server ~]# yum -y install net-tools.x86_64

[root@static-server ~]# ifconfig ens33:1 192.168.2.23   # 添加一块虚拟网卡

# 修该2个文件的server_name将域名修改为ip地址

[root@static-server ~]# vim /usr/local/nginx/conf/nginx.conf

server{

listen 80;

server_name  192.168.2.23;

root /hua;

location / {

index index.html;

}

}

[root@static-server ~]# vim /usr/local/nginx/conf.d/hua.conf

server{

listen 80;

server_name 192.168.2.23;

root /hua;

location / {

index index.html;

}

}

# 重载nginx配置文件,测试

[root@static-server ~]#/usr/local/nginx/sbin/nginx -s reload

基于端口配置server

背景:80端口可以省略,一般来说基于端口的配置用于企业内部项目的测试

# 设置两个server都基于相同的ip

[root@static-server ~]# vim /usr/local/nginx/conf/nginx.conf

server_name  192.168.2.22;

[root@static-server ~]# vim /usr/local/nginx/conf.d/hua.conf

server_name 192.168.2.22;

# 此时加载不了,此时修改自建的文件的端口号

[root@static-server ~]# vim /usr/local/nginx/conf.d/hua.conf

listen 8080;

# 设置防火墙策略

[root@static-server ~]# firewall-cmd --zone=public --add-ports=8080/tcp --permanent

[root@static-server ~]# firewall-cmd --reload

# 重载nginx配置文件,测试

[root@static-server ~]# /usr/local/nginx/sbin/nginx -s reload

上线静态的前端系统(商城系统)

思路:先生成,再发布到nginx中

nodejs安装步骤

1、先安装nodejs,在此之前先确保已经安装了eple

[root@dy001 ~]# yum list installed|grep epel

epel-release.noarch                   7-14                             @epel    

nginx-filesystem.noarch               1:1.20.1-10.el7                  @epel    

openssl11-libs.x86_64                 1:1.1.1k-7.el7                   @epel    

[root@dy001 ~]# yum -y install nodejs

[root@dy001 ~]#node -v  # 查看版本

v16.20.2

2、安装npm(nodejs的包管理器,npm和rpm是一样的),并确保去淘宝的镜像源而不去默认的国外链接去下载

[root@dy001 ~]#yum -y install npm

[root@dy001 ~]# npm -v  # 查看版本

8.19.4

[root@dy001 ~]#npm config set registry https://registry.npmmirror.com  

3、添加vue模块 使用vue创建vue3项目,构建静态资源,将静态资源添加到nginx项目,

[root@dy001 ~]# npm install @vue/cli

[root@dy001 ~]# find / -name "vue"

/root/node_modules/vue

/root/node_modules/.bin/vue

[root@dy001 ~]# ls -l /root/node_modules/.bin/vue

lrwxrwxrwx. 1 root root 22 7月  31 14:42 /root/node_modules/.bin/vue -> ../@vue/cli/bin/vue.js

[root@dy001 ~]# /root/node_modules/.bin/vue -V

@vue/cli 5.0.8

4、创建vue项目

[root@dy001 ~]# /root/node_modules/.bin/vue create eleme_web

进入后选择Router和Vuex按空格后,按回车,最后一路向下按回车键

Successfully created project eleme_web.

[root@dy001 ~]# cd eleme_web

[root@dy001 eleme_web]# npm run serve

4、远程测试:

[root@dy001 eleme_web]# nohup npm run server&

[2] 3139

[root@dy001 eleme_web]# nohup: 忽略输入并把输出追加到"nohup.out"

[2]-  退出 1                nohup npm run server

[root@dy001 eleme_web]# tail -f nohup.out

[root@dy001 eleme_web]# fg

/root/node_modules/.bin/vue create eleme_web (wd: ~)

[root@dy001 eleme_web]# fg

-bash: fg: 当前: 无此任务

  1. 配置samba

1)安装samba

[root@dy001 eleme_web]# pwd

/root/eleme_web

[root@dy001 eleme_web]# yum -y install samba

2)编辑配置文件的位置

[root@dy001 eleme_web]# vim /etc/samba/smb.conf

# 行尾添加:

[eleme_web]

        comment=huajuan

        path=/root/eleme_web

        guest ok=no

        writable=yes

3)创建用户

[root@dy001 eleme_web]# useradd vueediter

[root@dy001 eleme_web]# smbpasswd -a vueediter

New SMB password:123

Retype new SMB password:

Added user vueediter.

4)为该用户在文件夹中添加读写权限

[root@dy001 eleme_web]# setfacl -m u:vueediter:rwx /root/eleme_web/

nginx-1.26.1                 package-lock.json

[root@dy001 ~]# ls -ld  /root/eleme_web/

总用量 192628

-rw-------.   1 root root       1419 5月  25 23:22 anaconda-ks.cfg

drwxrwxr-x+   5 root root        213 7月  31 15:09 eleme_web

5)启动2个服务

[root@dy001 eleme_web]# systemctl start nmb.service

[root@dy001 eleme_web]# systemctl start smb.service

[root@dy001 ~]# cd eleme_web/

[root@dy001 eleme_web]# ls

babel.config.js  package-lock.json

jsconfig.json    public

node_modules     README.md

nohup.out        src

package.json     vue.config.js

[root@dy001 eleme_web]# ls -l public/

总用量 12

-rw-r--r--. 1 root root 4286 7月  31 15:04 favicon.ico

-rw-r--r--. 1 root root  611 7月  31 15:04 index.html

在public/下创建目录

[root@dy001 eleme_web]# mkdir public/img

[root@dy001 eleme_web]# mkdir public/video

[root@dy001 eleme_web]# mkdir public/music

[root@dy001 eleme_web]# tree public/

public/

├── favicon.ico

├── img

├── index.html

├── music

└── video

6)部署nfs服务器

# 准备另一台主机——elemestatic(192..168.2.34),用于保存静态的图片、视频等

[root@elemestatic ~]# yum -y install nfs-utils  rpcbind

[root@elemestatic ~]# mkdir -p /static/img/

[root@elemestatic ~]# vim /etc/exports

/static/img/ *(rw,sync)

[root@elemestatic ~]# netstat -lntup|grep rpc

[root@elemestatic ~]# systemctl stop firewalld

7)客户端部署nfs

[root@dy001 eleme_web]# yum -y install nfs-utils.x86_64

8)主机的挂载,挂载nfs-server端共享目录public/上,此目录专门用于访问图片、视频

[root@dy001 eleme_web]# mount -t nfs 192.168.2.34:/static/img public/img/  # 对方ip

[root@dy001 ~]# systemctl start nmb.service

[root@dy001 ~]# systemctl start smb.service

9)真机上传图片

[root@elemestatic ~]#cd /static/img/

[root@elemestatic img]# rz -E

rz waiting to receive.

[root@elemestatic img]# ls

baidu.png

客户端验证

[root@dy001 ~]# cd eleme_web/

[root@dy001 eleme_web]# ls public/img

baidu.png

[root@dy002 ~]# cd eleme_web/

[root@dy002 eleme_web]# ls public/img

baidu.png

[root@dy002 eleme_web]# ls -l

总用量 768

-rw-r--r--.   1 root root     73 7月  31 21:22 babel.config.js

-rw-r--r--.   1 root root    279 7月  31 21:22 jsconfig.json

drwxr-xr-x. 527 root root  16384 7月  31 21:24 node_modules

-rw-------.   1 root root    322 7月  31 21:26 nohup.out

-rw-r--r--.   1 root root    461 7月  31 21:22 package.json

-rw-r--r--.   1 root root 728647 7月  31 21:22 package-lock.json

drwxr-xr-x.   5 root root     80 7月  31 21:29 public

-rw-r--r--.   1 root root    273 7月  31 21:22 README.md

drwxr-xr-x.   7 root root    108 7月  31 21:22 src

-rw-r--r--.   1 root root    118 7月  31 21:22 vue.config.js

[root@dy002 eleme_web]# cd src

[root@dy002 src]# ls -l

总用量 8

-rw-r--r--. 1 root root 478 7月  31 21:22 App.vue

drwxr-xr-x. 2 root root  22 7月  31 21:22 assets

drwxr-xr-x. 2 root root  28 7月  31 21:22 components

-rw-r--r--. 1 root root 171 7月  31 21:22 main.js

drwxr-xr-x. 2 root root  22 7月  31 21:22 router

drwxr-xr-x. 2 root root  22 7月  31 21:22 store

drwxr-xr-x. 2 root root  47 7月  31 21:35 views

[root@dy002 src]# cd views/

[root@dy002 views]# ls

AboutView.vue  HomeView.vue

[root@dy002 views]# vim HomeView.vue

[root@dy002 views]# nohup npm run server&

[3] 4290

[root@dy002 views]# nohup: 忽略输入并把输出追加到"nohup.out"

^C

[3]   退出 1                nohup npm run server

浏览器测试,发现vue界面发生变化,变成百度logo

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1965474.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

判断元音还是辅音字母

1.// kiki开始学习英文字母,bobo老师告诉他,有五个字母A(a),E(e),O(o),U(u),I(i)为元音,其他所有字母为辅音 //请帮他编写程序判断输入的字母是元音(vowel)还是辅音(consonant&#…

使用这个Blender工具非破坏性地自动化切割面板线

"Panel Cutter"插件自动化了在Blender中沿选定边缘创建程序化面板线的过程,使其成为硬表面建模的必备工具。 这是一个设计用来非破坏性地自动化切割程序化面板线的小工具。这个工具对于硬表面模型,如汽车、船只和飞机来说,是救星。…

Linux用户-普通用户

作者介绍:简历上没有一个精通的运维工程师。希望大家多多关注我,我尽量把自己会的都分享给大家,下面的思维导图也是预计更新的内容和当前进度(不定时更新)。 Linux是一个多用户多任务操作系统,这意味着它可以同时支持多个用户登录并使用系统。…

Java:面向对象(static,代码块,构造方法私有化,内部类)

5,static关键字 static是一个特殊的关键字,static的作用是将实例成员变为类成员,只能修饰在类里定义的成员部分(成员变量、方法、内部类(枚举和接口)、初始化块)。static修饰的成员表明它属于这…

三,搭建环境:事务控制

三&#xff0c;搭建环境&#xff1a;事务控制 文章目录 三&#xff0c;搭建环境&#xff1a;事务控制声明式事务配置注解写法查询操作增删改操作 声明式事务配置 在 demo-module01-web 的模块下的&#xff0c;spring-persist.xml 配置文件中 开启基于注解的声明式事务支持 <…

专硕复试线298/295!哈尔滨理工大学计算机考研考情分析!

哈尔滨理工大学&#xff08;Harbin University of Science and Technology&#xff09;&#xff0c;位于哈尔滨市&#xff0c;是黑龙江省人民政府与国家国防科技工业局共建高校&#xff0c;入选“中西部基础能力建设工程”高校、国家“特色重点学科项目”建设高校、教育部“卓越…

论文速递 | Management Science 5月文章合集

编者按&#xff1a; 在本系列文章中&#xff0c;我们梳理了运筹学顶刊Management Science在2024年5月份发布有关OR/OM以及相关应用的9篇文章的基本信息&#xff0c;旨在帮助读者快速洞察领域新动态。 推荐文章1 题目&#xff1a;Sensitivity Analysis of the Cost Coefficie…

OCC 布尔操作

一、简介 BRepAlgoAPI_Algo 是 OpenCASCADE 中用于布尔操作的基类&#xff0c;提供了布尔运算的基础功能。布尔操作是计算几何中常见的操作&#xff0c;用于对两个形状进行交、并、差运算等。这些操作在 CAD 和 3D 建模中非常重要。 BRepAlgoAPI_Algo 的基本功能 BRepAlgoAPI…

IDEA 插件 Tongyi Lima - 智能生成 Commit Msg 的强大工具

在当今的软件开发过程中&#xff0c;清晰准确的提交信息&#xff08;Commit Msg&#xff09;对于代码的版本控制和团队协作至关重要。而 IDEA 中的 Tongyi Lima 插件为开发者带来了极大的便利&#xff0c;它支持针对 commit 文件进行 AI 生成 commit msg &#xff0c;显著提升了…

DC-2靶机渗透

DC-2靶机渗透回顾 文章目录 DC-2靶机渗透回顾信息收集FLAG1FLAG2FLAG3FLAG4FLAG5 信息收集 nmap进行主机发现和端口扫描&#xff0c;发现开启80,7744端口 进行全扫描查看7744端口其实是ssh服务端口 FLAG1 访问网址&#xff0c;发现加载失败&#xff0c;看url地址看来是需要配…

RHCSA Liunx基础完整版笔记

虚拟机上安装rhel9 网络模式&#xff1a; 桥接模式&#xff1a;与主机使用同一张网卡。要求虚拟机的ip地址与物理机的ip地址在同一个网段 nat模式&#xff1a;该模式会使用vm8网卡与真机网卡进行通讯的。即虚拟机中的网卡与vm8连接&#xff0c;真机网卡与vm8连接。是的真机与…

Monorepo简介

Monorepo 第一章&#xff1a;与Monorepo的邂逅第二章&#xff1a;Multirepo的困境第三章&#xff1a;Monorepo的魔力 - 不可思议的解决问题能力第四章&#xff1a;Monorepo的挑战与应对策略第五章&#xff1a;总结第六章&#xff1a;参考 第一章&#xff1a;与Monorepo的邂逅 …

打开Excel后无法编辑是什么情况?3种解决方法

当发现Excel表格无法编辑&#xff0c;相关菜单选项也都变成灰色状态&#xff0c;无法点击时&#xff0c;可以看看是否以下3个原因造成的&#xff0c;一起来看看对应的解决方法吧。 一、Excel标记为“最终版本” 原因&#xff1a; 当Excel标记为最终版本时&#xff0c;Excel会…

AWS-负载均衡-创建一个对外的HTTPS ALB

目录 介绍 功能差异 适用场景 性能比较 补充 基本组成部分 创建流程 介绍 Elastic Load Balancing 支持三种类型的负载均衡器&#xff1a;Application Load Balancer、Network Load Balancer 和 Classic Load Balancer。这里用ALB( Application Load Balancer)说明。 功…

MySQL之表完整性约束

前言&#xff1a;本博客仅作记录学习使用&#xff0c;部分图片出自网络&#xff0c;如有侵犯您的权益&#xff0c;请联系删除 作用&#xff1a;用于保证数据的完整性和一致性 约束条件说明PRIMARY KEY (PK)该字段为该表的主键&#xff0c;可以唯一的标识记录&#xff0c;不可以…

诚宜开张圣听不应妄自菲薄

拾人牙慧孜孜不倦 青山依旧在几度夕阳红朝闻道夕死可矣 青山依旧在几度夕阳红 安能以血补天我计不成乃天命也臣本布衣躬耕南阳大丈夫宁死不辱尔要试我宝剑是否锋利吗又待怎样休教天下人负我竖子不足与谋皇天不佑天下英雄唯使君与操尔青光殷殷其灿如炎备不量力欲申大义于天下我…

LLM:微调大模型的评估

微调了一个垂直大模型&#xff0c;要判断其好坏&#xff0c;怎么做才算科学的&#xff1f; 一、客观测试集评测 训练的时候&#xff0c;就划分了训练集、验证集、测试集&#xff0c;6:3:1. 验证集用于观察有没有过拟合&#xff0c;一般来说是loss&#xff1b;测试集是在训练完…

【全国大学生电子设计竞赛】2024年E题

&#x1f970;&#x1f970;全国大学生电子设计大赛学习资料专栏已开启&#xff0c;限时免费&#xff0c;速速收藏~

工作流流程引擎框架推荐来了

近期有不少粉丝客户朋友都在询问工作流流程引擎框架推荐。随着行业竞争激烈化&#xff0c;实现流程化办公已经成为当务之急。低代码技术平台及工作流流程引擎拥有够灵活、更可靠、可视化界面等诸多个优势特点&#xff0c;在推动企业实现数字化转型的过程中深受行业信赖与喜爱。…