フォトギャラリーページでPHPを使ってみました

2016-10-14

とは言っても、ほんの少しなんですけどね。フォトギャラリーサイト作成にあたり、ほとんどのことはHTMLCSS・JavaScriptでなんとかしてますが、それだけでは出来ないこともやっぱりありまして。

というのが、サーバーにアップした写真の枚数の取得。簡単そうでしょ?でも、JavaScriptじゃ実現出来ないんですよね。

そこで登場するのが、PHPっていうウェブページ作成のためのプログラミング言語。ただ、今回のことはプログラミングってほどのことはしていませんし、写真の枚数を取得できただけなのでページの見た目が変わったわけでもないです(笑)でも、これによって写真をアップした時の作業が少しだけ軽くなりました(^^)

PHPで全て書き直し?!

PHPという言語を使えば実現できるというのはわかりましたが、ここで問題が発生します。

フォトギャラリーページを全てPHPで書き換えないといけないのか?!

そう、フォトギャラリーページは全てJavaScript(これもウェブページ作成のためのプログラム言語)で書いています。悪戦苦闘しながらせっかく作ったのに、全部やり直しってなると相当な痛手。なんとかならないかと色々調べた結果、変数を引き渡す方法がありました!

PHPからJavaScriptへの変数の引き渡し

カスタムデータ属性を利用

PHPとJavaScriptは別々の言語ですが、この二つの共通点は、どちらもHTMLとは接点があるという点。そこを突いたのがこの方法です。

カスタムデータ属性とは、HTML5で定義されたHTMLに独自のデータを設定できる属性です。僕は、この件で初めて知りましたが、これは色々使えそうですね。
これで、JavaScriptまでの道が開けました。

  1. PHPで値の取得
  2. その値をカスタムデータ属性に格納
  3. JavaScriptでそのカスタムデータ属性の値を取り出す

この流れでPHPからJavaScriptへ変数の引き渡しが可能になります(^^)

めでたしめでたし(笑)