AJAXとは何ですか？WordPressでの使用方法（ステップバイステップガイド）
公開: 2021-05-27
AJAXは、Webサイトの開発で使用される一般的なテクノロジーであり、Webページをリロードすることなく、バックエンドからデータを取得してビューを更新できます。 したがって、Webサイトの対話性、速度、および使いやすさを向上させるのに役立ちます。 AJAXは、コメントを残したり、ツイートを投稿したりするなどのアクションを実行するたびに機能します。
この記事では、AJAXとは何か、WordPressでAJAXを使用する方法（WP AJAXとも呼ばれます）について説明します。 読みましょう！
- AJAXとは何ですか？
- AJAXはどのように機能しますか？
- WordPressでAJAXを使用する方法は？
- プラグインはadmin-ajax.phpをどのようにオーバーロードしますか？
- WordPressダッシュボードをスピードアップ
- HeartbeatAPIを使用するプラグインを検出する
AJAXとは何ですか？
AJAXはAsynchronousJavaScript And XMLの略で、サーバーに非同期でリクエストを送信し、ページをリロードせずにページに変更を加えることができるテクノロジーです。 AJAXスクリプトは、サーバーにデータを返すように要求し、取得したデータでWebページを変更します。
たとえば、予約日を選択する1つのドロップダウンメニューと、予約可能な時間を動的に表示する別のドロップダウンリストを想像してみてください。 スクリプトを介して、サーバーは治療ドロップダウンの選択に利用できる時間を求められました。
AJAXはどのように機能しますか？
AJAXの使命は、Webサイトとサーバーの間のブリッジとして機能することです。 この非同期テクノロジーの中核は、データ交換を可能にするXMLHttpRequestオブジェクトです。 AJAX呼び出しを行うための基本的な手順は次のとおりです。
–出典：W3Schools
- 送信する情報を指定します
- 通話を設定する
- XMLHttpRequestオブジェクトを使用してデータを送信します
- サーバーからの応答を受信して処理します
良い点は、jQueryライブラリを使用してこのプロセスを簡略化できることです。
WordPressでAJAXを使用する方法は？
WordPressはAJAXをネイティブにサポートしています。 wp-adminフォルダー内に「admin-ajax.php」が表示されます。
これは当初、WordPress管理者からAJAXリクエストを行うすべての関数用に作成されました。 また、Webの公開部分にも使用されます。
すべてのWordPressAJAXリクエストはPHPスクリプトを経由する必要があります。 つまり、admin-ajax.phpは、コンテンツを返すアクションが呼び出されるPHPファイルである必要があります。
2013年に、WordPressはWordPress Heartbeat APIを導入しました。これは、自動保存機能、ログインの有効期限、別のユーザーがWordPressの投稿を書いたり編集したりしている間の投稿ロック警告など、いくつかの重要な機能を提供します。
HeartbeatAPIの2つの非常に顕著な機能は次のとおりです。
1.自動保存
投稿の下書きを保存するか、作業を続けると、WordPressは自動的に変更を保存します。 自動保存と手動でドラフトを保存することには明らかな違いがあります。 両方のタイプの保存を示す次のスクリーンショットを確認してください。
–WordPressで自動保存
2.ポストロック
別のユーザーがすでに作業している投稿を編集しようとすると、状況に関するポップアップ警告が表示されます。 あなたに見える3つのアクションがあります。
–WordPressのポストロック
上記の機能は、適切な通信と応答のためにサーバーとブラウザーの間に接続を作成するWordPress HeartbeatAPIによって可能になります。
WordPress Heartbeat APIは、サーバーとの通信要求を生成し、データ/応答の受信時にイベントをトリガーします。 これは通常、サーバーの負荷を増加させ、最終的にWordPress管理者の速度を低下させます。
実例
WordPressダッシュボードにログインして、投稿の下書きを開始します。 次に、タブを数分間開いたままにして、他のタブの参照を開始します。 ダッシュボードはまだログインしており、admin-ajaxが継続的にリクエストを送信していることがわかります。
–admin-ajax.phpサーバーへのリクエストの送信
上記のチケットによると、WordPressのadmin-ajax.phpは15秒ごとにリクエストを生成します。 要求は、サーバーとの任意の通信にすることができます。
WordPress管理ダッシュボードはCloudwaysで高速です
3日間の無料トライアルから始めましょう
プラグインはadmin-ajax.phpをどのようにオーバーロードしますか？
WordPressのadmin-ajax.phpの問題のほとんどは、インストールされたプラグインによって行われたリクエストに起因する可能性があります。 これらのプラグインは、ポップアップの起動やソーシャル共有カウンターの更新など、特定の機能を実現するためのリクエストを送信することで、WordPress管理者の速度を低下させます。
とは言うものの、リクエストは必ずしもadmin-ajax.phpファイルを急上昇させるわけではありません。 リクエストが適切に処理され、プラグイン開発者がプラグインでAJAX呼び出しを利用する際のベストプラクティスに従っている場合、admin-ajax.phpファイルで問題ありません。 したがって、プラグインを非アクティブ化する前に、プラグインを診断することも重要です。
WordPressでプラグインを診断する方法は？
admin-ajax.phpファイルへの影響を特定するために、プラグインを適切に診断することが重要です。これにより、WordPressの管理が遅くなる可能性があります。 そのために、GTmetrixとWebPageTestの2つのツールを使用します。
GTmetrixの場合、リクエストの完全なリストについては、[ウォーターフォール]タブに移動してください。 リストをよく見ると、admin-ajax.phpファイルによって行われたPOSTリクエストを確認できます。
–WordPressでのプラグイン診断
私の場合、これらのリクエストは主にソーシャル共有プラグインによって行われました。 この特定のプラグインは、更新された共有カウントを取得するために、15秒ごとにAPIを介してソーシャルメディアアカウントにajaxリクエストを送信します。
詳細については、タブを展開してください。 [応答]タブには、これらの要求をトリガーする正確な場所が表示されます。
Chromeには、さまざまなプラグインからのリクエストの分析に役立つ開発者ツールが付属しています。 これを確認するには、Chromeでウェブサイトを開き、CTRL + Shift + Iをクリックして、[ネットワーク]タブをクリックします。
–Chromeでのadmix-ajax.phpリクエスト
ページをリロードして、更新されたリクエストがリストに入力されていることを確認します。 フィルタボックスにajaxまたはadmin-ajaxと入力して、必要なファイルをフィルタリングします。 これにより、リクエストの数、頻度、リクエストのソースについての洞察が得られます。
次に、ファイルをクリックして詳細情報を表示します。 [応答]タブでは、このリクエストを引き起こしているプラグインのヒントが表示されます。 私の場合、今回はWP Popularプラグイン（WPP）によってトリガーされました。これは、特定の期間で最も人気のある投稿を強調表示するプラグインです。
これを回避するには、使用しているプラグインが更新されていることを確認してください。 そうでない場合は、開発者が問題を修正できるように、サポートチケットを開いてみてください。 可能であれば、admin-ajax.phpファイルをオーバーロードしない更新された別のプラグインに置き換えることもできます。
一部のプラグインはWordPressサイトにとって重要であるため、プラグインを削除する前に徹底的な診断を実行することが重要です。 これらのツールは、根本原因を見つけて、それを修正するための最善の解決策を選択するのに役立ちます。
次のセクションでは、これらのリクエストを減らし、admin-ajax.phpファイルが過負荷になるのを防ぐ方法を説明します。
WordPressダッシュボードをスピードアップ
WordPressバックエンドを高速化するには、Heartbeat APIを無効にするか、少なくとも数秒ごとにサーバーにヒットしないように、より長い時間間隔を設定するのが最善の方法です。
HeartbeatControlプラグインをインストールする
–ハートビート制御プラグイン
WordPress管理ダッシュボードにログインします。 プラグイン→新規追加に移動します。 ハートビートコントロールを検索します。 インストールしてアクティブ化します。
–WordPressにハートビートコントロールをインストールする
ハートビート制御プラグインを構成する
[設定]→[ハートビート制御設定]に移動します。 プラグインを構成するための3つのドロップダウンメニューがあります。
1.ハートビートを許可する
HeartbeatAPIが機能する領域を選択できます。 選択できるオプションは3つあります。
- WordPressダッシュボード：これにより、WordPressダッシュボードのHeartbeatAPIが有効になります。
- フロントエンド：これにより、フロントエンドでAPIが有効になります。
- 投稿エディター：自動保存および投稿ロック機能でHeartbeat APIを有効にする場合は、このチェックボックスをオンにします。
–ハートビート制御のハートビートを許可する
2.ハートビートを無効にします
WordPress Heartbeat APIで特定の場所を無効にする場合は、これを選択します。 他のプラグインもWordPressHeartbeat APIを使用している可能性があるため、場所を選択する際は注意してください。 あなたがWordPressバックエンドの唯一のユーザーである場合は、どこでもそれを無効にしてから、それがWebサイトを壊していないかどうかを確認することをお勧めします。
ただし、サイトに定期的に投稿するユーザーが複数いる場合は、編集後のページでのみHeartbeatAPIを許可することをお勧めします。
–ハートビート制御でハートビートを無効にする
3.ハートビートを変更します
このドロップダウンでは、admin-ajaxリクエストを実行するための時間間隔を0〜300秒の範囲で設定できます。 120秒に設定すると、120秒ごとにリクエストが生成されます。 これにより、サーバーの負荷が大幅に軽減されます。 必要に応じて調整してください。
–ハートビートコントロールでハートビートを変更する
複数のルールを作成する
要件に基づいて複数のルールを作成できます。 たとえば、WordPressダッシュボードを120秒でトリガーし、投稿エディターを60秒でトリガーしたい場合があります。 これを行うには、2つのルールを作成する必要があります。1つはWordPressダッシュボード用で、もう1つは投稿エディター用です。 それらの周波数をそれぞれ120と60に設定します。
HeartbeatAPIを使用するプラグインを検出する
すべての設定が完了したので、次は、admin-ajax.phpファイルを使用してWebサイトの速度を低下させているプラグインを確認します。
GTmetrixに移動し、サイトのURLを入力します。 サイトの分析には少し時間がかかります。 完了したら、[ウォーターフォール]タブに移動すると、ファイルが接続して応答するのにかかる時間が表示されます。 少し下にスクロールして、POSTadmin-ajax.phpのエントリがあるかどうかを確認します。 はいの場合は、展開して[投稿]タブに移動します。 ここから、原因のプラグインを特定できます。
私の場合、プラグイン「デスクトップスイッチ」はadmin-ajax.phpファイルを使用しており、サーバーにリクエストを継続的に送信しています。 これは決定を下す時です。 別のプラグインに置き換えるか、指を交差させてください。
– POST admin-ajax.php
概要
その機能セットを考慮すると、HeartbeatAPIはWordPressWebサイトで非常に役立ちます。 ただし、正しく使用しないと、WordPress Ajaxリクエストを送受信することで、WordPressバックエンドとフロントエンドの読み込み時間が長くなる可能性があります。
この問題に対する解決策は2つだけです。 Heartbeat APIを無効にするか、いくつかの場所でのみ有効にすることができます。または、リクエストの負荷を処理し、サーバーの応答時間を短縮できるマネージドホスティングにアップグレードできます。