phpで外部ファイルに書き込み・読み込み

Question

ゲームのランキングをサーバー上に保存する方法についてです。

現在、ゲームを開発していて、ゲームのランキングをjavascriptで作成しています。
以前、質問した際にゲームのランキングを維持するにはサーバーに保存する必要があり、
サーバーに保存する方法にはPHPを活用する方法があると学びました。
そこからPHPについて学び、
次のPHPで外部ファイルの書き込みを行えることがわかりました。

<?php
  if (isset($_POST['message']) && $_POST['message'] != "") {
    $f = fopen("message.txt", "a");
    fwrite($f, htmlspecialchars($_POST['message']) . "\n");
    fclose($f);
  }
?>

<form action="append.php" method="post">
<p>メッセージ: <input name="message" size="60"></p>
</form>

<pre>
<?php readfile("message.txt"); ?>
</pre>

上記は、フォーム入力した内容がmessage.txtに書き込まれ、それをフォームの下部に表示するというものですが、これを活用して、私のHTMLに組み込んでみました。

<script>
  var r=[
    [
      document.write("<?php");
      document.write("if (isset($_POST['message']) && $_POST['message'] != '') {");
      document.write('$f = fopen("message.txt", "a");');
      document.write('fwrite($f, htmlspecialchars($_POST["message"]) . "\n");');
      document.write("fclose($f);");
      document.write('}');
      document.write("?>");
      document.write('<form action="append.php" method="post">');
      document.write('<p>メッセージ: <input name="message" size="60"></p>');
      document.write('</form>');
      document.write('<pre>');
      document.write('<?php readfile("message.txt"); ?>');
      document.write('</pre>*/');
      ,
      document.write("<?php");
      document.write("if (isset($_POST['message']) && $_POST['message'] != '') {");
      document.write('$f = fopen("message.txt", "a");');
      document.write('fwrite($f, htmlspecialchars($_POST["message"]) . "\n");');
      document.write("fclose($f);");
      document.write('}');
      document.write("?>");
      document.write('<form action="append.php" method="post">');
      document.write('<p>メッセージ: <input name="message" size="60"></p>');
      document.write('</form>');
      document.write('<pre>');
      document.write('<?php readfile("message.txt"); ?>');
      document.write('</pre>*/');
    ],
    ['59:59.96','xyz'],
    ['59:59.97','ijk'],
    ['59:59.98','aaa'],
    ['59:59.99','zzz'],
  ];
  var qs=[
    'q1',
  ];
  const viewRank=()=>{
    document.querySelector('#rank span').innerHTML=r.map(x=>x.join(" ")).join("<br>");
  };
  window.addEventListener('DOMContentLoaded',()=>{
    viewRank();
    document.querySelector('#start').addEventListener('click',e=>{
      const t1=e.target;
      const t2=document.querySelector('#a');
      t1.disabled=true;
      t2.disabled=false;
      const name=prompt("お名前を入力してください。");
      if(name=="") name="UnKnown";
      (async()=>{
        const s=new Date().getTime();
        for(var i=0;i<qs.length;i++){
          const qStr=qs[i];
          document.querySelector('#q span').textContent=qStr;
          t2.value="";
          t2.focus();
          await new Promise(resolve=>{
            const timerId=setInterval(()=>{
              if(t2.value==qStr){
                clearInterval(timerId);
                resolve();
              }
            },10);
          });
        }
        const e=new Date().getTime();
        const diff=e-s;
        const str=(10000+diff/1000).toString();
        const time=str.substr(1,2)+":"+
              str.substr(3,5);
        r.push([time,name]);
        r=await r.sort((x,y)=>x[0]>y[0]?1:-1).splice(0,5);
        viewRank();
        t1.disabled=false;
        t2.disabled=true;
      })();
    });
  });
</script>
<input type="button" value="ゲーム開始！" id="start">
<font size="5"><div id="q">Q:<span>ここに問題が表示されます。</span></div></font>
<div>A:<input type="text" id="a"></div>
<br>
<br>
<br>
<table border="1">
  <tr>
    <td>
      <div id="rank">現在のランキングトップ５<br>
        <center><span></span></center>
      </div>
    </td>
  </tr>
