javascript – 使用node.js提供CSS和JS包含的基本网页

前端之家收集整理的这篇文章主要介绍了javascript – 使用node.js提供CSS和JS包含的基本网页前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我来自(传统的)服务器端脚本( PHP)背景,我正在尝试使用Node来查看大惊小怪.

目标:提供一个简单的Web文档,其中包含一些样式表和脚本.

我的node.js脚本:

var http = require('http');
var fs = require('fs');

fs.readFile('index.html',function (err,html) {
    if (err) {
        throw err; 
    }       
    http.createServer(function(request,response) { 
        response.writeHeader(200,{"Content-Type": "text/html"});  
        response.write(html);  
        response.end();  
    }).listen(1337,'127.0.0.1');
});

index.html的:

<!DOCTYPE html>
<html>
    <head>
        <Meta charset='utf-8'> 
        <title>Node.js test</title>
        <link rel="stylesheet" media="screen" type="text/css" href="css/plugin.css" />
        <link rel="stylesheet" media="screen" type="text/css" href="css/xGrid.css" />
        <link rel="stylesheet" media="screen" type="text/css" href="css/jquery-ui/jquery-ui-1.10.1.custom.min.css" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
        <script src="js/slate.js"></script>
        <script src="js/slate.portlet.js"></script>
        <script src="js/slate.message.js"></script>
        <script src="js/plugin.js"></script>
    </head>
    <body>
        <h1 class="styled-h1">Test</h1>
    </body>
</html>

我面临的问题:

这两个脚本包括来自Google CDN的文件加载到文件中.但是,从我的本地文件系统调用的每个其他样式表或脚本都被解释为text / html,因此没有预期的效果.以下是Google Chrome控制台的屏幕截图:

我想知道为什么会这样.

PS:我知道我可以使用像Express这样的框架来简化操作,但我想首先掌握基础知识.

解决方法

简单:您始终将Content-Type标头设置为text / html.此外,它将始终为您的index.html文件提供服务.看:
fs.readFile('index.html',{"Content-Type": "text/html"});  // <-- HERE!
        response.write(html);  // <-- HERE!
        response.end();  
    }).listen(1337,'127.0.0.1');
});

您应该解析URL,查找您想要的文件,读取其内容并将其写入响应(如果存在),否则将发生404错误.此外,您还需要设置正确的标头.

那么,你还想自己做吗?
至少,尝试像send这样的基本静态文件服务器.

原文链接:https://www.f2er.com/js/158976.html

猜你在找的JavaScript相关文章