ลองคล้ายกันหรือคุณสามารถตรวจสอบบล็อกของฉันเพื่อดูโค้ดตัวอย่างที่สมบูรณ์บน nodejs
ในหน้าของคุณ:
https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js
var ซ็อกเก็ต = io ();
- ใช้
emit
ฟังก์ชันเพื่อส่งข้อมูลไปยังเซิร์ฟเวอร์โหนด
socket.emit ('new_notification', {
ข้อความ: 'ข้อความ',
หัวเรื่อง: 'title',
ไอคอน: 'icon',
});
ตอนนี้รหัสของคุณจะเป็นอย่างไร
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>
var socket = io();
$(document).ready(function($) {
$('.rules-table').on('click', '.runRule', function(event) {
event.preventDefault();
var ruleID = $(this).parents('tr').attr('id');
socket.emit('new_notification', {
message: 'Messge is ready to sent',
title: title,
icon: icon,
});
$.ajax({
url: '/ajax/run-rule.php',
type: 'POST',
dataType: 'json',
data: {
ruleID: ruleID
},
})
.done(function(data) {
console.log(data);
socket.emit('new_notification', {
message: 'Messge was sent',
title: title,
icon: icon,
});
})
.fail(function() {
console.log("error");
socket.emit('new_notification', {
message: 'Messge was failed',
title: title,
icon: icon,
});
})
.always(function() {
console.log("complete");
});
});
});
ตอนนี้ทางฝั่งเซิร์ฟเวอร์ Node สร้างตัวจัดการสำหรับคำขอของคุณเพื่อรับคำขอของคุณและส่งข้อความไปยังอุปกรณ์ / เบราว์เซอร์ที่เชื่อมต่อทั้งหมด (server.js)
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function(req, res) {
res.sendfile('index.html');
});
io.on('connection', function (socket) {
socket.on( 'new_notification', function( data ) {
console.log(data.title,data.message);
io.sockets.emit( 'show_notification', {
title: data.title,
message: data.message,
icon: data.icon,
});
});
});
http.listen(3000, function() {
console.log('listening on localhost:3000');
});
ตอนนี้ฝั่งไคลเอนต์ / เบราว์เซอร์ / ไคลเอนต์สร้างตัวรับเพื่อรับข้อความซ็อกเก็ตจากเซิร์ฟเวอร์โหนด
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>
var socket = io();
socket.on('show_notification', function (data) {
showDesktopNotification(data.title, data.message, data.icon);
});
function setNotification() {
showDesktopNotification('Lokesh', 'Desktop Notification..!', '/index.jpeg');
sendNodeNotification('Lokesh', 'Browser Notification..!', '/index.jpeg');
}
var Notification = window.Notification || window.mozNotification || window.webkitNotification;
Notification.requestPermission(function (permission) {
});
function requestNotificationPermissions() {
if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
});
}
}
function showDesktopNotification(message, body, icon, sound, timeout) {
if (!timeout) {
timeout = 4000;
}
requestNotificationPermissions();
var instance = new Notification(
message, {
body: body,
icon: icon,
sound: sound
}
);
instance.onclick = function () {
};
instance.onerror = function () {
};
instance.onshow = function () {
};
instance.onclose = function () {
};
if (sound)
{
instance.sound;
}
setTimeout(instance.close.bind(instance), timeout);
return false;
}