PHP 初心者が WordPress の プラグイン 作成 ! part19 ( ヘッドレスブラウザの文字化けを解消する )

Pocket

この記事では PHP 初心者 が WordPress プラグイン を 作成 します。 part19 ではヘッドレスブラウザから出力されたイメージの文字化けを解消およびユーザーエージェントの設定を行いたいと思います。

前回の確認でヘッドレスブラウザを実行した結果を出力することに成功しました。

PHP 初心者が WordPress の プラグイン 作成 ! part18 ( PHPからヘッドレスブラウザ操作 成功!)

しかし出力されたイメージはところどころ文字が潰れていて読むことができません。
今回はこの問題を解消したいと思います。また「ユーザーエージェント」の設定も行いたいと思います。

ユーザーエージェントとは

こちらの記事に詳しく紹介されていました。

ユーザーエージェントとは。文字列の確認方法や利用方法、固定化される件 (lpeg.info)

Webサーバ(今回の場合はココナラ)に対して「自分はWindwosのChromeでアクセスしていますよ!」
という情報を伝えるリクエストパラメータの仲間ですね。

この設定をきちんとしておかないとWebサーバから期待する情報が取得できないことがあります。

ユーザーエージェントの設定

PHPライブラリの本家のページにどのようなオプションが使用できるのか掲載されていました。

GitHub – chrome-php/headless-chromium-php: Control Chrome from PHP

「userAgent」というのが該当のオプションのようです。
値をどうしようかなぁ🤔
以下のページにユーザーエージェントを確認できます。
私はWindowsのChromeにしようと思います。

確認くん

 

index.phpのオプション定義部分は以下のようになりました(長い)。

// for Docker option
$options = [
    'headless' => true,
    'noSandbox' => true ,
    'sendSyncDefaultTimeout' => 10000,
    'userAgent' => 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.212 Safari/537.36',
];

 

文字化けについて

こちらは以下の記事を読ませていただき、PHPの環境に日本語のフォントが入っていないということが問題だと思いました。

Docker でヘッドレス Chrome を動かしてみた | メモ (al-batross.net)

なんだかインストールが大変そうなのでIPAのフォントを適用することにしました(笑

EC2 UbuntuでGoogle Chromeをヘッドレス実行してスクリーンショットを採取する手順 – Qiita

文字化け問題解消の手順

まずwgetが入っていないようなのでwgetをインストールします。

apt install wget

フォントをダウンロードして展開します。

wget https://moji.or.jp/wp-content/ipafont/IPAexfont/IPAexfont00401.zip 
unzip IPAexfont00401.zip -d ~/.fonts/

フォントキャッシュをクリアします。

fc-cache -fv

zipファイルを削除しておきます。

rm IPAexfont00401.zip

以上でよいそうです。

確認

http://localhost:8099/index.php にアクセスして出力結果を確認してみました。

・・・失敗のようです。

まとめ

ヘッドレスブラウザの文字化けを解消すべく作業を行いました。

またしても躓いてしまいました(´・ω・`)
調査をやりなおして次に進みたいと思います!

今日はここまで!