AWS Lambdaで、ヘッドレスChromeを使ってみた（2023/05版）

# はじめに

ヘッドレスChromeをAWS Lambdaで動作可能という事で動かしてみたが、イロイロとハマった事があったので、解決策と対処方法をメモ書きしておきます。

**参考文献：いつもお世話になってます。** 

https://dev.classmethod.jp/articles/run-headless-chrome-puppeteer-on-aws-lambda/

上記を参考にさせて頂きましたが、
chrome-aws-lambdaバージョン: 10.1.0
までバージョンが上がっており、そのままでは動作しなかったので、正常に動作させるにあたって対応が必要だった内容をメモ書きします。
＃ 対応内容については自己責任でお願いします。

# 対応が必要だった事

* makeが通らない（buildに失敗する）
* chrome-aws-lambdaがNode18に対応していない
* Lambdaのお作法の話

# makeが通らない（buildに失敗する）

```javascript
source/hooks/permissions.ts:12:66 - error TS2304: Cannot find name 'DevicePermissionDescriptor'.
12     (Permissions as any).prototype.query = function (parameters: DevicePermissionDescriptor | 
MidiPermissionDescriptor | PermissionDescriptor | PushPermissionDescriptor) {
                                                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~
source/hooks/permissions.ts:12:95 - error TS2304: Cannot find name 'MidiPermissionDescriptor'.
12     (Permissions as any).prototype.query = function (parameters: DevicePermissionDescriptor | MidiPermissionDescriptor | PermissionDescriptor | PushPermissionDescriptor) {
~~~~~~~~~~~~~~~~~~~~~~~~
source/hooks/permissions.ts:12:145 - error TS2304: Cannot find name 'PushPermissionDescriptor'.
12     (Permissions as any).prototype.query = function (parameters: DevicePermissionDescriptor | MidiPermissionDescriptor | PermissionDescriptor | PushPermissionDescriptor) {
                                                  ~~~~~~~~~~~~~~~~~~~~~~~~
source/index.ts:205:17 - error TS2339: Property 'code' does not exist on type 'unknown'.
205       if (error.code !== 'MODULE_NOT_FOUND') {
                    ~~~~
Found 4 errors.
```

make 対象にするソースは、

https://github.com/alixaxel/chrome-aws-lambda/tags

から、10.1.0のtar.gzを取得する。

https://github.com/alixaxel/chrome-aws-lambda/pull/237

https://github.com/alixaxel/chrome-aws-lambda/commit/f9d5a9ff0282ef8e172a29d6d077efc468ca3c76

に、pullリクエストがあがっており、

chrome-aws-lambda-10.1.0直下の、package.jsonの３５行目

```json
  "devDependencies": {
    "@types/node": "^10.17.60",
    "puppeteer-core": "^10.1.0",
    "rimraf": "^3.0.2",
    "typescript": "4.3.2"
  },
```

typescriptのバージョンを下げる事で解消し、make が通るようになりました。

typescriptのバージョンアップによる型変更の影響を受けている模様。。。

# chrome-aws-lambdaがNode18に対応していない

https://github.com/alixaxel/chrome-aws-lambda/pull/274

こちらも上記に、pullリクエストがあがっております。

chrome-aws-lambda-10.1.0\source\index.ts

の、10行目近辺と、168行目近辺に、

```javascript
if (/^AWS_Lambda_nodejs(?:10|12|14)[.]x$/.test(process.env.AWS_EXECUTION_ENV) === true) {
```

と、Lambdaのランタイムのバージョンチェックをしている箇所があるので、

```javascript
if (/^AWS_Lambda_nodejs(?:10|12|14|16|18)[.]x$/.test(process.env.AWS_EXECUTION_ENV) === true) {
```

と、16と18もチェックを通るように追加します。

# Lambdaのお作法の話


https://repost.aws/questions/QU9hDBbz8OTSWY53n5rdL7Wg/questions/QU9hDBbz8OTSWY53n5rdL7Wg/referenceerror-require-is-not-defined-in-es-module-scope-you-can-use-import-instead

Nodejs 14から requireがデフォルトでは利用できなくなった、ということで対処方法がQ&Aされています。

```javascript
import { createRequire } from 'module';
const require = createRequire(import.meta.url);
```

Node.js V18 でLambdaを書いてますが、Lambdaのテンプレートで作成されるindexファイルが、index.js　から、index.mjs に変更されています。（拡張子：js → mjs）

https://docs.aws.amazon.com/ja_jp/lambda/latest/dg/nodejs-handler.html

『CommonJs module handler』 と 『ES module handler』 で書き方が違っていて、拡張子によって、
js → 『CommonJs module handler』
mjs → 『ES module handler』
動作が変わります。

```javascript
import { createRequire } from 'module';
const require = createRequire(import.meta.url);

const chromium = require('chrome-aws-lambda');

export const handler = async (event, context) => {

    const browser = await chromium.puppeteer.launch({
        args: chromium.args,
        defaultViewport: chromium.defaultViewport,
        executablePath: await chromium.executablePath,
        headless: chromium.headless,
    });

    let page = await browser.newPage();

    await page.goto('https://dev.classmethod.jp/');

    const result = await page.title();
    await browser.close();
    return result
};
```

最終的に、参考にさせて頂きましたサンプルソースは、上記のように修正したことで、Node V18の環境で動作することが確認できました。

# 所感
chrome-aws-lambdaのpullリクエストの反映が、だいぶ緩やかになっているかもしれないですね。この先の採用は一考の余地があるかもしれません。

# AWSの相談・お困りごとありましたら、、、

AWSの活用方法や、お困りごとの相談、随時、お仕事の受付しております。

https://www.cs-cloud-aid.com/