WordPress│画像だけ元サイトから参照する方法│All-in-One WP Migration

メディアを除外して移行すると転送量を減らせますが、移行先だけで画像を保持する完全なバックアップにはなりません。

元サイトが公開を止めたり画像を変更したりすると、移行先の表示も影響を受けます。

著者

motoki

WEB制作をしているデジタルノマド
WordPressのカスタマイズが好きで、色々と自作しています。

WordPressのカスタマイズに困ったらご相談ください！

MOTOKI合同会社

カスタマイズの依頼・相談

元画像を参照してよい条件

自分が管理し継続配信できる元サイトに限り、画像の利用権限と外部参照の可否を確認します。

通常の移転で元サーバーを停止する予定なら、画像ファイルも移行してください。メディアを別に転送する流れは、サイト容量が大きい時のサイト移転方法で説明しています。

移行前にバックアップと対象を確認する

データベースとメディアを含む元サイトの完全バックアップを別途保存します。

All-in-One WP Migrationで除外可能な項目とインポート条件を確認し、検証先で復元を試します。

画像を除けば必ず数百MBになるわけではなく、データベースや他のファイルの容量にも依存します。

保存済み本文の画像URLを置換する

Better Search Replaceなどシリアライズに対応した処理で、移行先のuploadsの完全なURLを元サイトのURLへ置き換えます。

置換前に、移行先のデータベースもバックアップし、置換直前の状態へ戻せるようにします。

接頭辞を含む実際のテーブル名を確認し、posts・postmetaなど必要なテーブルだけを選んでドライランします。

置換件数と対象値を確認してから実行し、無関係なドメイン文字列を一括置換しません。

WordPressが生成する画像URLを変更する例

本文の文字置換とは別に、添付画像のURLとWordPressが生成するsrcsetをサーバー側で変更する例です。

バックアップ後、子テーマのfunctions.phpへ追加し、fromを移行先、toを元サイトのuploads URLに変更します。

function waza_external_upload_url($url) {
    $from = 'https://new-example.com/wp-content/uploads/';
    $to = 'https://old-example.com/wp-content/uploads/';
    if (!is_string($url) || strpos($url, $from) !== 0) return $url;
    return $to . substr($url, strlen($from));
}
add_filter('wp_get_attachment_url', 'waza_external_upload_url');
function waza_external_upload_srcset($sources) {
    if (!is_array($sources)) return $sources;
    foreach ($sources as &$source) {
        if (isset($source['url'])) $source['url'] = waza_external_upload_url($source['url']);
    }
    unset($source);
    return $sources;
}
add_filter('wp_calculate_image_srcset', 'waza_external_upload_srcset');

マルチサイトでは、fromに実際のuploads/sites/3/などサイト固有の末尾まで指定します。

同じ関数を複数追加せず、通常サイトとマルチサイトでこの1組の設定値を変更します。

掲載コードはURLの先頭がfromと一致するかだけで判定し、移行前からある画像と移行後に追加した画像を区別しません。

移行先へ新しくアップロードした画像も、このフィルターを通るURLが一致すれば元サイトへ書き換わります。

画像ファイルを元サイトへコピーする処理はないため、元サイトに同じ相対パスの画像がなければ表示できません。

移行後も移行先だけに画像を追加する運用では、この例をそのまま使わず、外部参照する画像の対象条件を別途設計してください。

JavaScriptでDOM読込後に書き換える旧例は、元のリクエストが先に始まるため撤去しました。

適用されない画像と検証

このフィルターは、独自に出力するpictureのsource、遅延読込のdata-src、CSS背景、外部プラグイン固有の画像URLを一律に変えません。

各画像の生成元に合わせて確認し、SWELL全体の画像がこれだけで直るとは判断しません。

PC・スマホでNetworkと画像のcurrentSrcを調べ、実際に元サイトの画像が200で取得できるか確認します。

WordPress 7.1.2の検証環境で、実際の添付画像から生成したsrcと3候補のsrcsetが元サイトのURLへ変わること、寸法・sizes・保存済みメディア情報が残ること、フックを外すと元のHTMLへ戻ることを確認しました。

加えて、自分で用意したHTTPSの参照元で候補3サイズを取得し、ファイルの一致を確認しました。

利用者の元サイトからの取得と、実サイト全体の移行は未検証です。

src・srcset・currentSrcを分けて確認する

srcだけ元サイトへ変わっていても、srcsetに移行先の候補が残ると、端末によって表示が変わります。

逆に候補URLが正しくても、そのサイズのファイルが元サイトに存在しなければ表示できません。

元サイトに同名・同サイズのファイルがあることも確認してください。

URLの書き換え後に画像ファイルを取得する

この確認では、検証用の移行先と参照元を同じ管理下のHTTPSサーバーに用意し、証明書を検証して取得しました。

公開記事の例にあるドメインは、利用する移行先・元サイトのURLへ書き換えるための仮の値です。

WordPressのフィルターは、返したURLの先に画像ファイルがあるか確認しません。

srcだけでなくsrcsetの全候補について、元サイトに同名のファイルがあり、200で画像として取得できるか確かめてください。

元サイトの認証や参照制限、証明書、削除予定も確認します。

HTTPで各候補を取得できても、ブラウザが選ぶcurrentSrcとPC・スマホの表示は別の確認です。

最後に公開ページを開き、実際に選択されたURLと表示を確認してください。

今回のHTTPS試験は、ブラウザの候補選択やAll-in-One WP Migrationによるサイト全体の移行を検証した結果ではありません。

戻し方

追加した関数・フックを外すと、このフィルターによるURLの書き換えは止まります。

データベース置換を行った場合は、移行先で置換直前に保存したバックアップを使って戻します。

バックアップ後に投稿などを更新している場合は、その変更を失わないよう復元範囲を確認してください。

URLやデータベースを戻しても、移行時に除外した画像ファイルは復元されません。

移行先のURLで画像を表示するには、移行先にも対応する画像ファイルを用意する必要があります。

その後キャッシュを更新して、元の画像URLと表示を確認します。

参照：wp_get_attachment_url、wp_calculate_image_srcset。