Поділіться своїми публікаціями з Medium на вебсайті за допомогою Apps Script та XmlService.

текст перекладу
Це може бути цікаве застосування для будь-якого блогера, який працює з екосистемою Google Workspace або використовує її. У моєму випадку, наприклад, я почав писати статті польською мовою. Однак незабаром стало необхідно писати їх також англійською. Я вважаю, що якщо щось уже зроблено і працює добре, то немає сенсу форсовано відтворювати це самому. Таким чином, я зробив вибір — Medium, саме там я буду публікувати свої ідеї, думки та досвід. Окей, але як я можу відображати ці статті на своєму 🇬🇧 вебсайті без необхідності переписувати їх? Я поставив собі це питання. Відповідь насправді досить проста…

Чи чули ви коли-небудь про RSS-стрічку? Уявіть, що вам подобається стежити за новинами або блогами своїх улюблених джерел. Замість того, щоб постійно перевіряти кожен вебсайт, RSS-стрічка — це як магічна коробка, яка доставляє останні оновлення з усіх цих джерел в одному місці. Подумайте про це як про персоналізовану газету, де ви самі вибираєте, що хочете читати. Це економить час і дозволяє бути в курсі всього, що вас цікавить, без необхідності переглядати кілька сайтів. Ви можете використовувати спеціальні додатки, звані "читачами стрічок", щоб підписуватися на ці стрічки і легко дізнаватися всі новини та статті, які вам цікаві.

У цій статті ми зосередимось на останній частині цього короткого пояснення RSS-стрічки — додатку "читач стрічок". Так ось, саме це я і написав, щоб відображати свої пости з Medium у вигляді красивих карток на своєму вебсайті за допомогою Google Apps Script, HTML, CSS і JavaScript — веб-додаток під назвою "mediumRSS".

pic

Веб-додаток medium RSS

Як бачите, остання стаття зараз стосується анализатора рахунків, але коли ви відкриєте цю сторінку після публікації цієї статті, останньою буде вже ця стаття або навіть інша, якщо я напишу ще одну...

Як це зробити? Це питання. Як я вже сказав, це досить просто. Перш за все, потрібно зрозуміти, як працює XmlService в GAS і як можна використовувати його для отримання потрібних даних з URL вашої стрічки.

Давайте заглянемо за куліси веб-додатку mediumRSS! Він містить всього 2 файли — code.gs та index.html, проект розгорнутий як веб-додаток, доступний для всіх в Інтернеті та завжди виконується від мого імені.

Спробуйте це та досліджуйте можливості Google Apps Script. Повірте чи ні, але це надзвичайно потужний інструмент. Нижче ви можете побачити обидва файли index.html і code.gs.
текст перекладу
Не соромтесь використовувати це у своїх проектах 🚀


















Читати далі     
          ```  ``` function getRSSFeed() {    const feedUrl = "https://medium.com/feed/@mat.krajewski95";    const xmlText = UrlFetchApp.fetch(feedUrl).getContentText("utf-8");    const xmlData = XmlService.parse(xmlText);    const xml_root = xmlData.getRootElement();    const res = [];    const channel = xml_root.getChild("channel");    if (!channel) { console.error(`Invalid feed xml`, { xml_root }); return; }    const items = channel.getChildren("item");    for (let i = 0; i < items.length; i++) {    const itemChildren = items[i].getChildren()    var temp = {};    for (var child of itemChildren) {    temp[child.getName()] = child.getText();    }    res.push(temp);    }    return res;   }      function doGet() {    try {    const items = getRSSFeed();       if (items.length === 0) {    console.log("No items found in the RSS feed...")    return createErrorResponse(204, "No items found in the RSS feed.");    }       const formattedItems = items.map(item => {    const imageUrl = extractImageUrlFromHtml(item.encoded);    const data = {    title: item.title,    link: item.link,    description: removeHtmlTagsAndTruncate(item.encoded),    imageUrl: imageUrl,    pubDate: item.pubDate    };    return data    });       const template = HtmlService.createTemplateFromFile("index");    template.cards = formattedItems;       const output = template.evaluate()    .addMetaTag("viewport", "width=device-width, initial-scale=1.0")    .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)    .setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setTitle("RSS фід Mat's medium")  

 return output;  


 } catch (error) {  
 console.error("Помилка під час отримання/обробки RSS фіду", error);  
 return createErrorResponse(500, `Помилка при отриманні/обробці RSS фіду: ${error.toString()}`);  
 }  
}  

function createErrorResponse(code, message) {  
 return HtmlService.createHtmlOutput(`  

Помилка: ${message}
    `).setSandboxMode(HtmlService.SandboxMode.IFRAME);   }      function formatPublicationDate(dateString) {    if (dateString === "Unknown date") return "Невідомо";    try {    const date = new Date(dateString);    const options = { year: "numeric", month: "long", day: "numeric" };    return date.toLocaleDateString(undefined, options);    }    catch (error) {    console.error("Помилка при форматуванні дати", error)    return "Невідомо";    }   }      function extractImageUrlFromHtml(htmlString) {    try {    const imgTagMatch = htmlString.match(/ 1) {    console.log(imgTagMatch);    return imgTagMatch[1];    }    console.log("Тег img не знайдено...");    return null;    } catch (e) {    console.error(`Помилка під час розбору regex зображення: ${htmlString}, помилка ${e}`);    return null;    }   }      function removeHtmlTagsAndTruncate(htmlString) {    try {    const textOnly = htmlString.replace(/<[^>]*>/g, "");    const decodeHtml = textOnly.replace(/&/g, '&').replace(/ /g, ' ');    const trimmedString = decodeHtml.trim();    if (trimmedString.length <= 200)    return trimmedString;    return trimmedString.substring(0, 200) + "...";    } catch (e) {    console.error(`Помилка під час видалення HTML тегів: ${htmlString} та обтинання: ${e}`);    return null;    }   } ```  Сподіваюся, що це буде корисно! Не соромтесь відвідати мій [вебсайт](https://www.pa-ideas.com/).  Бувайте! 👋🏼



Перекладено з: [Share your medium posts on a website using Apps Script & XmlService](https://medium.com/@mat.krajewski95/share-your-medium-posts-on-a-website-using-apps-script-xmlservice-807b889f9904)

Leave a Reply

Your email address will not be published. Required fields are marked *