React项目中Node Polyfills与webpack.config.js配置问题求助

核心错误：前端不能直接用mysql模块 #

mysql是Node.js后端专用的数据库驱动，完全不能在浏览器环境（React前端）中运行：

• 浏览器不支持Node.js核心模块（比如crypto、fs），就算补polyfill也无法模拟数据库连接的底层逻辑
• 前端直接连接数据库会暴露数据库账号密码、地址等敏感信息，严重违反安全规范
• 浏览器本身限制了直接发起MySQL协议的网络请求

你的webpack配置问题 #

1. 配置文件未生效：如果你的项目是用Create React App初始化的，默认不会读取根目录的webpack.config.js——它把webpack配置封装在了react-scripts里，除非你执行npm run eject暴露配置，或者用craco/react-app-rewired这类工具修改配置。
2. fallback配置错误：你把crypto设为false是告诉webpack忽略这个模块，但mysql依赖它，正确做法是安装对应的polyfill包并指向它，而不是禁用：

   // 仅作配置示例，不推荐在前端使用mysql
   resolve: {
     fallback: {
       "crypto": require.resolve("crypto-browserify"),
       "stream": require.resolve("stream-browserify")
     }
   }
   

   但再次强调：就算配好polyfill，mysql在前端也跑不起来，这是方向错误。

正确的解决方案 #

1. 搭建后端服务：用Node.js+Express（或其他后端框架）写一个简单的API服务，在后端使用mysql模块连接AWS数据库，处理数据查询、写入逻辑。
2. 前端调用API：React前端通过fetch、axios等工具，向后端API发送HTTP请求，获取或提交数据。
3. 安全注意事项：后端要做好身份验证、参数校验，不要把数据库凭证硬编码在代码里，用环境变量管理（比如AWS Secrets Manager）。

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