nginx部署前端项目location时root和alias配置指南

 更新时间:2024年01月08日 15:53:39   作者:阿松哥哥2018  
nginx指定文件路径有两种方式root和alias,下面这篇文章主要给大家介绍了关于nginx部署前端项目location时root和alias配置的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下

操作说明

1、nginx目录中html目录下放置green 前端项目

监听端口:8181

nginx配置文件配置location时使用root方式

	# root 方式
		#  方式1 域名直接可访问到  即 localhost:8181
		#location / {
        #    root   html;
        #    index  green/index.html green/index.htm;
        #}
		
		#  方式2 域名直接可访问到  即 localhost:8181
		#location / {
        #    root   html/green/;
        #    index  index.html index.htm;
        #}
		
		#  方式2.1 域名直接可访问到  即 localhost:8181
		#location / {
        #    root   html/green;
        #    index  index.html index.htm;
        #}

		# 方式3  域名+/green  可访问到  即 localhost:8181/green
        #location /green/ {
        #    root   html;
        #    index  index.html index.htm;
        #}
		
		# 方式3.1  访问不到green下任务资源
        #location /green/ {
        #    root   html/green/;
        #    index  index.html index.htm;
        #}

以上三种 方式结论验证 用root属性指定的值是要加入到最终路径中的,匹配条件会拼接到路径中

即最终获取的静态页面路径为:域名 + root + 区配条件 + index

即找到 localhost:8181/html/green/index.html

备注:方式2 和方式2.1 用于验证 root 属性的值最后的 “/“为非必须,有没有最后一个”/” 都可以访问到

nginx配置文件配置location时使用alias方式

# alias 方式
		#  方式1  域名直接可访问到  即 localhost:8181
		#location / {
        #    alias   html/green/;
        #    index  index.html index.htm;
        #}
		
		#  方式1.1  访问不到green下任务资源
		#location / {
        #    alias   html/green;
        #    index  index.html index.htm;
        #}
		
		#  方式2  域名直接可访问到  即 localhost:8181
		#location / {
        #    alias   html/;
        #    index  green/index.html green/index.htm;
        #}
		
		#  方式3  域名直接可访问到  即 localhost:8181/green
		#location /green {
        #    alias   html/green/;
        #    index  index.html index.htm;
        #}
		
		#  方式3.1  域名直接可访问到  即 localhost:8181/green
		#location /green/ {
        #    alias   html/green/;
        #    index  index.html index.htm;
        #}

以上三种 方式结论验证 用alias属性指定的值,匹配条件不会拼接到路径中,会直接在alias属性的值下面去找资源

即最终获取的静态页面路径为:域名 + alias + index

即找到 localhost:8181/html/green/index.html

备注:方式1 和方式1.1 用于验证 alias 属性的值最后的 “/“为必须,没有最后一个”/” 访问不到

完整的nginx配置文件如下

#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';
	
	map $time_iso8601 $logdate{
            '~^(?<ymd>\d{4}-\d{2}-\d{2})' $ymd;
            default 'date-not-found';
    }

    access_log  logs/access-$logdate.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;

    #gzip  on;

    server {
        listen       8181;
        server_name  localhost;

        access_log  logs/access-$logdate.log  main;
		
		# root 方式
		#  方式1 域名直接可访问到  即 localhost:8181
		location / {
            root   html;
            index  green/index.html green/index.htm;
        }
		
		#  方式2 域名直接可访问到  即 localhost:8181
		#location / {
        #    root   html/green/;
        #    index  index.html index.htm;
        #}
		
		#  方式2.1 域名直接可访问到  即 localhost:8181
		#location / {
        #    root   html/green;
        #    index  index.html index.htm;
        #}

		# 方式3  域名+/green  可访问到  即 localhost:8181/green
        #location /green/ {
        #    root   html;
        #    index  index.html index.htm;
        #}
		
		# 方式3.1  访问不到green下任务资源
        #location /green/ {
        #    root   html/green/;
        #    index  index.html index.htm;
        #}
		
		# 以上三种 方式结论验证  用root属性指定的值是要加入到最终路径中的,匹配条件会拼接到路径中
		# 即最终获取的静态页面路径为:域名 + root + 区配条件 + index
		# 即找到 localhost:8181/html/green/index.html
		# 备注:方式2  和方式2.1 用于验证 root 属性的值最后的 "/"为非必须,有没有最后一个"/" 都可以访问到
		
	
	
		# alias 方式
		#  方式1  域名直接可访问到  即 localhost:8181
		#location / {
        #    alias   html/green/;
        #    index  index.html index.htm;
        #}
		
		#  方式1.1  访问不到green下任务资源
		#location / {
        #    alias   html/green;
        #    index  index.html index.htm;
        #}
		
		#  方式2  域名直接可访问到  即 localhost:8181
		#location / {
        #    alias   html/;
        #    index  green/index.html green/index.htm;
        #}
		
		#  方式3  域名直接可访问到  即 localhost:8181/green
		#location /green {
        #    alias   html/green/;
        #    index  index.html index.htm;
        #}
		
		#  方式3.1  域名直接可访问到  即 localhost:8181/green
		#location /green/ {
        #    alias   html/green/;
        #    index  index.html index.htm;
        #}
		# 以上三种 方式结论验证  用alias属性指定的值,匹配条件不会拼接到路径中,会直接在alias属性的值下面去找资源
		# 即最终获取的静态页面路径为:域名 + alias +  index
		# 即找到 localhost:8181/html/green/index.html
		# 备注:方式1  和方式1.1 用于验证 alias 属性的值最后的 "/"为必须,没有最后一个"/" 访问不到
		

        #  后台服务; 
        location /fdiagnose/ {
			proxy_ignore_client_abort   on;
			proxy_set_header Host $http_host;
			proxy_set_header X-Real-IP $remote_addr;
			proxy_set_header REMOTE-HOST $remote_addr;
			proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        	proxy_pass http://localhost:9090;
        }
    }
}

