用data:image替换所有图像(带有src/url标记)

Question

我必须在sql数据库中保存html源代码(对于Android应用程序).内容必须存储在本地.所以图像也必须保存.我认为继续以下是适当的:

• 在服务器上(php):用img src ="data:image ..."字符串替换所有img src(正则表达式和加载图像？)
• 然后我可以在我的应用程序中存储本地的html代码

但我怎么能意识到这一点呢？或者我应该用html5保存图像？我希望你能帮助我!

更新:

$search = '(<img.*?src=")([^"]*?(\/[^/]*\.[^"]+))';
$replace = "<img src=\"".data_uri('$2')."\">";
$content = preg_replace($search, $replace, $content);

有人可以更正此代码吗？谢谢!

第二次更新:

例子:

<img class="alignnone" src="https://lh4.googleuserco (...)
<img src="https://lh4.googleuserco (...)
<img width="400" height="100" src='...' (...)

Answer 1

更换你<img src="image.png" alt="An image">用<img src="<?php echo data_uri('image.png'); ?>" alt="An image">,并酌情确定了以下功能:

function data_uri($filename) {
    $mime = mime_content_type($filename);
    $data = base64_encode(file_get_contents($filename));

    return "data:$mime;base64,$data";
}

您可能最终会得到大量的html文件,因此将文件存储在数据库之外可能更好？我不熟悉Android,但在iOS上你可以设置显示你的html文件的webview的基本路径,就像这样.

更新:

我创建了一个包含几个img元素的(content.php),然后在其上运行以下内容:

$content = file_get_contents('content.php');
$search = '/(<img\s+src=["\'])([^"\']+)(["\']\s+[^>]+>)/';
$content = preg_replace_callback($search, create_function(
        '$matches',
        'return $matches[1] . data_uri($matches[2]) . $matches[3];'
    ), $content);

在您在问题中发布的代码中,您的模式是缺少斜杠,并且您最终只是字面上运行data_uri('$2')(即$ 2是用作参数的实际字符串).preg_replace_callback允许您访问preg_replace找到的实际值.

无论如何,上面的代码将与更换的所有图像的返回值通过data_uri,从而建立与数据的URI IMG元素.您可能希望稍微改进模式,因为它当前假设属性由双引号括起来,并且没有其他内容,并且 src属性是元素的第一个属性,这就是我认为通常建议使用XML解析的原因.这种严重程度取决于您输入的数据.

更新2:

根据我的最新评论,更通用的解决方案是将其拆分为两个正则表达式.首先将您的搜索模式修改为$ search ='(] +>)'; 然后preg_replace_callback($search, 'img_handler', $content);确定你的img_handler函数是这样的:

function img_handler($matches) { 
    $image_element = $matches[1]; 

    $pattern = '/(src=["\'])([^"\']+)(["\'])/'; 
    $image_element; = preg_replace_callback($pattern, create_function( 
            $matches, 
            $matches[1] . data_uri($matches[2]) . $matches[3]), 
        $image_element); 

    return $image_element; 
}

这种方法的工作方式是第一个正则表达式识别所有ing元素()并将它们发送到回调函数img_handler,后者又只替换src属性.XML有点复杂(但更通用).我没有时间把一个例子放在一起,但它有很好的记录.查看DOMDocument或SimpleXML,基本上做同样的事情.

在结束时:

你现在已经修改了两次你的问题了,这肯定需要澄清,我觉得我们正在越来越远离最初的问题.我建议你把问题简明扼要地集中在一个主题上.如果答案或评论提出了其他问题,而这些问题本身没有得到解答,那么最好在这个问题上开始一个新的线程(例如,替换img元素的src属性)或寻找任何类似的已经问过的问题.