码迷,mamicode.com
首页 > Web开发 > 详细

新建PC web站点和Moblie web站点

时间:2020-06-26 14:39:59      阅读:63      评论:0      收藏:0      [点我收藏+]

标签:区别   temp   char   bin   title   sbin   lis   ali   html   

一、新建一个PC web站点

1、创建pc端配置文件

mkdir /apps/nginx/conf/conf.d
vim /apps/nginx/conf/conf.d/pc.conf

server {
listen 80;
server_name www.zengwen.com;

charset utf-8;

location / {
root /data/nginx/html/pc;
index index.html index.htm;
}

}

2、准备html文件(访问页面)

vim /data/nginx/html/pc/index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>linux爱好者 官网</title>
</head>
<body>
<h2>linux学习者PC端欢迎你</h2>
</body>
</html>

3 、修改电脑的hosts文件

C:\Windows\System32\drivers\etc,添加虚拟机地址和对应域名  192.168.0.5 www.zengwen.com  mobile.zengwen.com

4、nginx的主配置文件中引入pc配置    include /apps/nginx/conf/conf.d/*.conf;

技术图片

 

 5、重新加载reload,访问测试

root@template-ubuntu:/apps/nginx# /apps/nginx/sbin/nginx -t
nginx: the configuration file /apps/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /apps/nginx/conf/nginx.conf test is successful
root@template-ubuntu:/apps/nginx# systemctl reload nginx
技术图片

 

 二、创建一个mobile web站点

1、创建mobile端配置文件

vim /apps/nginx/conf/conf.d/mobile.conf

server {
listen 80;
server_name mobile.zengwen.com;

charset utf-8;

location / {
root /data/nginx/html/mobile;
index index.html index.htm;
}

}

2、准备mobile端的html文件

 mkdir /data/nginx/html/mobile -p
 vim /data/nginx/html/mobile/index.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>linux爱好者 官网</title>
</head>
<body>
<h2>linux学习者mobile端欢迎你</h2>
</body>
</html>

3、重新加载reload,访问测试

技术图片

 

三、如果需要在在域名后,访问一张静态图片,以PC端为例

1、修改pc.conf文件,在location后面加新的location,指向图片存放的路径

location /tfs {
root /data/nginx/static/pc;

}

2、创建图片路径目录,准备图片(网上随便照一张图片,下载下来)

root@template-ubuntu:/apps/nginx# mkdir /data/nginx/static/pc/tfs -p
root@template-ubuntu:/apps/nginx# cd /data/nginx/static/pc/tfs
root@template-ubuntu:/data/nginx/static/pc/tfs# ls

root@template-ubuntu:/data/nginx/static/pc/tfs# wget https://p2.ssl.qhimgs1.com/sdr/400__/t016810fe364a5ab5d2.jpg

mv t016810fe364a5ab5d2.jpg 1.jpg

3、重新生效测试

/apps/nginx/sbin/nginx -t
nginx: the configuration file /apps/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /apps/nginx/conf/nginx.conf test is successful

systemctl reload nginx

技术图片

 

 

四、root和alias的区别

root:指定web的家?录,在定义location的时候,?件的绝对路径等于 root+location,如:

ocation /tfs {
root /data/nginx/static/pc;    #必须要在static?录中创建?个tfs?录才可以访问,否则报错。

}

alias:定义路径别名,会把访问的路径重新定义到其指定的路径,如:

location /about {                    #使?alias的时候uri后?如果加了斜杠则下?的路径配置必须加斜杠,否则403

alias /data/nginx/html/pc;      #当访问about的时候,会显?alias定义的/data/nginx/html/pc??的内容。

index index.html;
}

 

 

 

 

 

 

 

 

新建PC web站点和Moblie web站点

标签:区别   temp   char   bin   title   sbin   lis   ali   html   

原文地址:https://www.cnblogs.com/zengwen003/p/13192786.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!