Details about processing js static resource file requests and details about js static resource files
This article provides examples of how to process js static resource file requests for your reference. The specific content is as follows:
Html file
<!DOCTYPE html>
Css file
*{ margin:0; padding:0;}html,body{ font-size:14px; color:#000;}.box{ margin:50px auto; width:300px; height:300px; background:#e3bd83; border:10px solid #e0f2be;}
JS files
var box = document.getElementById('box');box.onclick = function(){ this.style.background = "red"}
Server File
Var http = require ('http'), fs = require ('fs'), url = require ('url'); // create a service var server1 = http. createServer (function (req, res) {// parse the directory name of the file in the client request address and the data content transmitted to the current server var urlObj = url. parse (req. url, true), pathname = urlObj ["pathname"], query = urlObj ["query"]; // short for try catch exception to prevent the request resource file from being nonexistent. If we do not add try catch, the service will terminate. This is not good, so we add try catch to catch exceptions // requests for processing static resource files (HTML/CSS/JS ...) -> front-end routing var reg = /\. (HTML | JS | CSS | JSON | TXT | ICO)/I; if (reg. test (pathname) {// obtain the suffix of the request file var suffix = reg.exe c (pathname) [1]. toUpperCase (); // obtain the MIME type var suffixMIME = "text/plain" of the current file based on the suffix of the request file; // switch (suffix) corresponding to the TXT text) {case "HTML": suffixMIME = "text/html"; break; case "CSS": suffixMIME = "text/css"; break; case "JS ": suffixMIME = "text/javascript"; break; case "JSON": suffixMIME = "application/json"; break; case "ICO": suffixMIME = "application/octet-stream "; break;} try {// read the content or code in the file according to the specified directory (the read content is in string format) var conFile = fs. readFileSync (". "+ pathname," UTF-8 "); // rewrite the response header information: Tell the client's browser what MIME type the returned content is, and specify the format of the returned content as UTF-8, avoid garbled res. writeHead (200, {'content-type': suffixMIME + '; charset = UTF-8'}) // The content returned from the server to the client is also a string of res. end (conFile)} catch (e) {res. writeHead (404, {'content-type': 'text/plain; charset = UTF-8 '}); res. end ("request file is not found")}/* MIME type: each resource file has its own ID type, for example: the MIME type of HTML files is "text/html ". the MIME type of the css file is "text/css". The browser renders the file according to the MIME type of the Code */} // try {// var con = fs. readFileSync (". "+ pathname," UTF-8 "); // res. end (con); //} catch (e) {// res. end ("request file is not find") //} // if (pathname = "/index.html") {// var con = fs. readFileSync (". /index.html "," UTF-8 "); // res. end (con); // return; //} // if (pathname = "/index.css") {// con = fs. readFileSync (". /index.css "," UTF-8 "); // res. end (con); // return; //} // if (pathname = "/index. js ") {// con = fs. readFileSync (". /index. js "," UTF-8 "); // res. end (con); // return; //}) // configure the port server1.listen (80, function () {console. log ("server is success, listening on 80 ");})
The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.