より簡単な答えを試してみましょう:
問題の説明
まず、サーバーからページが提供されるときのイベントの流れを理解しましょう。
- 最初にPHPが実行され、クライアントに提供されるHTMLが生成されます。
- 次に、HTMLがクライアントに配信され、PHPがそれを使用した後、コードがサーバーを離れると、PHPが使用され、PHPにアクセスできなくなることを強調しておきます。
- 次に、JavaScriptを使用したHTMLがクライアントに到達し、クライアントはそのHTMLでJavaScriptを実行できます。
したがって、ここで覚えておくべき重要なことは、HTTPはステートレスであることです。リクエストがサーバーを離れると、サーバーはそれにアクセスできません。したがって、オプションは次のとおりです。
- 最初のリクエストが完了した後、クライアントからさらにリクエストを送信します。
- サーバーが最初のリクエストで何を言ったかをエンコードします。
ソリューション
それはあなたがあなた自身に尋ねるべき核心的な質問です:
私はウェブサイトまたはアプリケーションを書いていますか?
Webサイトは主にページベースであり、ページの読み込み時間は可能な限り高速である必要があります(たとえば、Wikipedia)。WebアプリケーションはよりAJAXが重く、クライアントの高速情報(たとえば、株式ダッシュボード)を取得するために多くのラウンドトリップを実行します。
ウェブサイト
最初の要求が行われた後、クライアントからより多くの要求を送信すると、かなりのオーバーヘッドを伴うより多くのHTTP要求が必要になるため、遅くなります。さらに、AJAXリクエストを行うには、完了時にハンドラーが必要になるため、非同期性が必要です。
サイトがサーバーから情報を取得するためのアプリケーションでない限り、別のリクエストを行うことはお勧めしません。
変換時間と読み込み時間に大きな影響を与える高速応答時間が必要です。この場合、Ajaxリクエストの作成は最初のアップタイムが遅く、不要です。
この問題に取り組むには2つの方法があります
- Cookieを設定する-Cookieは、サーバーとクライアントの両方が読み取ることができるHTTPリクエストで送信されるヘッダーです。
- 変数をJSONとしてエンコード-JSONは JavaScriptオブジェクトに非常に近く、ほとんどの JSONオブジェクトは有効なJavaScript変数です。
Cookieの設定はそれほど難しくありません。値を割り当てるだけです。
setcookie("MyCookie", $value); // Sets the cookie to the value, remember, do not
// Set it with HTTP only to true.
次に、JavaScriptを使用してそれを読み取ることができますdocument.cookie
。
ここに短い手巻きのパーサーがありますが、これの真上にリンクした答えはよりよくテストされたものです:
var cookies = document.cookie.split(";").
map(function(el){ return el.split("="); }).
reduce(function(prev,cur){ prev[cur[0]] = cur[1];return prev },{});
cookies["MyCookie"] // Value set with PHP.
Cookieは小さなデータに適しています。これは、追跡サービスがよく行うことです。
さらにデータを取得したら、代わりにJavaScript変数内のJSONでデータをエンコードできます。
<script>
var myServerData = <?=json_encode($value)?>; // Don't forget to sanitize
//server data
</script>
仮定$value
されたjson_encode
PHP側でできる(それは通常です)。この手法は、たとえばStack Overflowがチャットで行うものです(PHPの代わりに.NETのみを使用)。
応用
アプリケーションを作成している場合-突然の初期ロード時間は、アプリケーションの継続的なパフォーマンスほど常に重要ではなく、データとコードを別々にロードすることで成果を上げ始めます。
ここでの私の答えは、JavaScriptでAJAXを使用してデータをロードする方法を説明しています。
function callback(data){
// What do I do with the response?
}
var httpRequest = new XMLHttpRequest;
httpRequest.onreadystatechange = function(){
if (httpRequest.readyState === 4) { // Request is done
if (httpRequest.status === 200) { // successfully
callback(httpRequest.responseText); // We're calling our method
}
}
};
httpRequest.open('GET', "/echo/json");
httpRequest.send();
またはjQueryを使用:
$.get("/your/url").done(function(data){
// What do I do with the data?
});
ここで、サーバーに/your/url
は、データを取得してそれを処理するコードを含むルート/ファイルを含める必要があります。
<$php
...
$val = myService->getValue(); // Makes an API and database call
echo json_encode($val); // Write it to the output
$>
このように、JavaScriptファイルは、コードやレイアウトを要求するのではなく、データを要求して表示します。これはよりクリーンであり、アプリケーションが高くなるにつれて成果を上げ始めます。また、問題の分離が向上し、サーバー側のテクノロジを使用せずにクライアント側のコードをテストできます。
追伸:あなたはする必要は非常にあなたがPHPからJavaScriptに何かを注入したときにXSSの攻撃ベクトルを意識。それはです非常に適切な値をエスケープするのは難しい、それはコンテキスト依存です。XSSの扱い方がわからない場合、またはXSSに気付いていない場合は、OWASPの記事、この記事、およびこの質問をお読みください。
myPlugin.start(<?=$val?>
意図的なものでしたか?「これは時々うまくいく」というのは本当ですか?