3


0

PHP関数を使用して幅と高さの属性を<img>タグに自動的に追加する

私が欲しいのは、ユーザー入力で実行できる関数で、画像の読み込み中にページのリフローの問題を回避するために、HTMLのblobの ` tag ''タグに `width`属性と height`属性をインテリジェントに検索して追加します。

私はPHPフォーラムの投稿スクリプトを書いています。ここでは、ユーザーの入力をサニタイズし、後で表示するためにデータベースに書き込む前に、通常はより良くします。 物事をより良くするために私がすることの例として、次のような画像に `alt`属性を挿入するスクリプトがあります:

ここに2つの画像があります:

投稿スクリプトでサニタイズすると、次のようになります

ここに2つの画像があります:

(これによりHTML 4での検証が厳密になりますが、alt属性の精神ではないかもしれません。alas!)

したがって、私の機能については、サーバーがHTMLのブロックで検出した各外部画像で `getimagesize()`を実行し、関数が生成する属性をすべての ``タグに適用する必要があるという漠然としたアイデアを持っていますに実行します。 この関数は以前に書かれたものだと思いますが、Googleやphp.netのドキュメントでは運がありません。 最初からやり直す必要がありますか、それとも誰かがこの仕事をするために使用または適応できる(比較的)堅牢な機能を知っていますか?

3 Answer


5


あなたは `getimagesize()`について正しいです。 次のようなことが簡単にできます。

$img = 'image2.png';
$info = getimagesize($img);
printf('', $img, $info[3]);

画像がリモートの場所でホストされている場合は、すべての画像をダウンロードする必要があります(関数が処理します)。結果をキャッシュして、後続のリクエストの速度を上げることができます。

*編集:*さまざまな ``要素を含む文字列があることを確認しました。 これでうまくいくはずです。

 hello
EOF;

$dom = new DOMDocument();
$dom->loadHTML($html);

foreach ($dom->getElementsByTagName('img') as $img) {
    list($width, $height) = getimagesize($img->getAttribute('src'));
    $img->setAttribute('width', $width);
    $img->setAttribute('height', $height);
}

$xpath = new DOMXpath($dom);
$newDom = new DOMDocument();
foreach ($xpath->query('//body/p')->item(0)->childNodes as $node) {
    $newDom->appendChild($newDom->importNode($node, true));
}

$newHtml = $newDom->saveHTML();
?>


0


問題は、サーバーが事前に非常に多くの作業を行う必要があることです。 オフラインでサイズのデータ​​ベースにデータを入力する(またはサイズのキャッシュを維持する)方がはるかに効率的だと思います。

そして、これを行うと、画像サイズを設定し、htmlの最後にインラインで呼び出されるキャッシュ可能なjavascriptを使用して、ブラウザに作業をプッシュできます(これは、すべてのhtmlをプッシュする必要がないという利点があります書き換え用のPHPコードを使用)。 ヒント:document.images []を反復処理します

HTH

C.


0


getimagesize()を使用できますが、この情報を一度保存​​して再利用するか、少なくとも積極的にキャッシュする(頻繁に変更される可能性は低いため)か、サーバーがより高い負荷で停止してクロールします