Node.js入门教程 第五篇 (Express框架)

Express框架

Express是适用于Node.js web的框架,提供了大量实用功能,例如路由功能及http功能。

Express 框架核心特性:

  • 可以设置中间件来响应 HTTP 请求。
  • 定义了路由表用于执行不同的 HTTP 请求动作。
  • 可以通过向模板传递参数来动态渲染 HTML 页面。

安装:

npm install express --save

可能需要的中间件:

body-parser - Node.js 中间件,用于处理 JSON, Raw, Text 和 URL 编码的数据。

cookie-parser - 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie,并把它们转成对象。

multer - Node.js 中间件,用于处理 enctype="multipart/form-data"(设置表单的MIME编码)的表单数据。

cors - Node.js跨域解决方案,当需要跨域访问时使用。

1 npm install body-parser --save
2 npm install cookie-parser --save
3 npm install multer --save
4 npm install cors --save

使用express创建服务端:

 1 var express = require(‘express‘);
 2 var app = express();
 3  //分配路由
 4 app.get(‘/‘, function (req, res) {
 5    res.send(‘Hello World‘);
 6 })
 7 app.get(‘/about‘, function (req, res) {
 8    res.send(‘about web‘);
 9 })
10 app.post(‘/user‘, function (req, res) {
11    res.send(‘user data‘);
12 })
13 //创建服务器并监听8080端口
14 var server = app.listen(8080)

访问 http://127.0.0.1:8080:

界面输出‘Hello World‘

访问 http://127.0.0.1:8080/about:

界面输出‘about web‘

访问 http://127.0.0.1:8080/user:

界面输出‘user data‘

 Express的路由分为get和post两种。两者用法类似,但post支持的参数长度更大。

express+axios实现vue前后端跨域访问(拓展)

axios是对ajax封装后的模块,使用更简单,可以与express搭配使用,实现前后端分离跨域访问。

安装axios:

npm install axios --save

使用express创建路由:

1 //router.js
2 const express = require(‘express‘);
3 const router = express.Router();
4
5 router.get(‘/login‘, (req, res, next) => {
6   //to do login
7 });

