App Engine Flex环境下前端与GRPC API通信故障排查求助

本文底部有更新，找到解决方案后将重新整理内容。

我正在尝试让运行在Nginx容器中的Vue.js前端项目与GRPC Go API应用建立通信。访问前端URL https://view-dot-casestudy2108.ue.r.appspot.com/ 可以正常看到网页，但点击按钮后无法显示API返回的静态文本内容。

已执行的调试操作 #

• 在App Engine中启用调试模式：

  gcloud app --project PROJECT-ID instances enable-debug
  

• 从view容器调用API时请求一直挂起，执行命令：

  curl -L api-dot-casestudy2108.ue.r.appspot.com:8081/v1/test
  

View服务配置 #

app.yaml 配置 #

runtime: custom
env: flex
service: view
automatic_scaling:
    min_num_instances: 1
    max_num_instances: 2
    cool_down_period_sec: 180
    cpu_utilization:
        target_utilization: 0.5
resources:
    cpu: 1
    memory_gb: 0.5
    disk_size_gb: 10
env_variables:
    API_HOST: "api-dot-casestudy2108.ue.r.appspot.com"

Nginx上游配置 #

upstream api {
    server ${API_HOST}:8081;
 }

环境变量验证结果 #

在view容器内已确认环境变量设置正确：

/etc/nginx # echo $API_HOST
api-dot-casestudy2108.ue.r.appspot.com

API服务配置（app.yaml） #

runtime: go
env: flex
service: api
automatic_scaling:
    min_num_instances: 1
    max_num_instances: 2
    cool_down_period_sec: 180
    cpu_utilization:
        target_utilization: 0.5
resources:
    cpu: 1
    memory_gb: 0.5
    disk_size_gb: 10
env_variables:
    HTTP_PORT: 8081
    GRPC_PORT: 8082
network:
    forwarded_ports:
      - 8081
      - 8081:8081/tcp # grpc gateway port
      - 8082
      - 8082:8082/tcp # grpc port

更新1 #

添加了dispatch.yaml文件并放在view服务目录下，api目录中无此文件，配置内容：

dispatch:
    - # api traffic
    - url: "*/v1/*"
      service: api
      # send all other traffic to default service
    - url: "*/.*"
      service: default

但配置后仍无效果，不确定该文件是否会被自动检测并应用。

更新2 #

在控制台执行端口监听状态查询，未看到预期开放的8081、8082端口：

netstat -anvp tcp | awk 'NR<3 || /LISTEN/'
(No info could be read for "-p": geteuid()=20162 but you should be root.)
netstat: no support for `AF INET (sctp)' on this system.
netstat: no support for `AF INET (sctp)' on this system.
Active Internet connections (servers and established)
Proto Recv-Q Send-Q Local Address           Foreign Address         State       PID/Program name
tcp        0      0 0.0.0.0:22              0.0.0.0:*               LISTEN      -
tcp        0      0 127.0.0.1:20257         0.0.0.0:*               LISTEN      -
tcp        0      0 127.0.0.54:53           0.0.0.0:*               LISTEN      -
tcp        0      0 172.17.0.1:8080         0.0.0.0:*               LISTEN      -
tcp        0      0 172.17.0.1:8090         0.0.0.0:*               LISTEN      -
tcp        0      0 127.0.0.53:53           0.0.0.0:*               LISTEN      -
tcp        0      0 0.0.0.0:10402           0.0.0.0:*               LISTEN      -
tcp        0      0 0.0.0.0:8443            0.0.0.0:*               LISTEN      -
tcp        0      0 172.17.0.1:10403        0.0.0.0:*               LISTEN      -
tcp        0      0 172.17.0.1:24231        0.0.0.0:*               LISTEN      -
tcp        0      0 127.0.0.1:38535         0.0.0.0:*               LISTEN      -
tcp6       0      0 :::22                   :::*                    LISTEN      -

更新3 #

在default容器内可以成功请求view服务，但请求api服务时返回502错误：

curl -L api-dot-casestudy2108.ue.r.appspot.com/v1/test
<html>
<head><title>502 Bad Gateway</title></head>
<body>
<center><h1>502 Bad Gateway</h1></center>
<hr><center>nginx</center>
</body>
</html>

控制台显示实际请求的URL为：

https://view-dot-casestudy2108.ue.r.appspot.com/v1/test

这明显错误，正确的请求URL应该是：

https://api-dot-casestudy2108.ue.r.appspot.com/v1/test

view服务的Nginx配置中已设置正确的API地址：

upstream api {
    server ${API_HOST}:8081;
 }

不清楚为什么请求会被转发到view服务自身。

当前更新后的dispatch.yaml配置：

# api traffic
- url: "*/v1/*"
  service: api
# view traffic
- url: "*/view/*"
  service: view
# Default service serves simple hostname request.
- url: "casestudy2108.ue.r.appspot.com/"
  service: default

注：- url: "*/view/*"是临时设置的值，可能需要改为*/.*，但不确定是否正确。

目前不确定如何正确配置view服务的路由，也不清楚请求被转发到自身的原因。

API容器信息：

84a4206ae0ed   us-central1-docker.pkg.dev/casestudy2108/personal/vue-golang-grpc-base/api   "./main"                 5 days ago   Up 5 days   172.17.0.1:8080->8080/tcp, 172.17.0.1:10403->10403/tcp, 0.0.0.0:8081-8082->8081-8082/tcp, 0.0.0.0:8081-8082->8081-8082/udp   gaeapp

可以看到8081端口已暴露，这正是view服务试图发送请求的端口。

内容的提问来源于stack exchange，提问作者Mike3355