Nodeに基づいてwebsocketを用いてデータプッシュを行う.
WebSocketは、HTML 5が提供し始めた単一のTCP接続上でフルデュプレクス通信を行うプロトコルである.
WebSocketは、クライアントとサーバ間のデータ交換をより簡単にし、サービス側がクライアントにデータを積極的にプッシュできるようにします.WebSocket APIでは、ブラウザとサーバが握手を1回完了するだけで、両者の間に永続的な接続を直接作成し、双方向のデータ転送を行うことができます.
WebSocket APIでは、ブラウザとサーバが握手をするだけで、ブラウザとサーバの間に高速チャネルが形成されます.両者の間で直接データを互いに転送することができる.
Websocketについて全く知らない場合は、菜鳥チュートリアルを見てみましょう.https://www.runoob.com/html/html5-websocket.html
小さなdemoを作ってプレゼンテーションしましょう
1.htmlファイルを新規作成するには:
2.nodeを使用する.jsのexpressは簡単にバックグラウンドサービスをかけて、severのようなjsファイルを新規に作成します.js
1). ws$npm i ws-Sのインストール
2).インストールexpress$npm i express-S
ブラウザを開くとデータが受け入れられ、バックグラウンドで必要なデータが返されます.
転載先:https://www.cnblogs.com/0314dxj/p/11251488.html
WebSocketは、クライアントとサーバ間のデータ交換をより簡単にし、サービス側がクライアントにデータを積極的にプッシュできるようにします.WebSocket APIでは、ブラウザとサーバが握手を1回完了するだけで、両者の間に永続的な接続を直接作成し、双方向のデータ転送を行うことができます.
WebSocket APIでは、ブラウザとサーバが握手をするだけで、ブラウザとサーバの間に高速チャネルが形成されます.両者の間で直接データを互いに転送することができる.
Websocketについて全く知らない場合は、菜鳥チュートリアルを見てみましょう.https://www.runoob.com/html/html5-websocket.html
小さなdemoを作ってプレゼンテーションしましょう
1.htmlファイルを新規作成するには:
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>websokettitle>
<style>
style>
head>
<body>
<script>
let ws = new WebSocket('ws://localhost:8888');
// onopen
ws.onopen = function () {
ws.send(' ');
};
// onmessage ,
ws.onmessage = function (res) {
console.log(res);
// MessageEvent
// res.data
};
script>
body>
html>
2.nodeを使用する.jsのexpressは簡単にバックグラウンドサービスをかけて、severのようなjsファイルを新規に作成します.js
1). ws$npm i ws-Sのインストール
2).インストールexpress$npm i express-S
const express = require('express');
const app = express();
//
app.use(express.static(__dirname));
app.listen(3000); // localhost:3000
//=============================================
// websocket
const Server = require('ws').Server;
const ws = new Server({ port: 8888 });
//
ws.on('connection', function(socket) {
//
socket.on('message', function(msg) {
console.log(msg); //
});
});
ブラウザを開くとデータが受け入れられ、バックグラウンドで必要なデータが返されます.
転載先:https://www.cnblogs.com/0314dxj/p/11251488.html