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

简介: 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);
      });
  }



     


相关文章
|
2月前
|
JavaScript 前端开发 中间件
探索后端技术:Node.js与Express框架的完美融合
【10月更文挑战第7天】 在当今数字化时代,Web应用已成为日常生活不可或缺的一部分。本文将深入探讨后端技术的两大重要角色——Node.js和Express框架,分析它们如何通过其独特的特性和优势,为现代Web开发提供强大支持。我们将从Node.js的非阻塞I/O和事件驱动机制,到Express框架的简洁路由和中间件特性,全面解析它们的工作原理及应用场景。此外,本文还将分享一些实际开发中的小技巧,帮助你更有效地利用这些技术构建高效、可扩展的Web应用。无论你是刚入门的新手,还是经验丰富的开发者,相信这篇文章都能为你带来新的启发和思考。
|
26天前
|
缓存 负载均衡 JavaScript
构建高效后端服务:Node.js与Express框架实践
在数字化时代的浪潮中,后端服务的重要性不言而喻。本文将通过深入浅出的方式介绍如何利用Node.js及其强大的Express框架来搭建一个高效的后端服务。我们将从零开始,逐步深入,不仅涉及基础的代码编写,更会探讨如何优化性能和处理高并发场景。无论你是后端新手还是希望提高现有技能的开发者,这篇文章都将为你提供宝贵的知识和启示。
|
28天前
|
JavaScript
使用node.js搭建一个express后端服务器
Express 是 Node.js 的一个库,用于搭建后端服务器。本文将指导你从零开始构建一个简易的 Express 服务器,包括项目初始化、代码编写、服务启动与项目结构优化。通过创建 handler 和 router 文件夹分离路由和处理逻辑,使项目更清晰易维护。最后,通过 Postman 测试确保服务正常运行。
47 1
|
2月前
|
前端开发 JavaScript
回顾前端页面发送ajax请求方式
回顾前端页面发送ajax请求方式
39 18
|
2月前
|
Web App开发 JavaScript 中间件
构建高效后端服务:Node.js与Express框架的完美结合
【10月更文挑战第21天】本文将引导你走进Node.js和Express框架的世界,探索它们如何共同打造一个高效、可扩展的后端服务。通过深入浅出的解释和实际代码示例,我们将一起理解这一组合的魅力所在,并学习如何利用它们来构建现代Web应用。
63 1
|
2月前
|
前端开发 JavaScript API
前端Get请求能在body上传参吗
【10月更文挑战第11天】 在浏览器环境中,GET请求的body参数会被忽略,这是因为浏览器中的XHR和fetch实现限制了这一行为。而在Node.js服务端环境中,GET请求可以在body中传递参数,因为服务端请求库没有这样的限制。实际上,GET请求不带body是HTTP标准的一部分,但在某些场景下,为了遵循RESTful规范,可以考虑通过服务端转发或BFF模式来实现复杂的参数传递。
|
1月前
|
Web App开发 JavaScript 前端开发
构建高效后端服务:Node.js与Express框架的实践
【10月更文挑战第33天】在数字化时代的浪潮中,后端服务的效率和可靠性成为企业竞争的关键。本文将深入探讨如何利用Node.js和Express框架构建高效且易于维护的后端服务。通过实践案例和代码示例,我们将揭示这一组合如何简化开发流程、优化性能,并提升用户体验。无论你是初学者还是有经验的开发者,这篇文章都将为你提供宝贵的见解和实用技巧。
|
1月前
|
Web App开发 JavaScript 中间件
构建高效后端服务:Node.js与Express框架的融合之道
【10月更文挑战第31天】在追求快速、灵活和高效的后端开发领域,Node.js与Express框架的结合如同咖啡遇见了奶油——完美融合。本文将带你探索这一组合如何让后端服务搭建变得既轻松又充满乐趣,同时确保你的应用能够以光速运行。
34 0
|
2月前
|
存储 缓存 监控
|
2月前
|
移动开发 前端开发 HTML5
SharedWorker 优化前端轮询请求
【10月更文挑战第6天】
33 1