使用 PHP、javascript 或 jQuery 使图像中的所有相对路径 URL 成为完整路径答案

【问题标题】：Make all relative path URLs in images full paths using PHP, javascript or jQuery使用 PHP、javascript 或 jQuery 使图像中的所有相对路径 URL 成为完整路径
【发布时间】：2013-05-31 07:50:05
【问题描述】：

我想获取页面上的任何 url，主要是为了修复未显示的图像，并将其从相对更改为绝对，如果它是相对的。

例子：

来自<img src="/folder/folder/image.jpg" />

致<img src="http://<?php echo get_option('domain'); ?>/folder/folder/image.jpg" />

由于我将插入的域部分是 PHP sn-p，因此更需要哪种方法最适合它。谢谢。

【问题讨论】：

HMTL <base> 标签可能有用，但请先研究一下：stackoverflow.com/questions/1889076/…
使用php。创建一个变量或常量，如包含绝对路径的 DOC_URL，然后在整个应用程序中使用它。

标签： php javascript jquery string

【解决方案1】：

你可以只获取所有的img元素并将src更改为document.url + img.src。在 JavaScript 中应该很简单。我认为这里更大的问题是您为什么在使用相对 URL 时遇到问题？如果您想从不同的域或类似的东西动态加载图像，那么可以。

如果您需要在页面加载时执行此操作，那么您最好在用于呈现 html 的任何内容中构建 url 服务器端。

有关如何在 JS 中执行此操作的更多信息和代码示例。 Getting an absolute URL from a relative one. (IE6 issue)

【讨论】：

在您的 javascript 有时间更改图像源之前，这是否会请求一堆死链接？
@dhsto 否，如果您尝试修复页面加载时的死链接，则使用 javascript 来执行此操作并不好。因为浏览器必须先解析页面，然后 JavaScript 才能编辑这些元素。但是，如果您尝试获取通过 JavaScript 加载的图像的完整 URL，或者为每次图像加载都执行此操作，那么是的，我认为 JavaScript 是一个非常好的方法。
我也是这么想的。所以 Javascript 不是解决这个问题的一个很好的解决方案，因为他/她正在尝试修复已死的图像源。只有在这种情况下，只有在使用 javascript 动态生成内容或从一开始就使用 javascript 设置源时，Javascript 才会很好用……否则浏览器会在每次页面加载时发出一堆无效请求。

【解决方案2】：

使用 JQuery，您可以使用 .attr() 来更改 src 字符串。如果没有 ID 属性，尝试捕获正确的 img 标签可能会变得很困难。您必须检查每个 src 字符串中的“www”。在附加当前站点之前查看是否已有站点引用。

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/lib/jquery/1.7.2/jquery.min.js"></script>
 <script type="text/javascript">
 $(document).ready(function(){
 $("img").each(function(){
      if($(this).prop("src").toLowerCase().indexof("www.") != -1){
           $(this).attr('src', document.domain + $(this).prop("src"));
      }
 )};
 </script>

我认为最难的部分是确定哪些 img 标签需要更改。

【讨论】：

【解决方案3】：

使用 jquery：

$(function () {
    $('img').each(function () {
        if (this.src.indexOf('http://') === -1) this.src = "http://mysite.com" + this.src;
    });
});

【讨论】：

几乎与我发布的解决方案相同。我认为的挑战是如果图像源不使用 http:// 而是使用 https:// 会怎样。可能有多种方法可以获得图像源，这可能会导致更改源，从而破坏链接而不是修复它们。也许更好的测试是字符串是否以/开头。

【解决方案4】：

为此使用正则表达式：

$text = '<img src="abc" /> asiodn <img src="dev" />'; //e.g.
$regex = '/<img src="([^https?:\/\/][^"]*)" \/>/';
$result = preg_replace($regex, '<img src="http://' . get_option('domain') . '$1" />', $text);

这应该修复图像 src 中的所有相对 url

http://codepad.viper-7.com/TsHGbE

【讨论】：