サイトのスクリーンショットを自動でtweetする

まず、GCPでサイトのスクリーンショットを作成するwebアプリを作成

Introducing headless Chrome support in Cloud Functions and App Engine | Google Cloud Blog

公式の上記を参照しました。

スクリーンショットの設定には

puppeteerでスクショを撮る時に調べた4つのこと - Qiita

を参照しました。

  const puppeteer = require('puppeteer');
let page;

async function getBrowserPage() {
 // Launch headless Chrome. Turn off sandbox so Chrome can run under root.
 const browser = await puppeteer.launch({args: ['--no-sandbox']});
 return browser.newPage();
}

exports.screenshot = async (req, res) => {
 const url = req.query.url;

 if (!url) {
   return res.send('Please provide URL as GET parameter, for example: <a href="?url=https://example.com">?url=https://example.com</a>');
 }

 if (!page) {
   page = await getBrowserPage();
 }
  
 await page.setViewport( {
           width: 1500,
           height: 750
       } );
 await page.goto(url);
 const imageBuffer = await page.screenshot({fullPage: true } );
 res.set('Content-Type', 'image/png');
 res.send(imageBuffer);
};

公式でのコードをコピペして、スクリーンショットしたいページの大きさに合わせて、viewportを調整しています。

【Google Apps Script】その11　Webサイトのスクリーンショットを定期的にGoogle Driveに保存する - Qiita

を参照してGASでgoogle driveに保存します。

function saveImage() {
 var folderId = 'YOUR_GOOGLE_DRIVE_FOLDER_ID'; // ここに保存先GoogleドライブID
 var today = Utilities.formatDate(new Date(), 'Asia/Tokyo', 'YYYY-MM-dd');
 var requestUrl = 'YOUR_GPC_NEW_URL'; // GCPで生成したスクリーショットを作成するURL
 
try {
   UrlFetchApp.fetch(requestUrl); // ここで1回リクエストを送って画像を作らせる
   Utilities.sleep(1000 * 60); // 画像出来上がるまで1分待機
   var image = UrlFetchApp.fetch(requestUrl).getBlob(); // ここで画像DL
   var folder = DriveApp.getFolderById(folderId);
   folder.createFile(image).setName(today);
 } catch (e) {
   Browser.msgBox(e);
 }
}

IFTTTでgoogle driveとTwitterと連携して、スクリーンショットが保存されたら、tweetされます。