持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第1天,点击查看活动详情
直接访问本机上的图片资源
- 问题场景:前端通过流的形式将图片传给后端,后端在放到服务器上,将图片在服务器上的绝对路径返回给前端,再由前端去自己展示图片。
- 由于前端无法直接打开服务器,需要 nginx 转发前端的请求去访问图片资源,具体如下:
server {
listen 80;
server_name zhoukingzz.com;
location / {
root /front_end/dist/;
index index.html;
}
location ~* /images/ {
alias /images/uploadFiles/;
}
}
- 其中关键在于使用 alias 在服务器上查找指定路径下的资源
- 需要注意
alias
后面必须要用 '/' 结束,否则会找不到文件 - 顺带了解下
alias
和root
的区别:alias
只能作用在location
中,而root
可以存在server
、http
和location
中。
访问别的服务器下的图片
- 问题场景:上面我们虽然解决了前端 nginx 和图片资源在同一服务器下的资源访问,但是实际上很多时候我们前端的服务器和后端存放的图片资源其实不在一个服务器上,这个时候我们又如何去解决呢?
- 我的解决方法是:在前面的基础上,在前端 nginx 再做一层转发请求到图片资源所在服务器的 nginx
- 前端 nginx 如下:
server {
listen 80;
server_name zhoukingzz.com;
location / {
root /front_end/dist/;
index index.html;
}
location ~* /images/ {
proxy_pass http://image.zhoukingzz.com;
}
}
- 图片资源所在服务器 nginx 配置:
server {
listen 80;
server_name image.zhoukingzz.com;
location ~* /images/ {
alias /images/uploadFiles/;
}
}
- 这样就通过 nginx 转发把请求前端服务器的图片资源的请求转发到图片资源所在服务器,并通过图片资源所在服务器的 nginx 把图片资源的请求指定到存放图片资源的目录下