微涉全栈(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
相关推荐
骑着bug的coder3 分钟前
第10讲:并发场景优化——锁机制与死锁解决
后端·mysql
hongkid5 分钟前
React Native 如何打包正式apk
javascript·react native·react.js
李少兄7 分钟前
简单讲讲 SVG:前端开发中的矢量图形
前端·svg
前端小万9 分钟前
告别 CJS 库加载兼容坑
前端·前端工程化
恋猫de小郭9 分钟前
Flutter 3.38.1 之后,因为某些框架低级错误导致提交 Store 被拒
android·前端·flutter
rchmin9 分钟前
PostgreSQL与MySQL选型对比
数据库·mysql·postgresql
JarvanMo13 分钟前
Flutter 需要 Hooks 吗?
前端
光影少年23 分钟前
前端如何虚拟列表优化?
前端·react native·react.js
Moment25 分钟前
一杯茶时间带你基于 Yjs 和 reactflow 构建协同流程图编辑器 😍😍😍
前端·后端·面试
invicinble42 分钟前
对于前端数据的生命周期的认识
前端