Bonjour, je suis assez novice en Jquery, j'aimerais afficher cette notifications UNIQUEMENT quand il y a du changement sur la BDD.
Dès qu'il y a une nouvelle entrée, la notification apparait pour une seconde puis disparait jusqu'a qu'il y en ai un nouveau changement en BDD.
Merci à vous !
function autoRefresh_div() {
$("#notifications").fadeIn("slow").load('seevotes.php');
}
setInterval(autoRefresh_div, 1000);
autoRefresh_div();
</script>
<div id="notifications"></div>
Salut, il faudrait un peu plus d'explication stp.
Tu veux dire pour toi en tant qu'admin quelque soit l'endroit ou tu te trouve, si un utilisateur provoque une entrée en BDD tu veux être notifié ?
Tu veux notifier l'utilisateur/toi quand tu/il soumet quelque chose ?
C'est quoi la BDD et le langage utilisé pour le back
Merci de ta réponse.
Non, j'ai un site avec beaucoup d'utilisateurs en fait, et je veux que tout le monde soit notifié lors du changement de la BDD.
Le language est PHP.
Si tu souhaites le faire en jquery/ajax, ce sera pas du realtime ( de ce que j'en sais, peut être que quelqu'un aura un meilleur solution ), mais l'idée est la suivante:
Pour chaque nouvelle entrée un bdd, tu ajoute dans une table notif, les données que tu souhaites afficher ( title, description, date, time )
ainsi, qu'une table te permettant de lier chaque nouvelle entrée notif à t'es user, cela te permet de savoir quel notif à été lu/affiché par tel ou tel utilisateur.
Ensuite un jquery/ajax, tu créer une fonction qui s'execute ttes les X sec et qui va aller interroger ta bdd ( as tu une notif à afficher pour l'utilisateur connecté ? )
Si oui tu créer une nouvelle notification avec l'api Notification https://developer.mozilla.org/fr/docs/Web/API/notification.
Penses aussi à vérifier que les notifications ont bien été accepté dans le navigateur par l'utilisateur.
Un petit exemple de bout de code à adapter à ton projet.
$(document).ready(function() {
checknotif();
setInterval(function(){ checknotif(); }, 10000);
});
function checknotif() {
if (!Notification) {
$('body').append('<h4 style="color:red">*Browser does not support Web Notification</h4>');
return;
}
if (Notification.permission !== "granted")
Notification.requestPermission();
else {
$.ajax({
url : "ajax.php",
type: "POST",
success: function(data, textStatus, jqXHR)
{
const data = jQuery.parseJSON(data);
if(data.result) {
const data_notif = data.notif;
for (let i = data_notif.length - 1; i >= 0; i--) {
let url = data_notif[i]['url'];
let notification = new Notification(data_notif[i]['title'], {
icon: data_notif[i]['icon'],
body: data_notif[i]['msg'],
});
notification.onclick = function () {
window.open(url);
notification.close();
};
setTimeout(function(){
notification.close();
}, 5000);
};
}else{
// DO SOMETHING
}
},
error: function(jqXHR, textStatus, errorThrown) {
// DO SOMETHING
}
});
}
};
Au click sur la notif, tu delete l'entrée de la notif pour l'utilisateur connecté, ca te permet d'avoir uniquement les notifs non lus.
Sinon, si tu veux du realtime, tu vas devoir mettre en place un systeme ( via websocket ou utiliser un système de WebPush type OneSignal (mais payant si tu veux un truc vraiment personnalisable))