検索
ホームページバックエンド開発Python チュートリアルDjango での Websocket の使用の詳細な説明

1. Websocket の概要

インターネットの発展に伴い、従来の HTTP プロトコルでは、ますます複雑になる Web アプリケーションのニーズを満たすことが困難になってきました。近年、HTML5の誕生により、ブラウザとサーバー間の全二重通信を実現し、ブラウザとサーバー間の通信機能を拡張し、サーバーからサーバーへ能動的にデータを送信できるWebSocketプロトコルが提案されました。クライアント。
従来の HTTP プロトコルはステートレスであることがわかっています。各リクエスト (リクエスト) はクライアント (ブラウザーなど) によってアクティブに開始される必要があり、サーバーがリクエストをアクティブに送信するのは困難です。クライアントにデータを送信します。クライアントがアクティブなパーティでサーバーがパッシブなパーティとなるこの従来の Web モデルでは、情報が頻繁に変更されない Web アプリケーションでは問題が発生しませんが、実際のデータが関与する Web アプリケーションでは多大な問題が発生します。インスタント メッセージング、リアルタイム データ、サブスクリプション プッシュ、その他の機能を備えたアプリケーションなどの不便な時間情報。 WebSocket 仕様が提案される前、開発者は、ポーリングや Comet テクノロジなどのリアルタイム機能を実装するために妥協的な解決策を使用することがよくありました。実際、後者は本質的に一種の投票ですが、改良されています。
ポーリングは、リアルタイム Web アプリケーションを実装するための独自のソリューションです。ポーリング テクノロジでは、クライアントが設定された間隔で定期的にリクエストをサーバーに送信し、新しいデータ変更があるかどうかを頻繁にクエリする必要があります。明らかに、このアプローチでは不要なリクエストが多すぎて、トラフィックとサーバー リソースが浪費されます。
Comet テクノロジーは、ロングポーリングテクノロジーとストリーミングテクノロジーに分類できます。ロングポーリングは上記のポーリング技術を改善し、無駄なリクエストを減らします。特定のデータに有効期限を設定し、データの有効期限が切れた場合にのみサーバーにリクエストを送信します。このメカニズムは、データの変更が特に頻繁ではない状況に適しています。ストリーミング テクノロジは、通常、クライアントが非表示のウィンドウを使用してサーバーとの長い HTTP 接続を確立し、HTTP の長い接続を維持するために接続ステータスを継続的に更新することを意味します。この場合、サーバーはこの長い接続を通じてデータをアクティブに転送できます。接続がクライアントに送信されます。ストリーミング テクノロジは、大規模な同時実行環境でのサーバーのパフォーマンスをテストする場合があります。
これら 2 つのテクノロジーはリクエスト/レスポンス モデルに基づいており、どちらも本当の意味でのリアルタイム テクノロジーではありません。それぞれのリクエストとレスポンスが同じヘッダー情報に一定量のトラフィックを浪費し、開発の複雑さも異なります。比較的大きい。
HTML5 での WebSocket の開始により、Web 上でのリアルタイム通信が真に実現され、B/S モードが C/S モードのリアルタイム通信機能を持つことが可能になりました。 WebSocket のワークフローは次のとおりです。ブラウザは、JavaScript を介して WebSocket 接続を確立するリクエストをサーバーに送信します。WebSocket 接続が正常に確立されると、クライアントとサーバーは TCP 接続を介してデータを送信できるようになります。 WebSocket 接続は本質的に TCP 接続であるため、送信ごとにヘッダー データを繰り返す必要がないため、データ送信量はポーリングや Comet テクノロジーよりもはるかに小さくなります

2. dwebsocket をインストールします

インストール方法:

。 1. pip

pip install  dwebsocket2

を通じて 2. ローカルにダウンロードして

「解凍」し、python setup.py install を実行します

添付ファイル: インストールが失敗し、ASCII コードに関するプロンプトが表示される場合は、readme の内容を削除してください。

3.

の使用方法 websocket 接続を別のビューに処理したい場合は、標準の HTTP リクエストをビューにルーティングする accept_websocket デコレーターを使用できます。 require_websocke デコレータ を使用すると、WebSocket 接続のみが許可され、通常の HTTP リクエストは拒否されます。

設定にMIDDLEWARE_CLASSES=dwebsocket.middleware.WebSocketMiddleware設定を追加しますこれにより、個別のビューwebsocketの使用が拒否され、accept_websocketデコレータを追加する必要があります。

WEBSOCKET_ACCEPT_ALL=Trueを設定すると、各ビューでwebsocket

一部のメソッドとプロパティ

1.request.is_websocket()

