相对 img src 被解析为绝对...我错过了啥？

Posted 2023-03-05

【中文标题】相对 img src 被解析为绝对...我错过了啥？

【英文标题】：Relative img src is resolved as absolute... what am I missing?相对 img src 被解析为绝对...我错过了什么？

【发布时间】：2011-12-30 09:10:37

【问题描述】：

在我的项目中，用户可以输入网站的 URL，系统会从该网站获取所有图像。因为图片的src可以是相对的，系统对其进行“归一化”，所以：

src="http://host.com/image1.png" 的图像变为“http://host.com/image1.png”（无变化） 带有 src="/image2.png" 的图像变为“http://host.com/image2.png”（前置主机） “http://host.com/sub/dir/page.html”上 src="image3.png" 的图像变为“http://host.com/sub/dir/image3.png” (预先添加主机和路径）

如果可以的话，现在看看这个页面：

http://www.presentkuriren.se/presenter/4/728/Karlek/Pasta---hjartan.html

如果你看一下源码，主图实现为<img src="prodbilder/large/JJI10002.jpg"...

这会让我得出结论，绝对路径是http://www.presentkuriren.se/presenter/4/728/Karlek/prodbilder/large/JJI10002.jpg，但事实并非如此。这是http://www.presentkuriren.se/prodbilder/large/JJI10002.jpg，所有浏览器似乎都理解并正确显示它......

我有点困惑，觉得我错过了一些明显的东西......请指出来！

【问题讨论】：

您介意解释一下为什么会出现这个问题吗？

我不是在倒数第二段中清楚地说明了问题吗？

【参考方案1】：

头部有<base />标签：

<base href="http://www.presentkuriren.se/">

所以所有相对 URL（来自图像、链接等）都是相对于这个的！