vue使用axios 请求资源获取成功，页面图片资源却无法渲染

Question

资源获取成功，图片却无法渲染。
在浏览器地址栏中放入图片资源路径，可以渲染出来。之后再刷新页面，项目中的图片就正常渲染出来了。
如果没有上述操作，图片资源却渲染失败。

axios 请求

getData (bool) {
        axios.get(`http://sbdx.lygher.com/wenpaiting/wpt/api/pc.php?op=guangguang&p=${this.index}`)
          .then((response) => {
            console.log(response.data)
            for (let i = 0; i < response.data.length; i++) {
              if (bool) {
                this.pageData.unshift(response.data[i])
              } else {
                this.pageData.push(response.data[i])
              }
            }
          })
          .catch((error) => {
            console.log(error)
          })
      }

请求之后的结果

报错提示

使用报错的图片地址打开一个新的浏览器窗口，图片正常显示

之后刷新项目，在新的浏览器窗口打开的图片地址正常显示，其他图片资源依然报错

社区的大佬们指点下，跪谢^_^

Answer 1

图片cdn不是你自己的吧？看起来是做了host之类的限制。禁止外链了。