PHP PDO连接MySQL报1045空用户@172.17.0.1访问拒绝 前端JSON解析失败

报错的联动逻辑 #

你遇到的前后端两个报错是强关联的：当PHP脚本抛出数据库连接致命错误时，会直接把纯文本错误信息输出到HTTP响应体中，前端fetch拿到非JSON格式的内容后，调用response.json()自然会触发JSON解析失败的报错，不需要单独排查前端解析逻辑，优先解决后端数据库连接问题即可同步解决前端报错。

异常中出现的172.17.0.1地址来源 #

这个地址是Docker默认的网桥网关IP，匹配你当前使用的XAMPP运行环境：

• 报错里的172.17.0.1不需要写在项目代码里，它是Docker部署版XAMPP和宿主机通信时，MySQL端看到的请求来源IP。
• 你提到报错路径是/opt/lampp/htdocs/Alben/data/interpret.php第5行，但现有连接配置写在album.php中，说明实际触发报错的interpret.php根本没有复用album.php里的数据库连接参数，在第5行直接实例化了无参数的PDO对象，这才会出现报错里用户名为空、未传密码的异常——你在PhpStorm里能正常连接数据库，是IDE走宿主机直连数据库的逻辑，和XAMPP容器内PHP脚本的运行环境、网络路径不是同一套。

具体问题点与对应修复 #

• 统一数据库连接的引入逻辑：在interpret.php文件开头添加引入代码，确保加载到album.php中定义的数据库连接配置，避免在单个接口文件里重复写连接逻辑：
  require __DIR__ . '/album.php';
• 修正连接端口配置：MySQL默认监听端口为3306，你当前配置的8080是常见Web服务端口，并非MySQL默认端口，除非手动修改过MySQL的监听配置，否则将$port的值改为3306即可。
• 规范后端接口的响应格式：调整album.php的异常处理逻辑，连接失败时直接返回HTTP 500状态码，不要在响应体里输出纯文本调试信息；所有数据库查询完成后，通过json_encode()将结果转为JSON格式输出，同时在响应头声明Content-Type: application/json，从源头避免前端解析错误。
• 修复apps.js的语法错误：代码中拼接好的HTML字符串存在小写变量html中，赋值DOM内容时错误写成了大写的HTML，会触发未定义变量的报错，将elem.innerHTML = HTML;修改为elem.innerHTML = html;即可。

快速验证方法：直接在浏览器地址栏访问PHP接口路径，查看返回内容。如果返回的是纯文本错误信息，说明后端连接逻辑未跑通，此时无需调整前端代码，优先把后端的数据库连接、查询流程调试正常即可。

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