BETA

Puppeteerを使ってQrunchへクロス投稿する

投稿日:2020-04-20
最終更新:2020-04-20

QrunchとMediumに技術メモをクロス投稿する - SIS Labで「Qrunchに自動投稿できる仕組みを作る」という課題があったので、Puppeteerで自動投稿できるようにしました。

Qrunch APIみたいなものがないか少し探してみましたが、なさそうだったのでPuppeteerで実装しました。

何の変哲も無く、ただ、Qrunchへログインして投稿するだけです。
ただ、ブログを書いた後に以下の作業を行うのは非常に面倒だったので、Qrunchへの投稿のハードルが低くなりました。

  • Qrunchへログイン
  • Markdownをコピペ
  • Hugo用のShortCodes変換
  • Canonical URLにコピペする
(async () => {  
  const browser = await puppeteer.launch({  
    executablePath: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome',  
    headless: true,  
  });  

  const page = (await browser.pages())[0] || (await browser.newPage());  
  await page.setViewport({ width: 1280, height: 800 });  

  // Login to Qrunch  
  await page.goto('https://qrunch.net/login');  
  await page.type('#login_user_email', QRUNCH_ID);  
  await page.type('#login_user_password', QRUNCH_PW);  
  await page.click('input[type=submit]');  
  await page.waitFor(3000);  

  // Edit new post  
  console.log('start posting');  
  await page.goto('https://qrunch.net/dashboard/entries/edit');  
  await page.type('#entry-title', title);  
  await page.evaluate( (markdown) => {  
    document.querySelector('#edit-box').textContent = markdown;  
  }, markdown);  

  await page.type('input[name=canonical_url]', `${BLOG_URL}blog/${dateformat}/${slug}/`);  
  await page.click('#submit-button-icon');  
  await page.click('div[mode="draft"].submit-mode-child');  
  await page.click('#submit-button-icon');  
  await page.click('#submit-button-text');  

サンプルは、以下のリポジトリをご覧ください。

meganii/puppeteer-qrunch: Auto posting tool for Qrunch

技術ブログをはじめよう Qrunch(クランチ)は、プログラマの技術アプトプットに特化したブログサービスです
駆け出しエンジニアからエキスパートまで全ての方々のアウトプットを歓迎しております!
or 外部アカウントで 登録 / ログイン する
クランチについてもっと詳しく

この記事が掲載されているブログ

@meganiiの技術ブログ

よく一緒に読まれる記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう