Docker环境下无法通过JavaScript访问API文件夹URL的问题咨询

核心原因 #

你的404错误本质是WordPress容器内不存在/api/api.php路径：查看docker-compose.yaml的wordpress服务挂载配置，仅映射了主题、插件、上传目录，本地project-assets/api目录并未挂载到容器的网站根目录下，导致请求找不到文件。

具体解决步骤 #

1. 修改docker-compose.yaml，挂载API目录
   在wordpress服务的volumes列表中添加一行，将本地API目录映射到容器网站根目录的api文件夹：

   volumes:
     - ./project-assets/${THEME_NAME}:/var/www/html/wp-content/themes/${THEME_NAME}
     - ./project-assets/plugins:/var/www/html/wp-content/plugins
     - ./project-assets/uploads:/var/www/html/wp-content/uploads
     - ./project-assets/api:/var/www/html/api  # 新增这一行
   

   保存后重启容器：docker-compose down && docker-compose up -d

2. 验证挂载是否生效
   执行命令进入WordPress容器，检查API文件是否存在：

   docker exec -it $(docker-compose ps -q wordpress) ls /var/www/html/api
   

   如果输出包含api.php，说明挂载成功。

3. 处理WordPress路由拦截（可选）
   若挂载后仍出现404，大概率是WordPress的URL重写规则拦截了/api请求。此时在本地project-assets/api目录下新建.htaccess文件，内容如下：

   RewriteEngine Off
   

   该配置会让Apache直接处理API目录下的文件，不再交给WordPress路由。

4. 保持原JS代码不变
   你的API_URL定义和fetch代码无需修改，挂载完成后http://localhost:8000/api/api.php即可正常访问。

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