備忘録

備忘録

Puppeteerでレスポンスを書き換える方法

Puppeteer

Ⅰ. はじめに

タイトルの通り「Puppeteerでレスポンスを書き換える方法」です。

Ⅱ. やり方

1. テスト用のサンプルプログラムを書く

index.html

<html>
  <script>
    (async() => {
      let res = await fetch('/get_data.php')
      let json = await res.json()
      // console.log(json)
    })()
  </script>
</html>

get_data.php

<?php
$obj = [
  'name' => 'tanaka',
  'age' => 20
];

echo json_encode($obj);

2. Puppeteerのサンプルプログラムを書く

index.js

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({
    headless: false
  })
  const page = await browser.newPage()

  await page.setRequestInterception(true)
  page.on('request', req => {
    let url = req.url()
    if (url.includes('get_data.php')) {
      req.respond({
        status: 200,
        contentType: 'application/json',
        body: JSON.stringify({
          'name': 'yamada',
          'age': 21
        })
      })
    } else {
      req.continue()
    }
  })

  await page.goto('http://127.0.0.1')

  // browser.close()
})()

実行結果

before	after

参考

https://github.com/GoogleChrome/puppeteer