1. Start generating examples using the HTTP module

let http = require('http'); let port = 3000; Http.createserver ((req,res)=>{// Listen for a callback when the request comes in //req stands for client, which is a readable stream //res stands for server, It is a writable stream res.setHeader(' content-type ','text/plain; Charset =utf8') res.write(" girl "); res.end(); / / called end after the response}). Listen (port, () = > {the console. The log (` server is started on the ${port} `)}); // Port number Use a port number larger than 3000Copy the code

2. Load an HTML file on top of it

let http = require('http'); let port = 3000; let fs = require('fs'); Http.createserver ((req,res)=>{// Listen for a callback when the request comes in //req stands for client, which is a readable stream //res stands for server, // fs.readFile('index.html',function(err,data){// res.end(data) //}) res.setheader (' content-type ','text/ HTML; Charset = UTF-8 ') fs.createreadStream ('index.html').pipe(res)}).listen(port,()=>{console.log(' server already started on ${port} ')}); // Port number Use a port number larger than 3000Copy the code

Again, the problem with this approach is that every request will return HTML

Using the third step needs to load out the CSS file, needs to dynamically request

The requirements achieved look like this:

  • Returns different contents based on different paths
  • If/is accessed, display the home page index.html
  • If the file is accessed, the file is read back
  • If it is a folder, the default is index.html
  • Return 404 if file does not exist

Code implementation

let http = require('http'); let port = 3000; let fs = require('fs'); let path = require('path') let url = require('url'); Http.createserver ((req,res)=>{ 404 let {pathName,query} = url.parse(req.url,true); Fs.stat ('.'+ pathName,function(err,stats){// console.log(err," error ", pathName) if(err){res.statusCode = 404; res.end(`${pathname} not found`) }else if(stats.isFile()){ fs.createReadStream('.'+pathname).pipe(res); }else if(stats.isDirectory()){ // console.log('.'+pathname) res.setHeader('Content-Type','text/html; charset=utf-8') let p = path.join('.'+pathname,'index.html'); fs.createReadStream(p).pipe(res) } }) // res.setHeader('Content-Type','text/html; Charset = utf-8 ') / / fs createReadStream (' index.html '). Pipe (res)}). Listen (port, () = > {the console. The log (` server is started on the ${port} `)}); // Port number Use a port number larger than 3000Copy the code

Can achieve access to different types of.css files, the default index.html files

Access error display prompt; ‘

Access the directory default index.html file

There is another problem here, and that is the code header problem

The code header is what I said I wrote:

res.setHeader('Content-Type','text/html; charset=utf-8')Copy the code

Or HTML type:

<meta charset="UTF-8">
Copy the code

Now we need to add headers dynamically

Make it if it is:

‘.js’:’application/javascript’,

‘.css’:’text/css’,

‘.html’:’text/html’,

Content-type like this

Preliminary writing:

It’s not a good problem to write this way, many file types

Node has a MIME module to help solve this problem

Installation process and Method:

let http = require('http'); let port = 3000; let fs = require('fs'); let path = require('path') let url = require('url'); // parse a path into an object const mime = require('mime'); Http.createserver ((req,res)=>{// Listen for a function that executes a callback when the request comes in let {pathName,query} = url.parse(req. Url,true); fs.stat('.'+pathname,function(err,stats){ if(err){ res.statusCode = 404; res.end(`${pathname} not found`) }else if(stats.isFile()){ console.log(mime.getType(pathname),pathname) res.setHeader('Content-Type',mime.getType(pathname)+'; charset=utf-8') fs.createReadStream('.'+pathname).pipe(res); }else if(stats.isDirectory()){ res.setHeader('Content-Type','text/html; charset=utf-8') let p = path.join('.'+pathname,'index.html'); Fs. CreateReadStream (p). Pipe (res)}})}). Listen (port, () = > {the console. The log (` server is started on the ${port} `)});Copy the code

The final implementation code.

Have a problem please big brothers point out.