PHP ページの HTML 要素に変数を遅延渡すか、更新された値に置き換えます

Question

<p><br /></p> <pre class="brush:bash;toolbar:false;">/public/register.php ## [1] "public" 登録フォーム /public/js/checkout.js ## [2] 「パブリック」決済処理 /src/register.php ## [3]「private」追加処理 </pre>

<li>[1] <code><script src="js/checkout.js"></script></code> 経由でロード [2]</li> <li>[1] via <code>require __DIR__ . '/../src/register.php';</code> contains [3]</li> </ul> <p>[1] には HTML 要素が含まれます (PHP ファイル内の HTML コードとして、つまり <code><php ... ?></code> タグの外側に含まれます): </p> ; <pre class="brush:html;toolbar:false;"><div id="secret" style="display: none;"> <?php echo htmlspecialchars($secret_var); ?> </div> </pre> <p><code>$secret_var</code> は [3] で宣言/インスタンス化されています。 </p> <p>[2] この JS ファイルには </p> が含まれています。 <pre class="brush:js;toolbar:false;">var div = document.getElementById("secret"); var Secret_var = div.textContent; console.log(secret_var) </pre> <p>[3] には </p> が含まれています。 <pre class="brush:php;toolbar:false;">session_start(); // 支払いパートナーの処理コード、応答 $secret_var = json_encode(array(secret_var); $_SESSION['secret_var'] = $secret_var; </pre> <p><code>$secret_var</code> は、<code>$_SESSION</code> 変数として [3] から [1] に渡され、[2] がそれを取得します。 </p> <p>JavaScript ファイルの <code>console.log</code> ステートメントからブラウザで <code>$secret_var</code> をエコーすると、<code>null</code> が返されます。 </p> <p><code>src/register.php</code> から <code>$secret_var</code> をエコーするとき (レンダリングされた <code>registration.php</code> ページに表示されます)。正しい (文字列) 値があります。 </p> <p><code>$secret_var</code> を HTML の <code>#secret</code> 要素に渡すのを遅らせたり、更新された (null 以外の) 値に置き換えたりするにはどうすればよいですか? </p>

Answer 1

実行順序に問題が発生したと考えてください。たとえば、<div id="secret"> が DOM に存在しないときに、[2] スクリプトが実行されました。 <script src="js/checkout.js"></script> = <? を出力する前に、[1] に <script>var secret_var のようなものを追加するだけです。 = json_encode($secret_var); ?>;</script> のコンテンツなので、checkout.js が実行される前に公開されて既知となり、変数としてすでに存在します。要素の内容を読む必要はありません。または、window.onload などのイベントを使用して [2] 要素の読み取りを実行します。

シークレット値が変更され、それを更新する必要がある場合は、定期的に変更を確認するか、使用する前に最新の値をリクエストすることができます。

クライアントに出力するものはすべて秘密ではないことに注意してください。値を本当に保護したい場合は、サーバー側にのみ保持する必要があります。これは、支払いゲートウェイの API キーの場合には当てはまりません。など非常に重要です。サーバー側とは、シークレットをデータベースまたはセッションに保存することを意味します。その後、リモート サービスと対話する必要があるときはいつでも、PHP スクリプト (例: ajax) を呼び出してサーバー側でそのタスクを実行するだけです。これにより、シークレットの使用をサーバー側のみに分離することができ、その後、それをクライアント端末に渡すか、更新を要求します。