创建跨域访问:

 1 const routerApi = require(‘./router‘);
 2 const bodyParser = require(‘body-parser‘); // post 数据需要
 3 const express = require(‘express‘);
 4 const cors = require(‘cors‘);//跨域访问依赖的中间件
 5 const app = express();
 6
 7 // 允许请求的域名,如果是*则允许所有域名访问本服务端(必须写在所有注册路由前)
 8 app.use(cors({ origin: ‘http://127.0.0.1:8080‘ }));
 9 //解析Json
10 app.use(bodyParser.json());
11 //注册路由
12 app.use(‘/api‘, routerApi);
13 //创建服务端,监听端口
14 app.listen(3000, ‘0.0.0.0‘);
15 console.log(‘success listen at port:3000......‘);

前端main.js(前端以Vue为例):

 1 import Vue from ‘vue‘
 2 import axios from ‘axios‘
 3
 4 //使用ElementUI为PC前端框架
 5 Vue.use(ElementUI)
 6 // 请求服务器的Url
 7 axios.defaults.baseURL = ‘http://127.0.0.1:3000/‘;
 8 //设置post默认类型为json
 9 axios.defaults.headers.post[‘Content-Type‘] = ‘application/json‘;
10 Vue.prototype.axios = axios

前端UI请求:

 1 this.axios.get("/api/login", {
 2    params: {
 3      userName: ‘Jimmy‘,
 4      password: ‘123456‘
 5    }
 6  })
 7  .then(res => {
 8   //登录结果...
 9  })
10  .catch(error => {
11    console.log(error.response);
12  });

原文地址:https://www.cnblogs.com/JHelius/p/11645929.html

时间: 2024-10-29 05:19:04

Node.js入门教程 第五篇 (Express框架)的相关文章

Node.js入门教程 第一篇 (环境配置及概念原理)

Node.js 概念 Node.js本质上是使用Google的V8引擎制作出来的服务框架.V8本身是Google为了解决Chrome浏览器的性能问题而制作的前端引擎(开源).本身依托于浏览器引擎,这也是为什么Node.js使用的是前端的JavaScript语言编程. V8的诞生是Google为了解决JavaScript的性能问题,用了内联缓存和隐藏类技术实现的前端引擎.V8使用C++编写,也因此V8可以在C++项目中完美兼容使用. V8被Google使用在大多数产品中,如Chrome浏览器,安卓

Node.js入门教程

http://www.nodebeginner.org/index-zh-cn.html#a-basic-http-server Node入门 作者: Manuel Kiessling翻译: goddyzhao & GrayZhang & MondayChen 关于 本书致力于教会你如何用Node.js来开发应用,过程中会传授你所有所需的“高级”JavaScript知识.本书绝不是一本“Hello World”的教程. 状态 你正在阅读的已经是本书的最终版.因此,只有当进行错误更正以及针对

Node.js 入门教程 (二):模块

由于新工作要做前端,作为前端小白而且能尽快学习,所以选择慕课网的node.js的入门教程.博客只做自己学习的记录. JavaScript缺少模块管理机制,容易出现变量被覆盖,方法被替代的情况(既被污染).特别是存在依赖关系时,容易出现错误.采用命名空间的方式,把变量和函数限制在某个特定的作用域内,人肉约定一套命名规范来限制代码,保证代码安全运行. CommonJs是一套规范,包括了modules,system,encodings,unit test等等来约定JavaScript应该怎么去组织和编

Node.js入门教程——如何实现文件上传功能

作者:zhanhailiang 日期:2014-11-16 本文将介绍如何使用Node.js实现文件上传功能. 1. 初始化项目信息:npm init [root@~/wade/nodejs/nodejs-upload-image-demo]# npm init This utility will walk you through creating a package.json file. It only covers the most common items, and tries to gu

【Node.js】一、搭建基于Express框架运行环境+更换HTML视图引擎

  1)安装express generator生成器 这个express generator生成器类似于vue-cli脚手架工具,用来创建一个后端项目,首先我们要对生成器进行全局安装,在cmd中输入下面命令: npm install -g express-generator 是否安装express generator生成器成功?在命令行工具直接输入一下命令,查看生成器版本 express --version 2)通过生成器自动创建server项目 安装完express generator生成器之

node.js入门学习(四)--express

1.官网:http://expressjs.com/ 中文:http://www.expressjs.com.cn/ 2.HelloWorld 1)mkdir node-express-demo 2)cd .\node-express-demo\ 3)新建app.js文件 4)npm init -y  : 会以app.js为入口文件,创建package.json 5)npm install express --save  : 本地安装express并将其保存到依赖列表中,会新建package-l

Node.js 入门教程 (三):API-准备知识

==========关于异步=========== 什么是回调? 回调是异步编程最基本的方法,比如nodejs中,需要按顺序执行异步逻辑的时候,一般采用后续传递的方式,也就是将后续逻辑封装在回调函数中作为起始函数的参数,逐层去嵌套,利用这种方式来让程序按照我们所期望的方式走完整个流程. function learn(something){    console.log(something)}function we(callback,something){    something += ' is

Node.js 入门教程 (三):API

(一)URL网址解析 URI: 统一资源标识符 URL:统一资源定位符 网址就是一个URL,说明了要以那种协议来访问哪种资源,URI更加抽象,是一个字符串格式规范,URL是URI的子集 parse() 第二个参数设为true,可以看到query变成了一个对象 第三个参数设置前后的区别 format() resolve() (二)querystring 参数处理 stringify()将对象序列化,第二个参数可以替换参数之间的连接值,第三个参数可替换key和value之间的连接值 parse()反

RabbitMQ入门教程(十五):普通集群和镜像集群

原文:RabbitMQ入门教程(十五):普通集群和镜像集群 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/vbirdbest/article/details/78740346 分享一个朋友的人工智能教程(请以"右键"->"在新标签页中打开连接"的方式访问).比较通俗易懂,风趣幽默,感兴趣的朋友可以去看看. 普通集群 推荐一篇优秀的文章: RabbitM