Question

我正在从Api动态获取此图像链接，并且试图将图像URL用作页面的backgroungImage样式。

URL看起来像这样：/ezXodpP429qK0Av89pVNlaXWJkQ.jpg

export default class View {
    constructor() {
        this.info = document.getElementById('header');
        this.backImage = document.getElementById('top');
    }

    showBack(img) {
        this.backImage.style.backgroundImage = `url(${img})`;

        this.img.innerHTML = `<div class="bottom" id="bottom">
       <img src="${img}" alt="">
        </div>
        `
    }
}

我收到此错误

获取http://localhost:8080/ezXodpP429qK0Av89pVNlaXWJkQ.jpg 404（未找到）

之前，我已经在其他网址中使用了这种类似的技术，但是这种方法不起作用。

Answer 1

我可以看到API为您提供了放置在API服务器等上的图像的相对URL。因此，您需要获取图像的绝对URL。例如，考虑使用Google图片网址https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png。您将获得网址部分“ /googlelogo_color_272x92dp.png”。由于图片位于google服务器上，因此您需要在网页中使用该图片的前面加上“ https://www.google.com/images/branding/googlelogo/1x/”部分。

尝试用作背景样式时，图像网址无法正常工作

1 个答案: