2021-07-20 Node.js localhost:3000拒绝访问 + HTTP请求 /响应 报文

2021/7/20
今天又是改错的一天，出现localhost无法访问的毛病，真是不入行者不知如何搜解救标题啊，翻遍了很多的博客才知道是自己iis和ipv6上的问题
https://blog.youkuaiyun.com/ambertian/article/details/70238020
https://www.cnblogs.com/rulasann/p/9442420.html
推荐两位大佬的博客，根据他们的帮助解决了困扰我半天的问题，无比感谢

一、http协议

超文本传输协议（英文：HyperText Transfer Protocol，缩写：HTTP）规定了如何从网站服务器传输超文本到本地浏览器，它基于客户端服务器架构工作，是客户端（用户）和服务器端（网站）请求和应答的标准。
简而言之，就是客户端与服务器端达成一个共识，使用HTTP协议进行请求和响应

二、报文

在HTTP请求和响应的过程中传递的数据块就叫报文，包括要传送的数据和一些附加信息，并且要遵守规定好的格式。

一）请求报文

结构：
行	POST /s?ie=utf-8 HTTP/1.1
头	Host：atguigu.com Cookie: name=guigu Content-type: application/x-www-form-rulencoded
空行	必不可少
体	username=admin&password=admin

1.请求方式 （Request Method）

• GET 请求数据
• POST 发送数据

2. 请求地址 （Request URL）

app.on('request', (req, res) => {
     req.headers  // 获取请求报文
	//请求报文内具体某一项  req.headers['名称']
     req.url      // 获取请求地址
     req.method   // 获取请求方法
 });

//用于创建网站服务器的模块
const http = require('http');

//app对象就是网站服务器对象
const app = http.createServer();

// 当客户端发送请求的时候
app.on('request', (req, res) => {

    // 获取请求方式  req.method
    // console.log(req.method);   ==> GET

    // 获取请求地址  req.url
    // console.log(req.url);   ==>1./   2./favicon.ico

    //获取请求报文信息    req.headers 
    console.log(req.headers); 

    //要求：localhost:3000 或者 localhost:3000/index响应主界面
    // localhost:3000/list 响应list界面
    if (req.url == '/index' || req.url == '/') {
        res.end('Welcome to homepage');
    } else if (req.url == '/list') {
        res.end('Welcome to listpage');
    } else {
         res.end('NOT FOUND');
    }

});
// 监听3000端口
app.listen(3000);
console.log('服务器已启动，监听3000端口，请访问 localhost:3000')

二）响应报文

结构：
行	HTTP/1.1 200 OK
头	Content-Type: text/html;charset=utf-8 Content-length: 2048 Content-encoding: gzip
空行	必不可少
体	服务器端响应内容，由开发人员设定

1. HTTP状态码

• 200 请求成功
• 404 请求的资源没有被找到
• 500 服务器端错误
• 400 客户端请求有语法错误

2.内容类型

• text/html
• text/css
• application/javascript
• image/jpeg
• application/json

如： Content-Type: text/html;charset=utf-8

app.on('request', (req, res) => {
     // 设置响应报文
      //text/html---以html文件形式响应
        //charset = utf-8; ---防止出现汉字乱码现状
     res.writeHead(200, {'Content-Type': 'text/html;charset=utf8' });
 });

三）HTTP请求与响应处理

//用于创建网站服务器的模块
const http = require('http');
const url = require('url');

//app对象就是网站服务器对象
const app = http.createServer();


// 当客户端发送请求的时候
app.on('request', (req, res) => {


    // 获取请求方式  req.method
    // console.log(req.method);   ==> GET

    // 获取请求地址  req.url
    // console.log(req.url);   ==>1./   2./favicon.ico

    //获取请求报文信息    req.headers 
    // console.log(req.headers['accept']); 
    res.writeHead(200, {
        //text/html---以html文件形式响应
        //charset = utf-8; ---防止出现汉字乱码现状
        'content-type': 'text/html;charset=utf-8'
    })

    console.log(req.url);   // ---  /list?name=zhangsan&age=8

    //1）要解析的url地址
    //2）将查询参数解析成对象形式
    let {query, pathname} =  url.parse(req.url, true);
    console.log(query.name);  //  zhangsan
    console.log(query.age);   //  8
    console.log(pathname);   //----  /list

    //要求：localhost:3000 或者 localhost:3000/index响应主界面
    // localhost:3000/list 响应list界面
    if (pathname == '/index' || pathname == '/') {
        res.end('<h2>欢迎来到主页</h2>');
    } else if (pathname == '/list') {
        res.end('Welcome to listpage');
    } else {
         res.end('NOT FOUND');
    } 


        // res.end('welcome come to ....')
});
// 监听3000端口
app.listen(3000);
console.log('服务器已启动，监听3000端口，请访问 localhost:3000')