next.jsアプリケーションをGoogle App Engine上で動かすときにはまったこと

portとhostの設定をちゃんとしなかったのではまりました。
当たり前ですが、本家のドキュメントをちゃんと読みましょうという話。
以下詳細。

構成

api側とフロント側をわけ、api側にはexpress.js、フロント側にはnext.jsを採用しています。

api
├─ src
|   └─ index.js
├─ package.json
└─ app.yaml  

frontend
├─ src
├─ package.json
└─ app.yaml  

api側の設定

/api/src/index.js

const express = require('express');

const app = express();


// Start the server
const PORT = process.env.PORT || 8080;
app.listen(PORT, () => {
  console.log(`App listening on port ${PORT}`);
  console.log('Press Ctrl+C to quit.');
});

/api/package.json

{
  "scripts": {
    "start": "node src/index.js"
  }
}

/api/app.yaml

runtime: nodejs10

api側は特につまるところはなく、基本的な設定でok

frontend(next.js)側

/frontend/package.json

{
  "scripts": {
    "build": "next build",
    "start": "next start -p $PORT"
  }
}

-p $PORT のように環境変数PORTの値を利用するように設定する必要があります。

api側でもちゃんと設定してましたね、、
const PORT = process.env.PORT || 8080;
https://cloud.google.com/appengine/docs/standard/nodejs/how-requests-are-handled?hl=ja

process.env.PORT 変数で指定されるポートをサーバーがリッスンするように設定しています。これは App Engine ランタイムが設定する環境変数です。サーバーは、このポートをリッスンしないとリクエストを受信できません。

---

/frontend/app.yaml

service: frontend
runtime: nodejs10

env_variables:
  HOST: '0.0.0.0'

handlers:
  - url: /.*
    script: auto

アプリで HTTP リクエストを受信するには、start スクリプトでホスト 0.0.0.0 とPORT 環境変数で指定され、Node.js で process.env.PORT としてアクセスできるポートでリッスンするウェブサーバーを起動する必要があります。

ちょっとよくわからない日本語だったので英語で。

For your app to receive HTTP requests, your start script should start a web server that listens on host 0.0.0.0 and the port specified by the PORT environment variable, which is accessible in Node.js as process.env.PORT.

とのことなのでHOSTを0.0.0.0に指定する必要があります。

handlersについてはこちら