PHP 使用正則表達式提取圖片 URL 完整指南

前言

在網頁爬蟲、內容解析或富文本編輯器處理中，從 HTML 字串中精準提取 <img> 標籤的 src 屬性是常見需求。本文將介紹如何使用 PHP 正則表達式高效完成此任務，並說明常見陷阱與改進方案。

基礎正則範例

<?php
header('Content-Type: text/html; charset=utf-8');

$html = '<p><img src="images/11111111.jpg" alt="美女" /></p>';

// 修正後的正則：支援單雙引號、屬性順序不固定、自閉合標籤
$pattern = '/<img\\b[^>]*\\bsrc=(["\'])([^"\']+)\\1[^>]*>/i';

preg_match_all($pattern, $html, $matches);

echo '<pre>';
print_r($matches);
?>

正則表達式解析

輸出結果說明

Array
(
    [0] => Array
        (
            [0] => <img src="images/11111111.jpg" alt="美女" />
        )
    [1] => Array
        (
            [0] => "
        )
    [2] => Array
        (
            [0] => images/11111111.jpg
        )
)

• $matches[0]：完整匹配的標籤
• $matches[2]：我們真正需要的圖片 URL

進階場景與改進建議

1. 處理相對路徑轉絕對路徑

function normalizeImgUrls($html, $baseUrl) {
    return preg_replace_callback(
        '/<img\\b[^>]*\\bsrc=(["\'])([^"\']+)\\1[^>]*>/i',
        function($m) use ($baseUrl) {
            $url = $m[2];
            if (strpos($url, 'http') !== 0 && $url[0] !== '/') {
                $url = rtrim($baseUrl, '/') . '/' . ltrim($url, '/');
            }
            return '<img src="' . $m[1] . $url . $m[1] . '"' . substr($m[0], strpos($m[0], '"', strpos($m[0], 'src=')) + 1);
        },
        $html
    );
}

2. 推薦使用 DOMDocument 替代正則

正則解析 HTML 存在局限性（巢狀標籤、屬性順序、編碼問題）。PHP 內建 DOMDocument 更穩健：

<?php
$dom = new DOMDocument();
libxml_use_internal_errors(true); // 忽略 HTML5 標籤警告
$dom->loadHTML('<meta charset="utf-8">' . $html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
libxml_clear_errors();

$images = $dom->getElementsByTagName('img');
foreach ($images as $img) {
    echo $img->getAttribute('src') . PHP_EOL;
}
?>

總結

• 簡單場景可用正則快速提取，注意引號配對與屬性順序。
• 複雜或不可信 HTML 請改用 DOMDocument 或 DOMXPath。
• 提取後建議做 URL 正規化、去重與格式驗證（如 filter_var($url, FILTER_VALIDATE_URL)）。

掌握這些技巧，讓你的圖片抓取邏輯更可靠、維護更輕鬆。