相关推荐recommended
ruoyi-vue前后端分离框架上传图片不显示问题,nginx解决方案
作者:mmseoamin日期:2024-01-18

使用若依前后端分离框架,前端项目打包在Nginx,上传图片时,图片上传成功,但是在列表页和添加/修改页面没有正常显示。

插入成功后数据库保存数据样式:

/profile/upload/2023/10/24/7_20231024172017A001.png

回显数据时样式:

http://localhost/prod-api/profile/upload/2023/10/24/7_20231024172017A001.png

此时样式是打不开的,无法找到路径

解决办法:nginx.conf在location中添加alias

location /prod-api/profile/ {

            # 指向目录,对应后台`application.yml`中的`profile`配置目录一致
            alias D:/ruoyi/uploadPath/;

        }

实际访问路径就是:

D:/ruoyi/uploadPath//upload/2023/10/24/7_20231024172017A001.png

这时候就能正常访问到图片,可以正常显示了。

location /prod-api/profile/ {

            # 指向目录,对应后台`application.yml`中的`profile`配置目录一致
            alias D:/ruoyi/uploadPath/;
        }

alias  作用是将url路径中的域名/ip+端口号+匹配到的内容(匹配内容此处指的是:/prod-api/profile/)更换为 alias后面设定的内容(此处指的是:D:/ruoyi/uploadPath/)。注意字后的斜杠 (/)不能省略。

详情参考:详解nginx的root与alias_nginx root和alias_水电费嘎嘎的博客-CSDN博客