request小例

believealone

于 2020-12-10 09:10:12 发布

阅读量195

点赞数

分类专栏： NODEJS 学习笔记

本文链接：https://blog.csdn.net/believealone/article/details/110945819

版权

NODEJS 学习笔记专栏收录该内容

9 篇文章 0 订阅

订阅专栏

html 页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>05-http_request</title>
</head>
<body>
    <fieldset>
        <legend><h2>表单1-get请求</h2></legend>
        <form action="http://127.0.0.1:8765/get" method="get">
            <input type="text" placeholder="姓名" name="name">
            <input type="text" placeholder="年龄" name="age">
            <input type="submit">
        </form>
    </fieldset>
    <fieldset>
        <legend><h2>表单2-css文件请求</h2></legend>
        <form action="http://127.0.0.1:8765/css" method="get">
            <input type="submit" value="请求css文件">
        </form>
    </fieldset>
    <fieldset>
        <legend><h2>表单3-post请求</h2></legend>
        <form action="http://127.0.0.1:8765" method="post">
            <input type="text" placeholder="用户名" name="username">
            <input type="text" placeholder="密码" name="password">
            <input type="submit" value="登录">
        </form>
    </fieldset>
    <fieldset>
        <legend><h2>表单4-请求img图片</h2></legend>
        <form action="http://127.0.0.1:8765/img" method="get">
            <input type="submit" value="请求图片">
        </form>
    </fieldset>
</body>
</html>

在这里插入图片描述

js页面

const http = require("http");
const qs = require("querystring");
const url = require("url");
const fs = require("fs");
http.createServer(function (req, res) {
    /*
        1. 先通过method区分get和post
        2. 然后通过pathname区分不同的get
     */
    if (req.method == "GET") {
        const urlObj = url.parse(req.url, true);
        switch (urlObj.pathname) {
            case "/get": {
                res.writeHead(200, {"Content-Type":"text/plain; charset=utf-8"});
                if (urlObj.query.name == "杜甫" && urlObj.query.age == "50") {
                    res.end("注册成功");
                } else {
                    res.end("注册失败");
                }
                break;
            }
            case "/css": {
                res.writeHead(200, {"Content-Type":"text/html; charset=utf-8"});
                res.write("<link rel='stylesheet' type='text/css' href='http://127.0.0.1:8765/myStyle'/>");
                res.end();
                break;
            }
            case "/myStyle": {
                let readS = fs.createReadStream("node02.css");
                readS.pipe(res);
                break;
            }
            case "/img": {
                res.writeHead(200, {"Content-Type":"text/html; charset=utf-8"});
                res.write("<img src='http://127.0.0.1:8765/img1'/>");
                res.end();
                break;
            }
            case "/img1": {
                let readS = fs.createReadStream("max.jpg");
                readS.pipe(res);
            }
            case "/favicon.ico": {
                let readS = fs.createReadStream("favicon.ico");
                readS.pipe(res);
                break;
            }
        }

    } else if (req.method == "POST") {
        res.writeHead(200, {"Content-Type":"text/html; charset=utf-8"});
        // 处理post请求, 获取数据
        let allData = "";
        req.on("data", function (chunk) {
            allData += chunk;
        });
        req.on("end", function () {
            let queryObj = qs.parse(allData);
            if (queryObj.username == "张三" && queryObj.password == "111") {
                res.write("登陆成功");
            } else {
                res.write("登录失败");
            }
            res.end();
        });
    }else {
        res.end();
    }

}).listen(8765, function () {
    console.log("开启监听8765...");
});

/*
    1. 表单get              method:GET     pathname:/get
    2. css文件              method:GET     pathname:/css
    3. 表单post             method:POST    pathname:/
    4. img图片              method:GET     pathname:/img
    5. favicon.ico图标      method:GET     pathname:/favicon.ico

    区分不同请求可以通过两种方法
    1. url的pathname部分  pathname指的是一个url地址端口号后且参数?之前的部分, 以这种方式区分不同请求的方式我们称之为: 路由
    2. 请求的method
 */

believealone

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
request小例

html 页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>05-http_request</title></head><body> <fieldset> <legend><h2>表单1-get请求</h2></lege
复制链接

扫一扫

专栏目录