HTML5 SSEを使用する場合、再接続とエラーに対処する方法には次のものが含まれます。1。デフォルトの再接続メカニズムを理解します。 EventSourceは、デフォルトで接続が中斷されてから3秒後に再試行します。再試行フィールドを介して間隔をカスタマイズできます。 2.接続障害または解析エラーに対処するためのエラーイベントを聞いて、エラータイプを區(qū)別し、自動再接続に依存するネットワークの問題、サーバーエラーが手動で再接続を遅らせる、認証障害の更新トークンなど、対応するロジックを?qū)g行します。 3.接続を手動で閉じて再構築するなど、再接続ロジックを積極的に制御し、再試行時間の最大數(shù)を設定し、Navigatorを組み合わせてネットワークステータスを判斷して再試行戦略を最適化します。これらのメジャーは、アプリケーションの安定性とユーザーエクスペリエンスを改善できます。

HTML5サーバーセントイベント（SSE）を使用する場合、再接続とエラーの処理がアプリケーションの安定性を確保するための鍵です。ブラウザはデフォルトで自動的に再接続しようとしますが、特にネットワークが不安定な場合やサーバー側のエラーがある場合、デフォルトのメカニズムでは十分ではありません。私たちは斷層の耐性を高めるために積極的に介入する必要があります。

SSEのデフォルトの再接続メカニズムを理解します

接続が中斷されると、EventSourceオブジェクトは自動的に再接続を試みます。デフォルト間隔は3秒です。今回は、サーバーの応答でretry:フィールドを送信することでカスタマイズできます。例えば：

再試行：5000

これにより、ブラウザは次の再試行の前に5000ミリ秒（つまり5秒）を待つように指示されます。設定されていない場合、ブラウザはデフォルト値を使用します。

この再接続メカニズムは、短期ネットワーク切斷やサービスの再起動など、サーバーが「一時的に利用できない」狀況に適していることに注意する必要があります。ただし、サーバーがHTTPエラー（4xxや5xxなど）を返す場合、ブラウザは自動的に再試行せず、現(xiàn)時點では手動で処理する必要があります。

エラーイベントを聞いて応答します

SSEは、接続障害、解析エラーなどをキャプチャできるerrorイベントを提供します。ブラウザは場合によっては自動的に再接続されますが、重大なエラーが発生したときに試してみるのが停止する場合があります。したがって、 errorイベントを聞いて適切に応答することが非常に重要です。

このようなリスナーを追加できます：

 const eventsource = new EventSource（ 'Your-endpoint'）;

eventsource.addeventlistener（ 'error'、（err）=> {
  console.error（ 'SSEエラー：'、err）;
  //カスタム再接続ロジックはここでトリガーできます}）;

このコールバックでは、通常、エラータイプを判斷する必要があります。例えば：

• それがネットワークの問題である場合、ブラウザの自動再接続に依存し続けます。
• サーバーエラー（500の返品など）の場合、遅延後に接続の手動再構築が必要になる場合があります。
• 認証障害などの問題がある場合は、最初にトークンを更新してから再接続する必要がある場合があります。

ここでは、共通の再接続戦略を追加できます。

• 障害の數(shù)を記録します。
• 再試行時間の最大數(shù)を設定します。
• 上限に達した後、ユーザーはネットワークを確認するか、システム管理者に通知するように求められます。

再接続ロジックを積極的に制御して、信頼性を向上させます

時には、再接続動作をより注意深く制御したいと考えています。たとえば、ネットワークの復元後に接続を積極的にトリガーするか、サービスステータスに基づいてポーリングを継続するかどうかを決定します。

一般的な慣行は、エラーが検出された後、現(xiàn)在の接続を手動で閉じて、新しいEventSourceインスタンスを作成することです。

 retrycount = 0とします。
const maxretries = 5;

eventsource.addeventlistener（ 'error'、（）=> {
  if（retrycount <maxretries）{
    setimeout（（）=> {
      eventsource.close（）;
      const neweventsource = new eventsource（ &#39;your-endpoint&#39;）;
      //リバウンドイベントリスナー...
      retrycount;
    }、5000）; // custom retry interval} else {
    console.log（ &#39;再試行の數(shù)が上限に達した&#39;）;
  }
}）;

さらに、Navigator.onlineを使用して、現(xiàn)在オンラインであるかどうかを判斷することもできます。オフラインの場合は、一時停止して再試行して、ネットワークを復元した後も試してみてください。

基本的にそれだけです

SSEの再接続とエラーを処理するコアは、ブラウザのデフォルト動作を理解し、それに基づいて獨自のロジックを補完することです。再試行時間の設定、エラーイベントの聴取、カスタム再試行メカニズムの実裝などにより、接続の安定性とユーザーエクスペリエンスを改善できます。複雑ではないように見えますが、わずかな過失によりメッセージが失われたり、接続が詰まったりする可能性があります。

以上がHTML5サーバーセントイベントでの再接続とエラーの処理。の詳細內(nèi)容です。詳細については、PHP 中國語 Web サイトの他の関連記事を參照してください。