Drukowana wersja tematu

Napisany przez: DNMX 22.02.2022, 09:38:32

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:

i na widocznym fragmencie strony zmieni odpowiednie numerki

[HTML] pobierz, plaintext 
<http://december.com/html/4/element/span.html id="alerty" class="badge badge-danger badge-counter">15</http://december.com/html/4/element/span.html>
....
<http://december.com/html/4/element/span.html id="pow" class="badge badge-success badge-counter">29</http://december.com/html/4/element/span.html>
[HTML] pobierz, plaintext 

Z góry dzieki!

https://imgbb.com/

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?

Napisany przez: nospor 22.02.2022, 12:06:48

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

Napisany przez: DNMX 22.02.2022, 12:38:17

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

Napisany przez: trueblue 22.02.2022, 13:23:40

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

Napisany przez: DNMX 22.02.2022, 19:14:00

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?

Napisany przez: trueblue 22.02.2022, 22:18:28

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

Napisany przez: DNMX 24.02.2022, 09:54:46

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:

itd, itp.

Napisany przez: trueblue 24.02.2022, 10:00:43

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

Napisany przez: DNMX 24.02.2022, 10:45:35

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

Napisany przez: trueblue 24.02.2022, 10:47:12

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

Napisany przez: DNMX 24.02.2022, 23:14:56

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 
http://www.php.net/header("Location /login.php");
[PHP] pobierz, plaintext 

czy też:

[HTML] pobierz, plaintext 
<http://december.com/html/4/element/meta.html 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?