這裡有個小問題，我一直設置的websocket鏈接是127.0.0.1:8000，然後就報錯一直連接不上socket，才知道這個鏈接是要能夠直接訪問到的，和URL一樣，不是服務器內部自己使用的IP，所以使用window.location.host作為地址
<script type="application/javascript">
//terminal
var socket = new WebSocket("ws://"+window.location.host+"/console/ws_console/");
//創建好連接後觸發
socket.onopen = function (event) {
socket.send('balabal');
}
//當websocket接受要服務端發來的信息 會自動觸發這個函數
socket.onmessage = function (event){
console.log('收到'+event.data);
}
function sendMessage(){
let tag = document.getElementById("txt");
socket.send(tag.value);
}
function closeConn() {
socket.close(); //服務端發送斷開請求
}
</script>
這裡面的app都是console，就是自己隨意一個app
安裝一下
pip3 install dwebsocket
配置一下app
INSTALLED_APPS = [
......
'dwebsocket',
]
配置路由urls.py
urlpatterns = [
......
url(r'^ws_console/$',views.wsConsole),
]
配置視圖文件views.py
這裡的裝飾器兩個都可以用，但是如果用require的話，可能會影響正常的HTTP請求
from dwebsocket.decorators import accept_websocket
from dwebsocket import require_websocket
@require_websocket
def wsConsole(request):
if request.is_websocket():
WS=request.websocket
message = WS.wait()
print(message.decode('utf-8'))
WS.send(message)
幾個常用的websocket方法
request.is_websocket（）：判斷請求是否是websocket方式，是返回true，否則返回false
request.websocket： 當請求為websocket的時候，會在request中增加一個websocket屬性，
WebSocket.wait（） 返回客戶端發送的一條消息，沒有收到消息則會導致阻塞
WebSocket.read（） 和wait一樣可以接受返回的消息，只是這種是非阻塞的，沒有消息返回None
WebSocket.count_messages（）返回消息的數量
WebSocket.has_messages（）返回是否有新的消息過來
WebSocket.send（message）像客戶端發送消息，message為byte類型
然後進入頁面以後，在console裡面會看到有輸出，同時會有這麼一個報錯，有可能因為上面的操作是一次性的，執行完以後鏈接就斷開了
(index):361 WebSocket connection to ‘ws://192.168.1.110:8000/console/ws_console/’ failed: Invalid frame header
如果需要持續輸入的話，首先修改一下前端，先變成三個按鈕吧，連接、發送和斷開。同時返回的內容會顯示在p標簽中
前端代碼
//控件
<div>
<input type="text" placeholder="請輸入" id="text">
<input type="button" value="發送" onclick="sendMessage()">
<input type="button" value="關閉" onclick="closeSocket()">
<input type="button" value="鏈接" onclick="connectSocket()">
<p id="result-text">sss</p>
</div>
//script
<script type="application/javascript">
//var socket = new WebSocket("ws://"+window.location.host+"/console/ws_console/");
//創建好連接後觸發
function connectSocket(){
if (window.socket){
alert("鏈接已建立");
return ;
}
var socket = new WebSocket("ws://"+window.location.host+"/console/ws_console/");
socket.onopen = function (event) {
socket.send('balabal');
}
socket.onmessage = function (event){
console.log('收到'+event.data);
}
window.socket=socket;
}
//當websocket接受要服務端發來的信息 會自動觸發這個函數
function sendMessage(){
if (!window.socket){
alert("沒有建立連接，無法發送");
}
socket.send($("#text").val());
}
function closeSocket() {
if (window.socket){
window.socket.close();
console.log("關閉成功");
}
}
</script>
後端修改一下views.py的代碼
就相當於是一直輪詢，接收前端傳來的內容，作為bash命令執行，將結果返回，展示在p標簽裡
import subprocess
@require_websocket
def wsConsole(request):
if request.is_websocket():
for message in request.websocket:
#判斷是否關閉
if not message:
print('關閉了')
else:
Command=message.decode('utf-8')
print(Command)
Result=subprocess.getoutput(Command)
request.websocket.send(Result.encode('utf-8'))
