javascript - nodejs加载js和css文件的方法

标签 javascript node.js

我很难用 nodejs 加载 css 和 js 文件,这是我目前所拥有的

Js

/** Install nodeJs server the easy way
 *
 *  $ npm install http-server -g     // install http server *  globally
 *  $ cd MyApp                       // navigate to the app's root folder
 *  $ http-server                    //run the server
 *
**/

console.log("Welcome to sandy server");
//Module requires
var http = require("http"),   //load http node module
	fs = require("fs"),       //load file system
	path = require('path'),
	url = require('url'),
    data = require('./data'); //load file index.js in sub-folder data
    
    
//Object "MIMETYPES"
var MIMETYPES = {
		html: "text/html; charset=utf-8",
		jpeg: "image/jpeg",
		jpg: "image/jpeg",
		png: "image/png",
		js: "text/javascript",
		css: "text/css"
	},
	PORT = 8080;


http.createServer(function (request, response){ //Returns a new instance of http.Server.
    console.log("request well recieved",request.url);
	var listener = function (error, contentType){
	    if(error){
          console.log('DIE!', error);
          if(contentType !== "undefined"){
	          response.writeHeader(500, {"Content-Type": contentType});
          }else{
	          response.writeHeader(500, {"Content-Type": "text/plain"}); 
          }
          response.end("<h1>FS READ FILE ERROR: Internal Server Error!</h1>");    
        }
    };
    
    var fileArray = request.url.split('.', 2),
        filenameExtension = fileArray[1];
    
    
    if( MIMETYPES.hasOwnProperty(filenameExtension) ){
    	console.log("MIMETYPES::: ",MIMETYPES[filenameExtension]);
        fs.readFile(request.url, function (error, fileContent){
        	listener(error,MIMETYPES[filenameExtension]);
        	response.writeHead(200, {'Content-Type': MIMETYPES[filenameExtension]});
        	response.write(fileContent);
			response.end(); 
		});
    }
    else{
    	console.log("::: Not in MIMETYPES ::: ");
    	fs.readFile("./spa.html", function (error, fileContent){
    		listener(error);
			response.writeHead(200, {'Content-Type': MIMETYPES["html"]});
			response.write(fileContent);
			response.end();      
    	});
		
    }
	console.log("end of the request");
}).listen(PORT, '127.0.0.1');//run the server on port
console.log("Server running at http://127.0.0.1:" + PORT + "/  see you next time!");

终端

enter image description here

Chrome 控制台

enter image description here

enter image description here

enter image description here

任何人都可以帮助我或告诉我我做错了什么吗? 我只想使用 nodejs 而不是 express 之类的,谢谢。

最佳答案

问题是您正在尝试使用根位置打开文件。 request.url 返回 /css/init.css 并且您正在从同一位置读取文件。在它前面加上 或从您的脚本位置解析相对路径。

关于javascript - nodejs加载js和css文件的方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28794797/

相关文章:

javascript - 将 mxCell 移动到新的绝对坐标

javascript - 每当我执行推送状态时,Statechange 就会触发

node.js - Azure 上的 Node、Express API 应用程序出现容器启动失败错误

javascript - Firebase 配置的哪些部分位于 Nodejs Web 应用程序的服务器端和客户端

node.js - 为什么苹果推送通知服务有时会给我错误 500?

javascript - 如何在初始函数之外以正确的 AMD 方式使用自定义 Dojo 模块?

javascript - Internet Explorer 8 到 11 中的滚动条按钮大小

javascript - 在 Node.js 中使用 readline

node.js - 让 Node 不退出的更好方法?

javascript - 如何在没有 ng-model 的情况下以编程方式更改 angular 2 形式的原始属性