react如何连接mssql数据库
在React中连接MSSQL数据库
React本身是前端框架，不直接连接数据库。需要通过后端服务（如Node.js）与MSSQL交互，React再通过API调用后端。以下是完整方案：
后端服务搭建（Node.js + MSSQL）
安装mssql库：
npm install mssql创建API端点（示例）：
const sql = require('mssql');
const config = {
user: 'username',
password: 'password',
server: 'localhost',
database: 'your_database',
options: {
encrypt: true, // 适用于Azure
trustServerCertificate: true // 本地开发使用
}
};
async function getData() {
try {
await sql.connect(config);
const result = await sql.query`SELECT * FROM YourTable`;
return result.recordset;
} finally {
sql.close();
}
}前端React调用API
使用fetch或axios调用后端接口：
import React, { useEffect, useState } from 'react';
import axios from 'axios';
function App() {
const [data, setData] = useState([]);
useEffect(() => {
axios.get('http://your-backend-api/data')
.then(response => setData(response.data))
.catch(error => console.error(error));
}, []);
return (
<div>
{data.map(item => (
<div key={item.id}>{item.name}</div>
))}
</div>
);
}安全注意事项
- 永远不要在前端代码中暴露数据库凭据
- 后端API应实现身份验证（如JWT）
- 使用环境变量存储敏感信息（如
.env文件） - 生产环境启用HTTPS
替代方案
- 使用ORM工具（如TypeORM）简化数据库操作
- 考虑GraphQL中间层（Apollo Server）替代REST API
- 无服务器方案（Azure Functions/AWS Lambda）
调试建议
- 先用SQL Management Studio测试连接
- 使用Postman测试后端API
- React开发模式下配置代理避免CORS问题
