微涉全栈(react,axios,node,mysql)

纯小白从前端跨域发起axios get请求获取数据

如果有兴趣欢迎往下看:

//nodejs部分

javascript 复制代码
const express = require('express')
const app = express()
const mysql = require('mysql2')
// 创建一个数据库连接
const connection = mysql.createConnection({
    host: 'localhost',
    user: 'root',
    database: 'users',
    password: '203827'
});
connection.connect((err) => {
    if (err) {
        console.error('Error connecting to the database:', err.message);
        return;
    }
    console.log('Connected to the MySQL database.');
});
app.get('/user', (req, res) => {
    const query = 'SELECT * FROM inf';
    connection.query(query, (err, results) => {
        if (err) {
            console.error('Error fetching posts:', err);
            return res.status(500).json({ message: 'Error fetching posts' });
        }
        res.json(results);
    });
    // res.send('test')
})
app.listen('8000', () => {
    console.log('8000启动')
})
//关闭数据库
// connection.end((err) => {
//     if (err) {
//         console.error('Error closing the connection:', err.message);
//         return;
//     }
//     console.log('Database connection closed.');
// });

//前端部分

javascript 复制代码
import './App.css'
import axios from 'axios'
function App() {
const test=()=>{
axios({
  method:'get',
  url:'api/user/'
}).then(res=>{
  console.log(res)
})
}
  return (
    <>
    <button onClick={test}>测试</button>
    </>
  )
}

export default App
相关推荐
Jmyd01234 小时前
Web端3D营销展厅技术实现路径:从素材上云到线索回流的数据链路
前端·3d·性能优化·三维数字化
砚凝霜4 小时前
【软考信息安全】第二十二章 Web服务器安全分析与增强——Apache与IIS
服务器·前端·安全
for_ever_love__4 小时前
MySQL ORDER BY 排序优化:从 Using filesort 到索引有序扫描(含双路 / 单路排序原理)
java·mysql·优化·存储·by·order·filesort
u0111026756 小时前
JPG、PNG、WebP 怎么选?按透明度、体积和使用场景做判断
前端·javascript·vue.js·图像处理·ai作画
jerrywus7 小时前
让 AI 写完代码后交一份报告:我改造了 answer-me-with-html
前端·claude·cursor
派小心.7 小时前
小程序分享链路中来源参数的传递校验
大数据·前端·数据库·人工智能·小程序·数据分析
hhb_6187 小时前
一键生成数据看板,ECharts实战演示
前端·javascript·echarts
Java后端的Ai之路8 小时前
08_React组件API
前端·react.js·前端框架
小马不起床8 小时前
零基础玩转 FastAPI_09:前端基础工程构建
前端·状态模式·fastapi
Sayai8 小时前
DataX 离线数据同步实战:Elasticsearch 数据批量导出 MySQL(作业配置、并发调优与定时同步平台化设计)
大数据·mysql·elasticsearch·datax·数据同步