ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

node.js的express模块实现GET和POST请求

2022-06-14 17:02:43  阅读:159  来源: 互联网

标签:node const GET res express cors test router


一、环境

1、安装express

npm i express@4.17.1 // 安装express模块

2、安装nodemon

npm i nodemon -g 

 

3、安装cors

npm install cors --save 或者 npm install cors -D

 

4、运行命令

nodemon .\test.js

二、代码(话不多说直接上代码)

1、代码结构:

 

 

 

 

test.html为页面
test.js为服务器端代码
apiRouter为封装的路由模块
2、apiRouter.js

const express = require("express");
const database = require("mime-db");
const router = express.Router();
//导入
const cors = require('cors');
//挂载
router.use(cors({
    origin:['http://localhost:8083'],
    methods:['GET','POST'],
    alloweHeaders:['Conten-Type', 'Authorization']
}));

 
// 挂载对应的路由
router.get("/get", (req, res) => {
  // 通过 req.query 获取客户端通过查询字符串,发送到服务器的数据
  const query = req.query
 let backData = query.name+'test拼接' 
  // 向客户端响应处理的结果
  res.send({
    status: 0, // 0成功,1失败
    code:200,
    msg: "get请求成功!",
    data: backData, // 响应给客户端的数据
  });
});
 
router.post("/post", (req, res) => {
  // 通过 req.body 获取请求体中包含的 url-encoded 格式的数据
  const body = req.body;
   let backData = body.author+'test拼接处理数据' 
  // 调用res.send方法,向客户端响应结果
  res.send({
      status: 0,
      code:200,
      msg: 'POST请求成功!',
      data: backData
  })
 
});
 
module.exports = router;

 


3、test.js

const express = require("express");
// 创建服务器实例
const app = express();
 
// 配置解析表单数据的中间件
app.use(express.urlencoded({ extended: false }));
 
// 一定要在路由之前,配置cors中间件,从而解决接口跨域问题
const cors = require("cors");
app.use(cors());
 
// 导入路由模块
const router = require("./apiRouter");
 
// 把路由挂载到app实例上
app.use("/api", router);
 
// 启动服务器
app.listen(8081, () => {
  console.log("server running at http://127.0.0.1:8081");
});

 


4、test.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://cdn.staticfile.org/jquery/3.4.1/jquery.min.js"></script>
  </head>
  <body>
    <button id="btnGET">GET</button>
    <button id="btnPOST">POST</button>
    <script>
      $(function () {
        // 测试Get接口
        $("#btnGET").on("click", function () {
          $.ajax({
            type: "GET",
            // url: "http://127.0.0.1:8081/api/get",
            url: "http://10.15.253.205:8081/api/get",
            data: {
              name: "zs",
              age: 30,
            },
 
            success: function (res) {
              console.log(res);
            },
          });
        });
        // 测试Post接口
        $("#btnPOST").on("click", function () {
          $.ajax({
            type: "POST",
            url: "http://10.15.253.205:8081/api/post",
            data: {
              bookname: "西游记",
              author: "吴承恩",
            },
            success: function (res) {
              console.log(res);
            },
          });
        });
      });
    </script>
  </body>
</html>

 


效果:

 

 写在最后,简单的node服务器,希望可以帮到大家,

标签:node,const,GET,res,express,cors,test,router
来源: https://www.cnblogs.com/houxianzhou/p/16375333.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有