今回の趣味の開発でいろいろ困っては小技を見付けて対処しているのだが、一番困るのは、JavaScriptからPHPが呼べないことだ。もちろん、外部プログラムも実行できない。実際には、それができたらブラウザが危険極まりないものになってしまう(ActiveXみたいな話?)からあり得ないのだが、僕の今の用途では、是非ともJavaScriptやHTMLからPHPや外部プログラムを実行したいのだ。

というのは、例えば、曲の評価の変更のユーザ操作はHTMLとJavaScriptでしか実現できないが、変更した値をDBに書き込むのはPHPや外部プログラムでしかできない。まあ、JavaScriptでライブラリを探して使ってネット経由でDBのサーバにアクセスすることはできるのかも知れないが、大掛かりになってしまう気がする。

そういう時、基本的には、JavaScriptやHTMLからリンク経由で別の保存処理をするページに飛び、その時に必要なデータを引き渡す。飛び先のページではまずPHPが動くので、渡されたデータをDBに書いたり外部プログラムで処理することができる。

そのデメリットはページが変わってしまうことだ。大昔はそういうのばかりだったが、今はページ遷移なしで処理するのが当たり前になっている。見栄えだけならいいが、ページの状態を全部引き継ぐことができないのが問題だ。今回はSpotifyの検索結果(結構大きくなる)を引き継ぐのが面倒だ(遷移するたびに検索し直すのは無駄だし遅くなる)。検索結果を引き継ぐのは不可能ではないが、中間ファイルが必要になるだろう。

そこでいろいろ考えたら、2つの方法を思い付いた。最初に、HTMLのiframeを使う方法を思い付いた。PHPや外部プログラムの機能が要る処理、例えば、データを保存するのに別のページに飛ぶことは必要だとして、今のページも残せる方法を考えたら、iframeが使えた。以下のような流れになる。

  1. データを保存する契機になる。
  2. iframeにデータを保存するURL(保存するデータも一緒に)を指定して開く。(実際には、このURLは自分自身で、引数を特別なものにして行う処理を指定している)
  3. そのURLでデータの保存が実行されるが、結果はiframeの中に(小さく)表示されるので、今のページはそのまま残る。

JavaScriptを使えば一定時間後にiframeを閉じることができるので、下の方に小さく作っておけば、見た目のインパクトも少ない。

しかし、その後もっと簡単な方法に気付いた。JavaScriptでデータを保存するURLを指定して開くのだ。これなら結果は表示すらされない(しかも、JavaScriptで結果が受け取れる)ので、まったく楽だ。昔流行った"AJAX"らしい(今はfetchという機能がいいようなので、それを使っている)。この場合は以下のような流れになる。

  1. データを保存する契機になる。
  2. fetchでデータを保存するURL(保存するデータも一緒に)を指定して開く。(上と同様に、このURLは自分自身で、引数を特別にしている)
  3. fetchでURLの結果を取得して処理を開始する。

ただ、これの問題点は、URLを開いた(処理を実行した)結果を待てないことだ。fetchの中では結果は受け取れるが、fetchを実行した側はそれが終わるのを待つことができない(fetchが開始したことが分かるだけ)。それで、fetchの中(URLを呼んだ節。スレッドのようなもの)でfetchが終わった後に結果に対応する処理を行う必要がある。JavaScriptが非同期なための手間だ。

でもまあ、この(AJAX)の方法に気付いたおかげでiframeすら不要になって、Spotifyプレーヤーでの再生開始やDBのアクセスなどが手軽に(とは言え、実際のプログラムは、実行したい処理を自分自身(のプログラム)で行うにも関わらず、ネット経由で再び起動されたりするので、ものすごく煩雑だし効率も悪い)できるようになったのはありがたい。

ただ、僕としては、そもそもそういうことをネット経由でやるのが気に入らない。もっと普通のやり方があるのかも知れないので、おいおい考えてみたい。まあ、全部JavaScriptで書く(例: Node.jsとかElectronとか)のがそれなのかも知れないが、非同期は「普通」じゃなくてすごく疲れるからねぇ・・・

  •   0
  •   0

コメントを書く

名前    

メール 

URL