如何使用nodejs加载js和css文件

吉尔达斯·坦博

我很难用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!");

终端

在此处输入图片说明

Chrome控制台

在此处输入图片说明

在此处输入图片说明

在此处输入图片说明

有人可以帮我吗,或者告诉我我做错了什么?我只想使用nodejs不表达或谢谢你的东西。

Zaynetro

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

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在Xcode 7.2中使用UIWebViews加载网站的CSS和JS文件?

来自分类Dev

nodejs表达css和js未加载

来自分类Dev

NodeJS表达CSS和JS未加载

来自分类Dev

如何加载CSS和JS

来自分类Dev

如何使用javascript / jquery加载资源javascript和css文件

来自分类Dev

应用引擎加载CSS和JS文件

来自分类Dev

在Express中加载CSS和JS文件

来自分类Dev

如何使用CSS,JS和图像调用HTML文件?

来自分类Dev

NodeJS无法加载CSS文件

来自分类Dev

如何从一个HTML文件加载所有CSS和JS?

来自分类Dev

Vue-如何在组件中加载CSS和JS文件?

来自分类Dev

如何从一个html文件加载所有CSS和JS?

来自分类Dev

如何使用HTMLTextWriter加载CSS文件

来自分类Dev

css和js文件未在codeigniter中使用$ this-> load-> view加载

来自分类Dev

为什么NGINX无法使用正确的CSS和JS文件加载我的React应用

来自分类Dev

使用Spring Boot安全性加载CSS和JS文件

来自分类Dev

如何使用 DropDown 加载和打开文件?

来自分类Dev

如何使用Queue.js和D3.js加载多个文件?

来自分类Dev

如何使用Queue.js和D3.js加载多个文件?

来自分类Dev

如何使用nodejs和HAPI上传文件?

来自分类Dev

Maven:如何更新html文件以使用新的缩小和串联的JS和CSS文件?

来自分类Dev

加载自定义wordpress插件的js和css文件

来自分类Dev

配置Flask以正确加载Bootstrap js和CSS文件

来自分类Dev

CakePHP 2.6.0无法加载CSS和JS文件

来自分类Dev

将本地CSS和JS文件加载到WKWebView

来自分类Dev

在WordPress中加载多个CSS和JS文件

来自分类Dev

在WordPress中加载多个CSS和JS文件

来自分类Dev

似乎无法将CSS和JS加载到JSF文件

来自分类Dev

应用程序的基础无法加载js和CSS文件

Related 相关文章

热门标签

归档