现在很多网站都是有了PC端和H5站点的,因为这样就可以根据客户设备的不同,显示出体验更好的,不同的页面了。
这样的需求有人说拿自适应就可以搞定,比如我们常说的bootstrap和24格布局法,这些确实是非常好的方案,但是无论是复杂性和易用性上面还是不如分开编写的好,比如我们常见的淘宝、京东……这些大型网站就都没有采用自适应,而是用分开制作的方式。
那分开制作如何通过配置Nginx来识别出应该展示哪个页面那?我们这节课就来学习一下。
$http_user_agent的使用:
Nginx通过内置变量$http_user_agent,可以获取到请求客户端的userAgent,就可以用户目前处于移动端还是PC端,进而展示不同的页面给用户。
操作步骤如下:
在/usr/share/nginx/目录下新建两个文件夹,分别为:pc和mobile目录
cd /usr/share/nginx
mkdir pc
mkdir mobile
在pc和miblic目录下,新建两个index.html文件,文件里下面内容
<h1>I am pc!</h1>
<h1>I am mobile!</h1>
进入etc/nginx/conf.d目录下,修改8001.conf文件,改为下面的形式:
server{
listen 80;
server_name localhost;
location / {
root /usr/share/nginx/pc;
if ($http_user_agent ~* '(Android|webOS|iPhone|iPod|BlackBerry)') {
root /usr/share/nginx/mobile;
}
index index.html;
}
}