使用Ngrok运行Django应用提示HTTP Error 404如何排查解决

问题表现 #

通过Ngrok访问本地部署的Django应用时，页面返回HTTP Error 404，提示请求的资源不存在，错误截图如下：

已完成的配置操作：

• 将Ngrok生成的访问地址添加到Django配置文件的ALLOWED_HOSTS项中
• 完成其余Django运行所需的环境变量配置
• 按顺序执行py manage.py runserver启动Django本地服务、执行ngrok http 80启动内网穿透，访问时仍报错

故障原因 #

本地Django服务监听端口和Ngrok转发端口不一致。
不带端口参数执行py manage.py runserver时，Django默认会监听本地的8000端口，而启动Ngrok时指定的是转发80端口，Ngrok收到的请求全部转发到了没有运行Django服务的80端口，自然返回404。

解决方法 #

两种方案选一种即可：

• 方案1：修改Ngrok转发端口，匹配Django默认监听端口
  终止当前运行的Ngrok进程，重新执行启动命令：
  ngrok http 8000
  等待Ngrok生成新的公网访问地址，直接访问即可正常打开应用。
• 方案2：修改Django启动端口，匹配Ngrok配置的80端口
  终止当前运行的Django服务进程，重新执行启动命令：
  py manage.py runserver 80
  注意：Linux、macOS系统监听1024以下端口需要root权限，执行命令前加sudo；Windows系统需要以管理员身份运行终端再执行该命令

补充排查项 #

如果调整端口后仍然返回404，检查以下两项配置：

• ALLOWED_HOSTS里填写的Ngrok域名不要带http://、https://前缀，也不要带末尾的斜杠，例如Ngrok分配的地址是https://xxxx.ngrok.io，配置项里只需要填xxxx.ngrok.io即可
• 不需要严格遵守先启动Django再启动Ngrok的顺序，只要两个进程正常运行、端口映射对应，服务就能正常访问

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