前后端分离,端口号不同,必须同一个端口才能显示对应的图片
发布于 6 年前 作者 wiscgazf 4729 次浏览 来自 问答

现在是前后端分离,前端vue后端nodejs,用vue做的管理平台,node作为服务端,前端用的端口是80,后端用的是30001,我把图片放在node后端本地文件夹下static/upload下 ,当我把图片返回给前端时,是/static/upload/img的形式,前端浏览器自己获取域名和端口信息,和后端服务器的端口不一样是没法显示图片,不然前端就得写死域名端口,但是这样不利于代码维护,有什么解决方法吗?

10 回复

建议返回给前端的图片是完整的链接,这样方便后期将静态资源移动到cdn,现在就相当于你的cdn是你自己的node服务器,我目前的做法就是就这样

来自酷炫的 CNodeMD

@zhangmingfeng 实在不行就只能这样了😄ཽ

上nginx可解决此问题

@jamiesoung nginx 解决方法可以分享一下吗 谢谢您 自豪地采用 CNodeJS ionic

建议尝试下zanproxy 有赞的和淘宝的whistle 或者charlea的map remote 或者fiddle 原原理都是代理转发

几种方式:

  1. 用你的node做vue的入口,这样不需要其他服务器提供静态服务,你的vue上的相对路径也不会任何问题;
  2. 用另外的服务器进行转发,比如nginx(一般来说就是你所说的前端用的服务80端口),添加一个服务,监听80,访问到你的静态文件路径的时候使用代理到你的node的端口去;
  3. 如果你是在纠结vue开dev发模式下的问题,和第二点同理,vue的脚手架可以直接设置代理。

@HobaiRiku 用代理 映射静态资源文件,啊 我研究一下代理 这块不太熟悉 初次写node后台 😃 自豪地采用 CNodeJS ionic

@wiscgazf 反向代理了解一下

@super2god 是的 确实很牛掰 已经解决了 用了vue内置的代理 Nginx代理测试了一下 也好用😃 自豪地采用 CNodeJS ionic

回到顶部