前端怎么调用node接口---小白

1.基于node搭建express后端脚手架:基于node搭建express后端脚手架

2.在node里边写一个接口

复制代码
// 引入express
const express = require('express')
// 创建实例
const app = express()
// 创建监听端口
const port = 3000
//  定义接口
app.get('/api/getData',(req,res) =>{
    // 返回的结果
    res.send({
        code:10000,
        data:{
            msg:'hellow '
        }
    })
})
// 监听当前的端口
app.listen(port,() =>{
    console.log(`server start! port:${port}`);
})

3.前端这块页面--通过axios调用接口

复制代码
 <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.5.0/axios.min.js"></script>
    <script>
        axios({
            methods:'get',
            url:'http://localhost/3000/api/getData'
        })
    </script>

推荐我vscode安装了一个插件 直接右键 运行这个页面 ;安装很快,

安装成功后重启一下vscode

测试接口成功(不过请求接口的时候跨域了)

相关推荐
yingyima4 分钟前
Redis 延迟任务队列:凌晨3点服务器报警的救星
前端
weiggle7 分钟前
第三篇:可组合函数(Composable)——Compose 的基石
android·前端
前端环境观察室8 分钟前
别只看 task success:AI Agent 浏览器自动化真正要补的是环境证据链
前端·后端
huakoh9 分钟前
LangChain 实战:用混合检索啃下 1000 页 PDF,搭一个长文档问答 Agent
前端
Dazer00718 分钟前
Edge 浏览器绕过 HTTPS 证书错误
前端·https·edge
元让_vincent25 分钟前
Spark 2.0:面向 Web 的 3DGS 可视化与大场景渲染平台详解
前端·3d·spark·渲染·轻量化·3dgs·lod
KaMeidebaby42 分钟前
卡梅德生物技术快报|酵母双杂交 cDNA 文库构建与蛋白互作筛选流程
服务器·前端·数据库·人工智能·算法
沐风___1 小时前
App 上架之后:如何看数据、获取用户与持续迭代产品
服务器·前端·数据库
AAA大运重卡何师傅(专跑国道)1 小时前
力扣hot100
服务器·前端·数据库
GISer_Jing2 小时前
前端沙箱开源项目推荐(React/Next/Vue优先)
前端·react.js·开源