springboot+nginx访问图片或重写addResourceHandlers映射文件路径

ゝ一纸荒年。 2022-01-10 14:29 966阅读 0赞

# springboot+nginx访问文件或重写addResourceHandlers映射文件路径 #

每天多学一点点~  
最近跳槽了去新公司，清闲了两周，心里面有点慌，遂研究了点新东西

### 文章目录 ###

*  springboot+nginx访问文件或重写addResourceHandlers映射文件路径
 *   *  1.序言
     *  2.addResourceHandlers方法
     *  3.测试映射文件路径
     *  4.nginx配置(推荐)
     *  5.测试nginx
     *  6.总结
     *  7.结语

## 1.序言 ##

博主某天在访问同学做好的网页时候，看了一个网页上的一张图片。作为一名码畜，按了下f12，发现其img标签中路径居然的8080端口开头的，而其他接口的路径也是8080，于是问了下同学，其服务器用了nginx(端口80)，但是并没有用反响代理，也没有配置静态资源访问路径。其8080端口就是后台服务的端口，很奇怪为何8080能访问到图片，博主之前都是用nginx配置静态资源路径去访问的，遂请教了下同学，继承**WebMvcConfigurerAdapter**类并重写**addResourceHandlers**方法，重新映射文件路径

## 2.addResourceHandlers方法 ##

@Configuration
    public class WebMvcConfig extends WebMvcConfigurerAdapter {
    
        /**
         * 上传文件根路径
         */
        private String filesPath = "files";
    
        private String uploadPath = "upload";
    
        private String path = "/upload/image/";
    
        private String falePath = "/upload/file/";
    
    	// public static final String FILE_URL_PREFIX = "file:" 就是以file开头
    
        /**
         * 外部文件访问
         */
        @Override
        public void addResourceHandlers(ResourceHandlerRegistry registry) {
            String relativelyPath = System.getProperty("user.dir");
            String filePath = relativelyPath + File.separator + uploadPath;
    
            registry.addResourceHandler(path + "**")
                    .addResourceLocations(ResourceUtils.FILE_URL_PREFIX + filePath + File.separator);
            registry.addResourceHandler(falePath + "**")
                    .addResourceLocations(ResourceUtils.FILE_URL_PREFIX + filePath + File.separator);
            super.addResourceHandlers(registry);
    
        }
        
    }

System.getProperty(“user.dir”)是获得项目的当前路径。

以上代码大意就是将访问地址映射到本地的文件所在地址。

## 3.测试映射文件路径 ##

1.  将项目启动，在项目所在的路径下简历映射文件的目录，放入一张图片  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQzNzYzMw_size_16_color_FFFFFF_t_70]
2.  在浏览器输入访问地址  
    http://localhost:8090/upload/image/test/aa.png  
    8090是后台项目端口号，/upload/image是你规定的访问图片的路径，映射到本地项目的upload文件夹下 ，/test/aa.png是图片路径。  
    **注：** 这种方式虽然简单，但是缺点是后台项目必须启动，一般还是推荐用nginx代理。  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQzNzYzMw_size_16_color_FFFFFF_t_70 1]

## 4.nginx配置(推荐) ##

上述方法的缺点是访文件必须后台服务开启，其实一般为了高并发和稳定性，推荐使用nginx

linux下安装nginx博主就不说了，有兴趣的童鞋自己安装一下，很简单

下面是nginx.conf的配置，需要的童鞋可以参考一下

server {
            listen       80;
            server_name  192.168.73.130;
    
    
            error_page   500 502 503 504  /50x.html;
    			location = /50x.html {
                root   html;
            }
    		location / {
    		    root   html;
    			index  index.html index.htm;
    			#proxy_pass  http://127.0.0.1:8088;
    		}
    		
    				# 基于正则动静分离  图片 注意 root 和 alias 区别
    		# root会带上 location 匹配的字段 ，而 alias不会
    		
    		
    		# 基于 目录前缀匹配  http://192.168.73.130/upload/aa.png 图片在/home/zjq/web/jars/upload 目录下  
    		# ^~ 表示 如果把这个前缀用于一个常规字符串,那么告诉nginx 如果路径匹配那么不测试正则表达式。
    		#location ^~ /upload/ {
    		#	root /home/zjq/web/jars/;     #指定图片存放路径    
    		#}
    		
    		# 基于 alias 的目录   访问的是 /home/zjq/web/jars/upload 的图片
    		#                     url   http://192.168.73.130/test/aa.png 
    		location ^~ /test/ {
    			alias /home/zjq/web/jars/upload/ ;     # upload 后的 / 要带上 否则会变成 去找   /home/zjq/web/jars/upload/test/aa.png
    		}
    		
    		
    
    		# 后缀匹配 http://192.168.73.130/aa.png  图片在 /home/zjq/web/jars/ 下 
    		#location ~ .*\.(gif|jpg|pdf|jpeg|png)$ 
            #{  
            #    root /home/zjq/web/jars/;     #指定图片存放路径     
            #}
    		
    		# 搭配使用  url 以 upload 开头 ， 以图片格式结尾
    		# http://192.168.73.130/aa.png    图片在  /home/zjq/web/jars/upload 下 
    		#location ~ /upload/*.*\.(gif|jpg|pdf|jpeg|png)$ 
            #{  
             #  root  /home/zjq/web/jars/;     #指定图片存放路径  
            #}
    
    		# fastdfs的配置
            location /group1/M00 {
            #   alias /home/zjq/fastdfs/file/data;
              #root  /home/zjq/fastdfs/storagedata/data;
              ngx_fastdfs_module;
            }
    		
    
    
        }

## 5.测试nginx ##

1.  启动nginx  
    ![在这里插入图片描述][20190620110858685.png]  
    博主设置的是开机自启，所以先关闭nginx进程。  
    ngx\_http\_fastdfs\_set pid=7705 是配置了fastdfs，没配置的同学可以忽略。
2.  访问图片  
    http://192.168.73.130/upload/aa.png 第一种，匹配路径  
    http://192.168.73.130/aa.png 第二种，匹配后缀  
    http://192.168.73.130/upload/aa.png 第三种，搭配使用，只要在upload目录下都可以  
    aa.png 在 /home/zjq/web/jars/ 路径下  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQzNzYzMw_size_16_color_FFFFFF_t_70 2]

## 6.总结 ##

平时遇到自己没见过的东西，勤快点记下来。nginx博主之前就知道怎么配置，addResourceHandlers映射是第一次见到，又学到一个东西，加油

## 7.结语 ##

**世上无难事，只怕有心人，每天积累一点点，fighting！！！**

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQzNzYzMw_size_16_color_FFFFFF_t_70]: /images/20220110/2e7b915dc4d64250a3e215a1bc8937a4.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQzNzYzMw_size_16_color_FFFFFF_t_70 1]: /images/20220110/ebd2a78adf28409780e00bfb8617315f.png
[20190620110858685.png]: /images/20220110/d5c3b881b612406692b9b3956927d85f.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80MjQzNzYzMw_size_16_color_FFFFFF_t_70 2]: /images/20220110/ef60d8852bfc4e86904121c6340ba7e2.png