express搭建后端请求路由,前端进行访问对应的接口 后端解决跨域

代码在 ==》E:\nodes实战\myserve\testserve

复制代码
1 express搭建后端请求路由,前端进行访问对应的接口


    1) 创建项目目录
        express 项目名 -e

        然后按照提示就可以了
        cd 项目名


    2) 进入项目 下载依赖
        cnpm i 


        在下载过程中出现
        New minor version of npm available! 6.11.2 -> 6.13.1      
        Changelog: https://github.com/npm/cli/releases/tag/v6.13.1   
        Run npm install -g npm to update! (运行npm install-g npm进行更新!)
        跟新就可以了
        

    
    3) 在app.js 中 在(module.exports = app;前添加)就是在第40行 添加如下,监听端口
        app.listen(666, () => {
            console.log('后端服务器启动成功,地址是: http://127.0.0.1:666')
        })


    4) 启动项目
        nodemon app

然后输入  http://127.0.0.1:666 就会出现界面
复制代码

 

复制代码
介绍一下后端的项目目录
bin
public
routes  路由接口
views
app.js文件
package.json 包描述文件


复制一份routes下的users.js文件,用来做account的请求 然后命名为account.js文件如下
{
    var express = require('express');
    var router = express.Router();

    // 统一设置响应头 解决跨域问题
    router.all("*", (req, res, next) => {
        // 设置响应头 解决跨域(目前最主流的方式)
        res.header("Access-Control-Allow-Origin", "*");
        res.header("Access-Control-Allow-Headers", "authorization");
        next();
    });

    /* GET users listing. */
    router.get('/', function(req, res, next) {
    res.send('解决了跨域哈');
    });

    module.exports = router;

}


然后再app.js中去  给/test分配一个路由
vvar accountRouter = require('./routes/account');  //分配路由 在地10行
app.use('/account',accountRouter );      //使用路由 在第28行


然后在页面输入http://127.0.0.1:666/account 
就会出现 解决了跨域哈 说明路由配置成功
复制代码

 

复制代码
前端
created() {
    axios
      .get("http://127.0.0.1:666/account")
      .then(res => {
        this.mesg = res.data;
        window.console.log(res.data);//解决了跨域哈
      })
      .catch(err => {
        window.console.log(err);
      });
  }
复制代码

 

 

posted @   南风晚来晚相识  阅读(953)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
点击右上角即可分享
微信分享提示