附:Nginx 配置中root和alias的区别分析

root和alias都可以定义在location模块中,都是用来指定请求资源的真实路径,比如:

location /i/ {  
    root /data/w3;
}

请求 http://foofish.net/i/top.gif 这个地址时,那么在服务器里面对应的真正的资源

 /data/w3/i/top.gif文件

注意:真实的路径是root指定的值加上location指定的值 。

而 alias 正如其名,alias指定的路径是location的别名,不管location的值怎么写,资源的 真实路径都是 alias 指定的路径 ,比如:

location /i/ {  
  alias /data/w3/;
}

同样请求 http://foofish.net/i/top.gif 时,在服务器查找的资源路径是: /data/w3/top.gif

其他区别:

     1、 alias 只能作用在location中,而root可以存在server、http和location中。

     2、 alias 后面必须要用 “/” 结束,否则会找不到文件,而 root 则对 ”/” 可有可无。

总结 

到此这篇关于nginx部署前端项目location时root和alias配置的文章就介绍到这了,更多相关nginx location用root和alias配置内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Nginx将http转换成https的详细过程

    Nginx将http转换成https的详细过程

    相信大家在现有项目里都会通过https访问,这篇文章主要给大家介绍了关于Nginx将http转换成https的详细过程,文中将实现的方法介绍的非常详细,需要的朋友可以参考下
    2022-05-05
  • Nginx配置PATHINFO隐藏thinkphp index.php

    Nginx配置PATHINFO隐藏thinkphp index.php

    这篇文章主要介绍了Nginx配置PATHINFO隐藏thinkphp index.php,本文直接给出配置示例,需要的朋友可以参考下
    2015-07-07
  • 启用Nginx目录浏览功能的方法

    启用Nginx目录浏览功能的方法

    这篇文章主要介绍了启用Nginx目录浏览功能的方法,需要的朋友可以参考下
    2014-03-03
  • NGINX详细下载安装及使用入门教程

    NGINX详细下载安装及使用入门教程

    Nginx是一种高性能的Web服务器软件,它可以处理大量的并发连接,并且可以缓存HTTP请求以提高性能,本文给大家介绍NGINX详细下载安装及使用入门教程,感兴趣的朋友跟随小编一起看看吧
    2024-10-10
  • Nginx 1.28.0 源码编译安装与自定义网页部署详细指南

    Nginx 1.28.0 源码编译安装与自定义网页部署详细指南

    本文介绍了Nginx1.28.0的安装过程,提供了自定义HTML文件部署步骤、安装后核心目录说明、常用管理命令、部署前端项目示例等内容,感兴趣的朋友跟随小编一起看看吧
    2026-05-05
  • 关于Nginx配置ssl证书实现https安全访问

    关于Nginx配置ssl证书实现https安全访问

    这篇文章主要介绍了关于Nginx配置ssl证书实现https安全访问,前题条件是拥有服务器与可以解析到该服务器的自己的域名,需要的朋友可以参考下
    2023-04-04
  • nginx源码分析configure脚本详解

    nginx源码分析configure脚本详解

    这篇文章主要介绍了nginx源码分析configure脚本详解的相关资料,需要的朋友可以参考下
    2017-05-05
  • nginx阻止对未绑定域名的访问方式

    nginx阻止对未绑定域名的访问方式

    本描述重点讲解了Nginx配置中如何阻止未绑定特定域名的访问,通过设置默认server块和明确指定server名称,确保只有合法请求能够匹配成功,从而避免非法访问的问题
    2026-05-05
  • 如何使用nginx代理ws或是wss的请求

    如何使用nginx代理ws或是wss的请求

    这篇文章主要为大家详细介绍了如何使用nginx代理ws或是wss的请求,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-11-11
  • Nginx实现前端灰度发布

    Nginx实现前端灰度发布

    灰度发布是一种重要的策略,它允许我们在不影响所有用户的情况下,逐步推出新功能或更新,通过灰度发布,我们可以测试新版本的稳定性和性能,下面就来介绍一下前端灰度发布的使用,感兴趣的可以了解一下
    2025-03-03

最新评论