Powiadomienia Opcje

[DNMX]

Szukam kawalka kodu (AJAX) ktory obsuzy mi powiadomienia na stronie tak, ze bedzie w petli powiedzmy co 5 sekund pobieral plik mojastrona.pl/powiadomienia.txt ktory przykladowo wyglada tak:

alerty:15;powiadomienia:29;

i na widocznym fragmencie strony zmieni odpowiednie numerki

[HTML] pobierz, plaintext 
<span id="alerty" class="badge badge-danger badge-counter">15</span>
....
<span id="pow" class="badge badge-success badge-counter">29</span>
[HTML] pobierz, plaintext 

Z góry dzieki!



Edit: Znalazłem taki fragment kodu:

[HTML] pobierz, plaintext 
 window.addEventListener('load', function()
{
    var xhr = null;
 
    getXmlHttpRequestObject = function()
    {
        if(!xhr)
        {
            // Create a new XMLHttpRequest object.
            xhr = new XMLHttpRequest();
        }
        return xhr;
    };
 
    updateLiveData = function()
    {
        var now = new Date();
        // Date string is appended as a query with live data.
        // for not to use the cached version.
        var url = 'powiadomienia.txt';
        xhr = getXmlHttpRequestObject();
        xhr.onreadystatechange = evenHandler;
        // asynchronous requests
        xhr.open("GET", url, true);
        // Send the request over the network
        xhr.send(null);
    };
 
    updateLiveData();
 
    function evenHandler()
    {
        // Check response is ready or not
        if(xhr.readyState == 4 && xhr.status == 200)
        {
            dataDiv = document.getElementById('alerty');
            // Set current data text
            dataDiv.innerHTML = xhr.responseText;
            // Update the live data every 1 sec
            setTimeout(updateLiveData, 1000);
        }
    }
});
 
[HTML] pobierz, plaintext 

ktory dziala ale nie wiem, jak do spana o id="alerty" wrzucic liczbe 15 a do tego z ID pow 29. Pomozecie?

Ten post edytował DNMX 22.02.2022, 10:47:27

[nospor]

Twoje punkty znajduja sie teraz w responseText.
Uzyj wec np https://developer.mozilla.org/en-US/docs/We...ts/String/split by rozdzielic to po sredniku a potem po dwukropku i masz co chciales.
A nastepnym razem zapisuje dane jako JSON, bedzie prosciej

[DNMX]

Split() zadziałał, dzięki!

[trueblue]

W pliku wynikowym niepotrzebne są informacje "alerty" i "powiadomienia".
Wystarczy postać: 1;2

[DNMX]

Do tego już też doszedłem
A jeszcze chaiłbym, że jeśli liczba alertów będzie większa od 0, to <title> strony zmieni się na "(1) Oryginalny tytuł" a gdy znowu spadnie do 0 to <title> wróci do "Oryginalny tytuł". Czy ktoś poratuje fragmentem kodu również i na to?

[trueblue]

A znasz Google? Pewnie tak...
https://www.google.com/search?q=javascript+meta+tag+title

[DNMX]

W google nie znalazłem gotowca. Zmodyfikowałem trochę swój kod:

[HTML] pobierz, plaintext 
    function evenHandler()
    {
        // Check response is ready or not
        if(xhr.readyState == 4 && xhr.status == 200)
        {
            notifDiv = document.getElementById('pow');
            creditDiv = document.getElementById('alerty');
            // Set current data text
            const not = xhr.responseText.split(';');
            notifDiv.innerHTML = not[0];
<------>    if(not[0] > 0) {
<------><------>document.title = "(" + not[0] + ") " + document.title;
<------>    }
            creditDiv.innerHTML = not[1];
            // Update the live data every 1 sec
            setTimeout(updateLiveData, 1000);
        }
    }
});
[HTML] pobierz, plaintext 

Domniemuję, że powinienem wproawdzić jakąś zmienną w której zapisane jest, ile wynosiła stara wartośc powiadomień i tylko jeśli się różni to ustawiać nowy tytuł na podstawie starego tytułu + nowej ilości powiadomień ale nie potrafię tego zrobić:

[HTML] pobierz, plaintext 
    function evenHandler()
    {
<------>var oldnot = 0;
<------>var oldtitle = document.title;
        // Check response is ready or not
        if(xhr.readyState == 4 && xhr.status == 200)
        {
            notifDiv = document.getElementById('pow');
            creditDiv = document.getElementById('alerty');
            // Set current data text
            const not = xhr.responseText.split(';');
            notifDiv.innerHTML = not[0];
<------>    if(oldnot != not[0]) {
<------><------>document.title = "(" + not[0] + ") " + oldtitle;
<------><------>oldnot = not[0];
<------>    }
            creditDiv.innerHTML = not[1];
            // Update the live data every 1 sec
            setTimeout(updateLiveData, 1000);
        }
    }
});
[HTML] pobierz, plaintext 

Efekt w obu przypadkach jest taki, że co sekundę tytuł zmienia się na:

Kod

(1) tytuł
(1) (1) tytuł
(1) (1) (1) tytuł

itd, itp.

[trueblue]

W jakim celu zapamiętywać poprzednią liczbę powiadomień?
Pobierasz wartość, doklejasz tytuł i wstawiasz.

[DNMX]

Doklaejam ale robi mi sie z tego taki infinite loop. Co robie zle?

[trueblue]

Liczba powiadomień>0 ? Liczba powiadomień + tytuł : Tytuł

[DNMX]

Ten kod działa tak samo: (1) (1) się nawarstwia. Na razie zastosowałem obejście w postaci metatagu zawierającego to samo co tytuł:

[HTML] pobierz, plaintext 
var title = document.querySelector('meta[name="description"]').content;
//Notifications
 if(not[0] > 0) {
document.title = "(" + not[0] + ") " + title;
} else {
document.title = title;
}
[HTML] pobierz, plaintext 

Działa tak jak trzeba bo liczba powiadomień się nie nawarstwia a po odczytaniu znika.

Zastanawiam się, czy tego fragmentu kodu nie można wykorzystać do przekierowania użytkownika do ekranu logowania gdy skońzy mu się sesja? W pliku mojastrona.pl/powiadomienia.txt który nie jest zwykłym .txt a jest interpretowany przez parser PHP, jest warunek, że jeli user niezalogowany zwraca 0. Próbowałem tam dać:

[PHP] pobierz, plaintext 
header("Location /login.php");
[PHP] pobierz, plaintext 

czy też:

[HTML] pobierz, plaintext 
<meta http-equiv="refresh" content="5; URL=https://www.mojastrona.pl/login.php" />
[HTML] pobierz, plaintext 

ale oba powodują tylko to, że zamaist liczby powiadomień wyświetl się "undefined"
Czy można by ten kod wykorzystać również do przekierowania usera do ekranu logowania po wyekspirowaniu sesji?

Ten post edytował DNMX 24.02.2022, 23:22:38