</table>

想定する挙動

ゲーム全体の流れは以下の通りです。

不明な点：自動的に出力されたものを代入する方法

ここまで作ったのですが、さらに不明点が発生しました。
私の場合、代入する値はフォームによるものではなく、時間計測によって自動的に出力されるものと名前です。これをどのようにして代入させるかがわかりませんでした。

ここまで来たので、少々複雑なものになってしまっても構わないと思います。
ご協力お願いします。

---

追記
＊PHPをJavascriptに組み込む途中で文法上のエラーが発生しているようですが、こちらに関しては質問の内容が外れてしまいますので、別途質問させていただきました。
→質問

Comments

[sakura_hana]

「PHPをJavascriptに組み込む」この発想が既に間違っています。
（PHPはサーバー側で動作する。Javascriptはローカル（ブラウザ）側で動作する。JavascriptでPHPのコードを書いてもPHPは動作しない）

そもそも「いつ何をどこに代入したいのか」が質問者には分かりません。
想定している挙動を日本語で記載してください。

上記が出来たら「ajax」で調べると理解が進むかと思います。

[m.ts10806]

追記について、まずできてないとやりたいことも何もないので「あとで」とするなら本件は永遠に進まないということになります。「サーバーサイドとは」「クライアントサイドとは」からきちんと理解できないとPHPでアプリケーションは作れません。

[sakura_hana]

挙動の追記を頂きましたが、まだ足りないです。
私は「いつ何をどこに代入したいのか」と指摘しました。
フローの中に「ここでJavascriptの変数nameにpromptで入力された値を代入する」「ここでPHPの変数messageにformのメッセージ欄に入力された値を代入する」などと追記していってみてください。（とりあえず「こうしたい」という希望でOK）
ここがあやふやだとそもそも正しくコードに出来ません。

[退会済みユーザー]

修正しました。
自分の記述できるコードと記述したいコードが若干違っているので、上記のHTMLには存在しない変数も書き込んでいます。しかし、これでほぼすべてですので、これで教えていただきたいです。

Answer 1

質問あまり読んでないですが、ページ遷移なしに POST したいって要件ですかね？
JavaScript で ajax を使用して、POST します。

サーバ側の実装は、以下の記事を入り口にすると良いです。
【PHP初心者向け】セキュアな掲示板を最小構成から作る

Answer 2

以前、質問した際にゲームのランキングを維持するにはサーバーに保存する必要があり、
サーバーに保存する方法にはPHPを活用する方法があると学びました。

この認識は正しいです。

ですが、

<?php readfile("message.txt"); ?>

このテキストファイルがどこにあるのかわかりませんし、
こちらに保存するソリューションもあるかもしれません…が、
通常であれば、MySQL等のデータベースを使う選択肢になります…。

＞サーバーに保存
このサーバーは、語弊を恐れずにいうと「MySQL（データベース）」です。
此処に保存します。
このデータベースとのやり取りに「PHP」を使います。

たぶん、txtファイル1枚でユーザーのスコアを保存することも可能性としては出来なくもないかもしれませんが、
大量のユーザーのいろんな情報を「txt」ファイルで管理というのは、まずありえません。

質問主のやるべき事として、
・txtファイルで管理する方法を探す
・MySqL等のデータベースとphpの連携を学ぶ
どちらかになります。

個人的にはmYsqlをキチンと学んだほうが良いと思いますが、
自分以外の方が、もっと変態的でかつ合理的な回答を提示してくれる可能性はありえます。

Comments

[m.ts10806]

＞質問主のやるべき事として、
違います。
PHPでHelloWorldが最優先です。

[hermit19901127]

ああ…、そこからですか…ですよね…

まずPHPでHelloWorldを表示できないと
MySQLに接続してデータやり取りどうこうもできないのは、常識的に考えて事実です…。

ちょっと説明が飛躍しすぎました。
まずははじめの一歩でもあり、そこが一番難しい「PHPでの『Hello World』」の表示を目指してください。