Как отобразить текст на веб-сайте из файла HTML или XML, который обновляется каждый раз - PullRequest
Новая
       10

Как отобразить текст на веб-сайте из файла HTML или XML, который обновляется каждый раз

0 голосов
/ 31 декабря 2018

Я работаю на радио-сайте и для потоковой передачи используется программа Jazler RadioStar 2, которая позволяет постоянно обновлять файлы, передающие информацию, какая песня в данный момент транслируется ..

check image

Меня особенно интересует, как перенести название песни и имя автора на мою домашнюю страницу ..

customexportfile.htm code 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="en-us" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Trenutno Slusate!</title>
</head>

<body>

<p>TNowOnAir: <strong>Cher | Believe</strong>

</body>

</html>

или через XML-файл, NowOnAir.xml 

<Schedule System="Jazler">
<Event status="happening" startTime="09:15:30" eventType="song">
<Announcement Display=""/>
<Song title="Believe">
<Artist name="Cher"> </Artist>
<Jazler ID="6379"/>
<PlayLister ID=""/>
<Media runTime="03:34"/>
<Expire Time="09:19:03"/>
</Song>
</Event>
</Schedule>

Эти файлы автоматически обновляются при изменении композиции в потоке.

Ответы [ 2 ]

0 голосов
/ 31 декабря 2018

нерешительно, вы можете попробовать этот код ...

NB

  1. Существует множество причин, по которым это может не сработать (изс самого начала или позже).
  2. Вы должны обязательно проверить это в среде, где это никого не расстроит, если оно не будет работать.
  3. Решение, приведенное ниже, включает проверку новой песни и названия каждые 5 секунд с использованиемJavascript метод setInterval.Это может быть совершенно неуместным решением, потому что оно будет работать бесконечно каждые 5 секунд.Без дополнительной информации на самом деле невозможно ответить на этот вопрос.
  4. Этот код является непроверенным .

В любом случае, вот решение проблемы:

HTML (домашняя страница): 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta content="en-us" http-equiv="Content-Language" />
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
  <title>Trenutno Slusate!</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>

<p>NowOnAir: 
    <strong>
        <span id="artistName">Cher</span> | 
        <span id="songTitle">Believe</span>
    </strong>
</p>
<script>
    function getNowPlaying() {
        const src = "NowOnAir.xml";
        $.ajax({
            type: 'GET',
            url: src,
            dataType: xml,
            success: function(xml) {

            //parse XML
            const xmlDoc = $.parseXML( xml );
            const $doc = $( xmlDoc );
            const $artist = $doc.find( "Artist" ).attr("name").text();
            const $song = $doc.find( "Song" ).attr("title").text();

            //update homepage
            $("#artistName").text($artist);
            $("#songTitle").text($song);

            },
            error: function(e) {
                console.log(e);
            }
        })
    }

    setInterval( function() {
        getNowPlaying();
    }, 5000);
</script>
</body>

</html>

Если это не сработает, не стесняйтесь комментировать, и я постараюсь помочь.

0 голосов
/ 31 декабря 2018
  1. Создайте текстовый файл в том же каталоге, что и NowOnAir.xml!
  2. Назовите его как filename.html
  3. Введите следующее: 

<!DOCTYPE html>

<html>

<head>
<meta content="en-us" http-equiv="Content-Language" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
</head>

<body onload="refresh()">

<p>Now playing: <span id="art"></span>|<span id="title"></span>

<script>
var interval,time
function refresh(){
    var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("art").innerHTML = this.responseXML.getElementByTagName("ARTIST")[0].getAttribute("name");
            document.getElementById("title").innerHTML = this.responseXML.getElementByTagName("SONG")[0].getAttribute("title");
            time=this.responseXML.getElementByTagName("EXPIRE")[0].getAttribute("Time").split(":")
            interval=setInterval(checkTime,1000)
        }
      };
      xhttp.open("GET", "NowOnAir.xml", true);
      xhttp.send();
    }
}
function checkTime(){
    var date=new Date()
    if(date.getSeconds()==time[2]&&date.getMinutes()==time[1]&&date.getHours()==time[0]){
        clearInterval(interval)
        refresh()
    }
}

</script>
</body>
</html>
Тогда попробуйте (вы найдете это так: http://serveraddress/path/filename.html)

Я надеюсь, что это поможет вам!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Похожие темы

...