WebSocketリクエストの場合はTrueを返し、通常のhttpリクエストの場合はTrueを返すことができます。 return Fal se、この方法で区別できます。

2.request.websocket

在一个websocket请求建立之后,这个请求将会有一个websocket属性,用来给客户端提供一个简单的api通讯,如果request.is_websocket()是False,这个属性将是None。

3.WebSocket.wait()

返回一个客户端发送的信息,在客户端关闭连接之前他不会返回任何值,这种情况下,方法将返回None

4.WebSocket.read()

 如果没有从客户端接收到新的消息,read方法会返回一个新的消息,如果没有,就不返回。这是一个替代wait的非阻塞方法

5.WebSocket.count_messages()

 返回消息队列数量

6.WebSocket.has_messages()

 如果有新消息返回True,否则返回False

7.WebSocket.send(message)

 向客户端发送消息

8.WebSocket.__iter__()

 websocket迭代器

四、干货

功能:让我们从客户端接收一条消息,将该消息发送回客户端并关闭连接。

1.新建一个django项目

Django での Websocket の使用の詳細な説明

2.新建index.html在templates文件夹下,编写我们的客户端

<!DOCTYPE html>
<html>
<head>
    <title>django-websocket</title>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">//<![CDATA[
    $(function () {
        $(&#39;#send_message&#39;).click(function () {
            var socket = new WebSocket("ws://" + window.location.host + "/echo_once");
            socket.onopen = function () {
                console.log(&#39;WebSocket open&#39;);//成功连接上Websocket
                socket.send($(&#39;#message&#39;).val());//发送数据到服务端
            };
            socket.onmessage = function (e) {
                console.log(&#39;message: &#39; + e.data);//打印服务端返回的数据
                $(&#39;#messagecontainer&#39;).prepend(&#39;<p>&#39; + e.data + &#39;</p>&#39;);
            };
        });
    });
    //]]></script>
</head>
<body>
<br>
<input type="text" id="message" value="Hello, World!"/>
<button type="button" id="send_message">发送 message</button>
<h1 id="Received-nbsp-Messages">Received Messages</h1>
<div id="messagecontainer">

</div>
</body>
</html>

3.app的views.py编写我们的服务端

from dwebsocket import require_websocket
@require_websocketdef echo_once(request):
    message = request.websocket.wait()
    request.websocket.send(message)

4.url路由设置

from demo import views as v
urlpatterns = [
    url(r'^index/', v.index),
    url(r'^echo_once', v.echo_once),
]

5.runserver运行,效果展示

Django での Websocket の使用の詳細な説明

可以看到,当我们点击按钮之后,服务端发送消息到客户端之后,就自动关闭了连接。

当然,我们也可以让服务端不自动关闭连接,接下来利用websocket和http Get写一个一样的功能的函数,

6.新建一个html,写一个新的客户端

<!DOCTYPE html>
<html>
<head>
    <title>django-websocket</title>
    <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">//<![CDATA[
    $(function () {
        $(&#39;#connect_websocket&#39;).click(function () {
            if (window.s) {
                window.s.close()
            }
            /*创建socket连接*/
            var socket = new WebSocket("ws://" + window.location.host + "/echo");
            socket.onopen = function () {
                console.log(&#39;WebSocket open&#39;);//成功连接上Websocket
            };
            socket.onmessage = function (e) {
                console.log(&#39;message: &#39; + e.data);//打印出服务端返回过来的数据
                $(&#39;#messagecontainer&#39;).prepend(&#39;<p>&#39; + e.data + &#39;</p>&#39;);
            };
            // Call onopen directly if socket is already open
            if (socket.readyState == WebSocket.OPEN) socket.onopen();
            window.s = socket;
        });
        $(&#39;#send_message&#39;).click(function () {
            //如果未连接到websocket
            if (!window.s) {
                alert("websocket未连接.");
            } else {
                window.s.send($(&#39;#message&#39;).val());//通过websocket发送数据
            }
        });
        $(&#39;#close_websocket&#39;).click(function () {
            if (window.s) {
                window.s.close();//关闭websocket
                console.log(&#39;websocket已关闭&#39;);
            }
        });

    });
    //]]></script>
</head>
<body>
<br>
<input type="text" id="message" value="Hello, World!"/>
<button type="button" id="connect_websocket">连接 websocket</button>
<button type="button" id="send_message">发送 message</button>
<button type="button" id="close_websocket">关闭 websocket</button>
<h1 id="Received-nbsp-Messages">Received Messages</h1>
<div id="messagecontainer">

</div>
</body>
</html>

7.在viws.py中加入新的方法

from django.shortcuts import render
from dwebsocket.decorators import accept_websocket,require_websocket
from django.http import HttpResponse


@accept_websocket
def echo(request):
    if not request.is_websocket():#判断是不是websocket连接
        try:#如果是普通的http方法
            message = request.GET[&#39;message&#39;]
            return HttpResponse(message)
        except:
            return render(request,&#39;index.html&#39;)
    else:
        for message in request.websocket:
            request.websocket.send(message)#发送消息到客户端

8.url.py

from demo import views as v
urlpatterns = [
    url(r&#39;^index2/&#39;, v.index2),
    url(r&#39;^echo$&#39;, v.echo),
]

9.runserver运行,看看效果

Django での Websocket の使用の詳細な説明

可以看到,只有当我们手动关闭连接时候,websocket才会关闭。

以上がDjango での Websocket の使用の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
Pythonアレイに要素をどのように追加しますか?Pythonアレイに要素をどのように追加しますか?Apr 30, 2025 am 12:19 AM

inpython、youappendelementStoalistusingtheappend()method.1)useappend()forsingleelements:my_list.append(4).2)useextend()or = formultipleElements:my_list.extend(another_list)ormy_list = [4,5,6] .3)forspecificpositions:my_list.insert(1,5).beaware

シバン関連の問題をどのようにデバッグしますか?シバン関連の問題をどのようにデバッグしますか?Apr 30, 2025 am 12:17 AM

シェバンの問題をデバッグする方法には次のものがあります。1。シバン行をチェックして、それがスクリプトの最初の行であり、接頭辞スペースがないことを確認します。 2.通訳パスが正しいかどうかを確認します。 3.通訳を直接呼び出してスクリプトを実行して、シェバンの問題を分離します。 4. StraceまたはTrustsを使用して、システムコールを追跡します。 5.シバンに対する環境変数の影響を確認してください。

Pythonアレイから要素をどのように削除しますか?Pythonアレイから要素をどのように削除しますか?Apr 30, 2025 am 12:16 AM

pythonlistscanbemanipulatedsingseveralmethodstoremoveElements:1)theremove()methodremovesthefirstoccurrenceofaspecifiedValue.2)thepop()methop()methodremovessanelementatagivenindex.3)thedelstatementementementementementementementementementemoritemoricedex.4)

Pythonリストに保存できるデータ型は何ですか?Pythonリストに保存できるデータ型は何ですか?Apr 30, 2025 am 12:07 AM

Integers、strings、floats、booleans、otherlists、anddictionaryを含むpythonlistscanstoreanydatype

Pythonリストで実行できる一般的な操作は何ですか?Pythonリストで実行できる一般的な操作は何ですか?Apr 30, 2025 am 12:01 AM

PythonListsSupportNumersoperations:1)AddingElementSwithAppend()、Extend()、Andinert()

numpyを使用してマルチディメンシャルアレイをどのように作成しますか?numpyを使用してマルチディメンシャルアレイをどのように作成しますか?Apr 29, 2025 am 12:27 AM

Numpyを使用して多次元配列を作成すると、次の手順を通じて実現できます。1)numpy.array()関数を使用して、np.array([[1,2,3]、[4,5,6]])などの配列を作成して2D配列を作成します。 2)np.zeros()、np.ones()、np.random.random()およびその他の関数を使用して、特定の値で満たされた配列を作成します。 3)アレイの形状とサイズの特性を理解して、サブアレイの長さが一貫していることを確認し、エラーを回避します。 4)np.reshape()関数を使用して、配列の形状を変更します。 5)コードが明確で効率的であることを確認するために、メモリの使用に注意してください。

Numpyアレイの「ブロードキャスト」の概念を説明します。Numpyアレイの「ブロードキャスト」の概念を説明します。Apr 29, 2025 am 12:23 AM

BroadcastinginNumPyisamethodtoperformoperationsonarraysofdifferentshapesbyautomaticallyaligningthem.Itsimplifiescode,enhancesreadability,andboostsperformance.Here'showitworks:1)Smallerarraysarepaddedwithonestomatchdimensions.2)Compatibledimensionsare

データストレージ用のリスト、array.array、およびnumpy配列を選択する方法を説明します。データストレージ用のリスト、array.array、およびnumpy配列を選択する方法を説明します。Apr 29, 2025 am 12:20 AM

Forpythondatastorage、chooseLists forfficability withmixeddatypes、array.arrayformemory-efficienthogeneousnumericaldata、およびnumpyArrays foradvancednumericalcomputing.listSareversatilebuteficient efficient forlargeNumericaldatates;

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

EditPlus 中国語クラック版

EditPlus 中国語クラック版

サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。