Как да създадете приложение за четене на RSS в JavaScript
RSS (наистина проста синдикация) е стандартизиран формат, използван от онлайн издателите за синдикират тяхното съдържание към други уебсайтове и услуги. Една RSS документ, известен също като a фураж, е XML документ носят съдържанието, което издателят желае да разпространява.
RSS емисиите са достъпни на почти всички онлайн новинарски уебсайтове и блогове за техните читатели останете в крак с тяхното съдържание. Те също могат да бъдат намерени на уебсайтове, които не са базирани на текст като YouTube, където можете да използвате емисията на канал в YouTube информирани за последните видеоклипове.
Извикват се програми, които имат достъп до тези канали и четат и показват съдържанието им RSS четци. Можете да създадете проста програма за четене на RSS в JavaScript. В този урок ще видим как да го направим.
Структура на RSS емисия
RSS емисия има корен елемент Наречен , подобно на в HTML документи. Вътре , има a елемент, нещо подобно в HTML, че включва много под-елементи съдържащо разпространеното съдържание на уебсайта.
Фуражът обикновено носи някои основна информация като заглавието, URL адреса и описанието на уебсайта и на отделни актуализирани публикации, статии или друго съдържание на този уебсайт. Тази информация се намира в </code>, <code><link></code>, и <code><description></code> съответно.</p> <p>Когато тези маркери са <strong>директно присъства вътре <code><channel></code></strong>, притежават заглавието, URL адреса и описанието на уебсайта. Когато са <strong>присъства вътре <code><item></code></strong> че <strong>съдържа информация за актуализираните публикации</strong>, те представляват същата информация, както преди, но тази на индивидуалното съдържание, което всяка <code><item></code> представляват.</p> <p>Има и някои <strong>незадължителни елементи</strong> които могат да присъстват в RSS емисия, като осигуряват допълнителна информация като изображения или авторски права върху разпространеното съдържание. Можете да научите за тях в това <strong>Спецификация на RSS 2.0</strong> в cyber.harvard.edu.</p> <p>Ето пример за това как <strong>RSS емисия на уебсайт</strong> може да изглежда така:</p> <pre name="code"> <rss version="2.0"> <channel> <title>Hongkiat https://www.hongkiat.com/ Съвети за проектиране, ръководство и вдъхновенияен-ниВизуализирайте всяка CSS стилова таблица с CSS статистикаЧудили ли сте се колко CSS правила са в стилова таблица? Или някога сте искали да видите ... 18/05/2017 https://www.hongkiat.com/blog/css-stylesheet-with-css-stats/ Amazon Echo Show - Най-новото устройство, управлявано от АлексаAmazon не е непознат на концепцията за интелигентни системи за дома с вграден цифров помощник. Все пак… 17/05/2017 https://www.hongkiat.com/blog/alexa-device-amazon-echo-show/
Извличане на емисията
Ние трябва да донесе фураж с нашата програма за четене на RSS. В уебсайт URL адресът на RSS емисия може да бъде намерени вътре с помощта на прилагане / RSS + XML Тип. Например, ще намерите следната връзка за RSS емисия на Hongkiat.com.
Първо, нека видим как получавате URL адреса на емисията на уебсайт използване на JavaScript.
fetch (websiteUrl) .След това ((res) => res.text ().) ((htmlTxt) => var domParser = нов DOMParser () нека doc = domParser.parseFromString (htmlTxt, 'text / html') feedUrl = doc.querySelector ('връзка [type = "application / rss + xml"]'). href)). catch (() => console.error ("Грешка при извличане на уебсайта"))
Най- донесе () метод е глобален метод, който асинхронно извлича ресурс. URL адресът на ресурса се приема като аргумент (URL на уебсайта в нашия код). То връща a обещание обект, така че когато методът успешно извлича уебсайта (т.е. обещание е изпълнена), първата функция вътре в тогава() изявление обработва изтегления отговор (ВЕИ в горния код).
Полученият отговор е след това напълно чете в текстов низ използвайки текст() метод. Този текст представлява HTML текст на извлечения уебсайт. като донесе (), текст() също връща a обещание обект. Така че, когато успешно създава текст на отговор от потока с отговори, тогава() ще обработи този текст за отговор (htmlText в горния код).
След като HTML текста на уебсайта е наличен, ние използваме API на DOMParser да се анализирайте го в DOM документ. DOMParser анализира XML / HTML текстов низ в DOM документ. Методът му, parseFromString (), отнема два аргумента: текст, който трябва да бъде анализиран и тип съдържание.
След това от създадения DOM документ намери HREF стойност на съответните свободен край използвайки querySelector () метод, за да получите URL адреса на емисията.
Анализиране и показване на емисията
След като получим URL адреса на емисията, трябва извличане и четене на RSS документа на този URL адрес.
fetch (feedUrl) .След това ((res) => res.text ().) ((xmlTxt) => var domParser = нов DOMParser () нека doc = domParser.parseFromString (xmlTxt, 'text / xml') doc forEach ((item) => нека h1 = document.createElement ('h1') h1.textContent = item.querySelector ('title'). textContent document.querySelector ('output'). appendChild (h1))))
По същия начин, както ние извличахме и анализирахме уебсайта, сега ние получавате и анализирате XML канала в DOM документ. За да постигнем това, използваме "Текст / XML" тип съдържание в parseFromString () метод.
В разбрания документ ние изберете всички елементи използвайки querySelectorAll метод и преминава през всяка от тях.
