Node.js/基本範例程式/共筆白板 - 修訂歷史

游士賢：/* Socket.io */

2023-04-18T05:23:25Z

Socket.io

游士賢：/* Socketi.io */

2023-04-18T03:58:30Z

Socketi.io

游士賢：/* 範例二、畫布溝通 */

2023-04-18T02:16:37Z

範例二、畫布溝通

游士賢：/* 範例二、畫布溝通 */

2023-04-18T02:05:59Z

範例二、畫布溝通

游士賢：/* 範例一、應用文字溝通 */

2023-04-18T01:57:19Z

範例一、應用文字溝通

游士賢：/* 範例一、文字溝通應用 */

2023-04-14T07:01:05Z

範例一、文字溝通應用

游士賢：/* 範例一 */

2023-04-14T07:00:52Z

範例一

游士賢：/* 範例 */

2023-04-14T06:58:10Z

範例

游士賢：/* 範例 */

2023-04-14T06:57:54Z

範例

游士賢於 2023年4月14日 (五) 06:55

2023-04-14T06:55:17Z

@@ 第185行： / 第185行： @@
 </pre>
-'''scoket.io.js'''
+'''socket.io.js'''
 <pre>
 //接受、發送訊息
@@ 第230行： / 第230行： @@
 </pre>
-'''scoket.io.js'''
+'''socket.io.js'''
 <pre>
 /* 接受畫布作業訊息 */

@@ 第166行： / 第166行： @@
 *#*:console.log("Server is listening at http://" + ip + ":" + port)：是回調函式中的代碼，印出服務器啟動成功的消息，包括服務器的地址和端口號。
-==Socketi.io==
+==Socket.io==
 #本身是(最基礎)通訊協定，可以實現低延遲、高效率的數據傳輸。
 #讓使用者之間建立溝通管道，讓兩台主機間可以對話。(例如：字串)<br/><img src='http://jendo.org/~游士賢/使用說明/Socketio/Socketio通訊架構.png' width='600px' />

@@ 第207行： / 第207行： @@
 '''A使用者_html'''
 <pre>
 function drawLine(x, y, new_x, new_y)
+{

@@ 第228行： / 第228行： @@
+}
 </pre>
 <pre>
 /* 接受畫布作業訊息 */
-socket.on('draw',function(data)			// 監聽 'draw' 事件，當有使用者在畫板上繪圖時，執行函式。
+socket.on('draw',function(data){		// 監聽 'draw' 事件，當有使用者在畫板上繪圖時，執行函式。
 	/* 將畫布作業訊息傳給其他線上的人 */
 	socket.broadcast.emit('show', data);
 });

@@ 第170行： / 第170行： @@
 #讓使用者之間建立溝通管道，讓兩台主機間可以對話。(例如：字串)<br/><img src='http://jendo.org/~游士賢/使用說明/Socketio/Socketio通訊架構.png' width='600px' />
-===範例一、應用文字溝通===
+===範例一、文字溝通===
 A使用者和B使用者間，利用文字溝通。以下是程式碼解說：<br/>
 '''A使用者_html'''
@@ 第201行： / 第201行： @@
 	document.getElementById('member_msg').innerText += `${data.message}\n`;
 })
 </pre>

@@ 第171行： / 第171行： @@
 ===範例===
-A使用和B使用者間，利用文字溝通。以下是程式碼解說：<br/>
+A使用者和B使用者間，利用文字溝通。以下是程式碼解說：<br/>
 '''A使用者_html'''
 <pre>

←上個修訂		於 2023年4月14日 (五) 06:55 的修訂
第165行：		第165行：
	#:function() {...}：是一個回調函式，當服務器啟動成功後會執行該函式。		#:function() {...}：是一個回調函式，當服務器啟動成功後會執行該函式。
	#:console.log("Server is listening at http://" + ip + ":" + port)：是回調函式中的代碼，印出服務器啟動成功的消息，包括服務器的地址和端口號。		#:console.log("Server is listening at http://" + ip + ":" + port)：是回調函式中的代碼，印出服務器啟動成功的消息，包括服務器的地址和端口號。
		+
		+	==Socketi.io==
		+	#本身是(最基礎)通訊協定，可以實現低延遲、高效率的數據傳輸。
		+	#讓使用者之間建立溝通管道，讓兩台主機間可以對話。(例如：字串)<br/><img src='http://jendo.org/~游士賢/使用說明/Socketio/Socketio通訊架構.png' width='600px' />
		+
		+	===範例===
		+	A使用和B使用者間，利用文字溝通。以下是程式碼解說：<br/>
		+	'''A使用者_html'''
		+	<pre>
		+	//發送訊息函式
		+	function sendMessage(){
		+	let txt = $('#sendtxt').val();
		+	$('#sendtxt').val('');
		+	if(txt){
		+	/觸發 sendMessage 事件/
		+	socket.emit('sendMessage', { message: txt});
		+	}
		+	}
		+	</pre>
		+
		+	'''scoket.io.js'''
		+	<pre>
		+	//接受、發送訊息
		+	socket.on('sendMessage', function(data){
		+	/發送receiveMessage事件/
		+	data.message = socket.name +" 說: "+ data.message;
		+	o.sockets.emit('receiveMessage', data)
		+	})
		+	</pre>
		+
		+	'''B使用者_html'''
		+	<pre>
		+	//接收訊息的反應
		+	socket.on('receiveMessage', function(data){
		+	document.getElementById('member_msg').innerText += `${data.message}\n`;
		+	})
		+	</pre>

Node.js/基本範例程式/共筆白板 - 修訂歷史

游士賢：​/* Socket.io */

游士賢：​/* Socketi.io */

游士賢：​/* 範例二、畫布溝通 */

游士賢：​/* 範例二、畫布溝通 */

游士賢：​/* 範例一、應用文字溝通 */

游士賢：​/* 範例一、文字溝通應用 */

游士賢：​/* 範例一 */

游士賢：​/* 範例 */

游士賢：​/* 範例 */

游士賢 於 2023年4月14日 (五) 06:55

游士賢：/* Socket.io */

游士賢：/* Socketi.io */

游士賢：/* 範例二、畫布溝通 */

游士賢：/* 範例二、畫布溝通 */

游士賢：/* 範例一、應用文字溝通 */

游士賢：/* 範例一、文字溝通應用 */

游士賢：/* 範例一 */

游士賢：/* 範例 */

游士賢：/* 範例 */

游士賢於 2023年4月14日 (五) 06:55