vue部署项目之后,无法访问到静态资源(图片)
首先参见如下帖子:https://blog.csdn.net/qq_39480597/article/details/79568173,这个算是系统的管理了静态资源资源问题,适合大部分静态资源访问不到的情况,但是觉得很繁琐,我这边没有用,我下面列出一种,只有一两张图片访问不到的情况我这边是访问图片出现了问题,而且只有一张,是通过new 出来的image对象,原始代码如下// js操作dom,...
·
首先参考下这个帖子:https://blog.csdn.net/qq_39480597/article/details/79568173,
这个算是系统的管理了静态资源资源问题,适合大部分静态资源访问不到的情况,但是觉得很繁琐,我这边没有用,我下面列出一种,只有一两张图片访问不到的情况
我这边是访问图片出现了问题,而且只有一张,是通过new 出来的image对象,原始代码如下
// js操作dom,new出来的图片给相对路径是访问不到
var image = new Image()
img.src = '../../../static/personInfo/person.png'
// 标签引入相对路径是可以访问到
<img id="defaultFaceImg" src="../../../static/personInfo/person.png" />
最后解决问题的代码如下
var image = new Image() // 定义一个图片对象
// img.src = '../../../static/personInfo/person.png'
// 部署服务器的ip和端口
var hostIPAndPort = window.location.origin// http:192.168.1.61:9527
var pathName = window.location.pathname // 部署在服务器的前台项目名,通常开发环境为'/',生产环境为'/projectname/'
// 问题就是这里,出现的,因为中间多了项目名,无法访问到指定的静态路径图片
image.src = hostIPAndPort + pathName + 'static/personInfo/person.png'
我这边是这样解决了,通过源生js代码,如果未解决的大佬,可以参考下上面的链接帖子,里面说的比较全面,我这只适合小部分情况解决。
更多推荐
已为社区贡献4条内容
所有评论(0)