nginx 中配置多个location并解决js/css/jpg/等的加载问题

ECS:阿里云
系统:ubuntu 16.04
我的配置文件位置:
/etc/nginx/conf.d/**.conf
我的静态网页的位置:
/var/www/**
html中加载的js之类的文件夹和index.html在一个文件夹中

配置文件内容:

server {
  listen 80;
  server_name #你的网站IP或****.com;
  location /www1
  {
      alias /var/www/****;
      index index.html index.php index.htm;
  }
  location /www2
  {
      alias /var/www/****;
      index index.html index.php index.htm;
  }
  location  ~ .*\.(jpg|jpeg|gif|png|ico|css|js|pdf|txt)$
  {
      root /var/www/;
      proxy_temp_path /var/www/;
  }

配置好以后 重启nginx

sudo nginx -s reload

这时候 要访问第一个网页 就是 IP/www1
要访问第二的网页就是 IP/www2
关于alias和root的区别:
root和alias是系统文件路径的设置。
root用来设置根目录,而alias用来重置当前文件的目录。

location /img/ {
    alias /var/www/image/;
}
#若按照上述配置的话,则访问/img/目录里面的文件时,ningx会自动去/var/www/image/目录找文件
location /img/ {
    root /var/www/image;
}
#若按照这种配置的话,则访问/img/目录下的文件时,nginx会去/var/www/image/img/目录下找文件。
### NginxLocation块的配置 #### Location块的作用 Nginx中的`location`块用于定义针对特定URL路径的处理规则。通过这些规则,可以精确控制不同类型的请求如何被处理,包括静态文件服务、反向代理设置以及其他各种操作[^2]。 #### 配置语法与匹配原则 `location`指令接受两种主要形式来指定要匹配的URI模式: - **前缀字符串**:如果以普通字符开始,则表示简单的前缀匹配。 ```nginx location /images/ { root /var/www/site; } ``` - **正则表达式**:以波浪号(`~`)或感叹号加波浪号(`!~`)开头分别代表区分大小写和不区分大小写的PCRE兼容正则表达式的匹配方式 ```nginx location ~ \.(gif|jpg|png)$ { expires 30d; } ``` 为了提高性能,在多个可能的选择之间,优先级顺序如下: 1. 完全匹配(=) 2. 正则表达式按出现次序逐一测试直到找到第一个成功者 3. 最长前缀匹配;如果有两个以上的最长前缀相等长度,则最先声明的那个获胜 #### 实际应用案例 下面给出几个实际应用场景下的例子说明如何利用`location`实现不同的功能需求: ##### 提供静态资源 假设网站根目录位于 `/usr/share/nginx/html`, 而图片存放在子目录 `img` 下面, 则可以通过以下方式快速定位返回给客户端请求的内容. ```nginx server { ... location /img/ { alias /usr/share/nginx/html/img/; } } ``` ##### 设置缓存策略 对于某些类型的文件(如CSS, JavaScript), 可以为它们设定较长的有效期以便浏览器能够更好地缓存从而减少重复加载时间. ```nginx location ~* \.(css|js)$ { add_header Cache-Control "public, max-age=86400"; } ``` ##### 使用反向代理转发请求到后端服务器 当涉及到动态页面生成或其他复杂业务逻辑时,通常会选择将这类工作交给专门的应用程序服务器完成。此时就可以借助于`proxy_pass`命令把符合条件的HTTP请求转交给后台的服务实例去执行具体的任务. ```nginx location /api/ { proxy_pass http://localhost:9000; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; } ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值