IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 系统运维 -> 用Express搭建服务器 -> 正文阅读

[系统运维]用Express搭建服务器

用Express搭建服务器

之前一直是用axios请求rap2模拟的接口,想试着用express自己写一个简单的,然后连下MySQL数据库。

0、准备工作

  • 安装node
  • 初始化项目:新建一个文件夹,在里面
    npm init -y
    
  • 安装express
    npm install express
    

1、第一个小栗子(发布服务)Express 中文网

  • 新建www.js文件,把这段代码写进去,然后直接node www.js启动服务,然后在浏览器访问http://localhost:3000就可以看到后端返回的Hello World!啦。
    
    const express = require('express')
    const app = express()
    const port = 3000
    
    app.get('/', (req, res) => {
    //这里面可以先从数据库获取数据,然后返回给前端
    res.send('Hello World!')
    })
    
    app.listen(port, () => {
    console.log(`Example app listening at http://localhost:${port}`) })
    
    

2、前端axios.get请求

  • 发布服务之后就可以用axios请求啦,请求的代码如下:(但是会有问题,解决方法见 第3节
      axios.get('http://localhost:3000').then((res) => {
        console.log(res);
      });
      
    

3、前端axios.get请求的跨域问题

  • 第2节介绍了如何用axios请求后台服务,但是在本地访问上面的http://localhost:3000,如果不是同一端口的话会出现跨域不能请求的问题。解决方法是在www.js文件中加上下面这段:
	//加了这句之后就可以跨域请求了???
	app.use(function (req, res, next) {
  res.header('Access-Control-Allow-Origin', '*'); //允许所有来源访问
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
  res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS'); //允许访问的方式
  next();  });
  • 这样你就可以在本地其他端口的项目上访问3000端口啦

4、后端post接口

app.post('/post', (req, res) => {
 console.log(JSON.stringify(req.body));//前端发送给后端的数据
 res.send('ok');//返回给前端的数据
});

5、前端axios.post请求

      axios.post(`http://localhost:3000/post`, "向后端发送的数据").then(res => {
        console.log("后端返回的数据res=>", res);
      });
  • 这样你在前端就可以向后端发送请求信息,后端接收并验证之后再把数据返回给前端就好了。
  • 但是,这样还是会有点问题,第6节解决。

6、 在express中获取post请求数据(本节原文链接)

  1. express没有内置的POST请求API,但是有听说将body-parser(详情) 内置到express中了。但是我试了直接使用不了。所以还是直接安装第三方包

  2. 使用第三方包body-parser

    npm i body-parser
    
  3. app.js

    //1引包
    const bodyParser=require('body-parser')
    
    //2配置
    // 配置模板引擎和 body-parser 一定要在 app.use(router) 挂载路由之前
    // parse application/x-www-form-urlencoded
    app.use(bodyParser.urlencoded({ extended: false }))
    // parse application/json
    app.use(bodyParser.json())
    
  • 至此使用express搭建的简易服务器就好了,后续可以再连接数据库进行增删查改。

转载整合自(文中链接) 参考链接:
Express 中文网
在express中获取post请求数据(原文链接)
body-parser(详情)

  系统运维 最新文章
配置小型公司网络WLAN基本业务(AC通过三层
如何在交付运维过程中建立风险底线意识,提
快速传输大文件,怎么通过网络传大文件给对
从游戏服务端角度分析移动同步(状态同步)
MySQL使用MyCat实现分库分表
如何用DWDM射频光纤技术实现200公里外的站点
国内顺畅下载k8s.gcr.io的镜像
自动化测试appium
ctfshow ssrf
Linux操作系统学习之实用指令(Centos7/8均
上一篇文章      下一篇文章      查看所有文章
加:2021-09-18 10:39:18  更:2021-09-18 10:40:50 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/15 15:22:50-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码