Question

我无法让我的NodeJS服务器正确返回HTML文件所需的辅助文件。它没有将它们返回到文件中的适当位置，而是做了一些非常棘手的事情。

以下是相关代码：

index.js：

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


var findFile = (function(basename) {
    var results = {
        contentType: '',
        data: ''
    };

    var dataCSS = {
        dir: '../CSS/',
        contentType: 'text/css'
    };
    var dataHTML = {
        dir: '../HTML/',
        contentType: 'text/html'
    };
    var dataJS = {
        dir: '../JS/',
        contentType: 'text/javascript'
    };
    return function(basename) {
        switch (path.extname(basename)) {
            case '.css':
                fs.readFile(dataCSS.dir + basename, function(err, data) {
                    results = {
                        contentType: dataCSS.contentType,
                        data: data
                    };
                });
                break;
            case '.html':
                fs.readFile(dataHTML.dir + basename, function(err, data) {
                    results = {
                        contentType: dataHTML.contentType,
                        data: data
                    };
                });
                break;
            case '.js':
                fs.readFile(dataJS.dir + basename, function(err, data) {
                    results = {
                        contentType: dataJS.contentType,
                        data: data
                    };
                });
                break;
            default:
                fs.readFile(dataHTML.dir + 'Home.html', function(err, data) {
                    results = {
                        contentType: dataHTML.contentType,
                        data: data
                    };
                });
                break;
        }
        return results;
    };
})();

http.createServer(function(req, res) {
    var myUrl = url.parse(req.url);
    var basename = path.basename(myUrl.path);
    console.log('request url: ' + req.url);

    if (req.url !== '/') {
        console.log('File requested: ' + basename);
    } else {
        basename = "Home.html";
    }
    console.log("Basename: " + basename);
    var data = findFile(basename);
    console.log(data);
    res.writeHead(200, { 'ContentType': data.contentType });
    res.write(data.data);
    res.end();
}).listen(8080);

Home.html中：

<!DOCTYPE html>
<html lang="en-US">

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../CSS/myApp.css">
    <script src="../JS/myApp.js"></script>
    <script src="../JS/myCtrl.js"></script>
</head>

<body>    
    <h2>myApp Test</h2>
    <div class="myApp" ng-app="myApp" ng-controller="myCtrl" ng-init="quantity = 10; cost = 5" my-Directive>
        <p>Color: <input type="text" style="background-color:{{myColor}}" ng-model="myColor" value="{{myColor}}"></p>
        <p>Total in dollar (raw exp): {{quantity * cost}}</p>
        <p>Total in dollar (span): <span ng-bind="quantity * cost"></span></p>
        <p> First Name: <input type="text" ng-model="firstName"></p>
        <p> Last Name: <input type="text" ng-model="lastName"></p>
        <h1>Hello, {{firstName + " " + lastName}}</h1>
    </div>
    Are you even changing?!
</body>
</html>

我的代码的当前运行执行此操作：

我在控制台中使用“node index.js”来启动服务器。
我第一次在浏览器中导航到“localhost：8080”，它什么都没显示;在开发窗口中有一个错误，表示我没有正确格式化标题。这不是真的，因为我在每次点击服务器时都在findFile方法中设置它。控制台读数首先如下所示：

Firefox中的开发窗口如下所示：

下一次刷新加载HTML页面，但不受辅助文件的任何影响，即使日志记录显示已请求所有内容：

此时控制台记录：

后续刷新会将页面变成轮盘，每个单独的文件代表方向盘上的数字。而不是HTML页面，其他人可能会显示文本文件的外观。我会把照片丢掉;我觉得我做得太多了。

我在这里做错了什么？我应该采取不同的方式吗？我甚至不得不这样做吗？请发送帮助。

谢谢。

Answer 1

f <- function(x) { x 10 } f(stop("This is an error!"))是异步的，这意味着你给它的回调不会立即发生，它会在以后的某个时间发生。特别是，在fs.readFile函数返回值后发生。 See this related question for more details.

为了使findFile正常工作，只要findFile操作完成，就需要接收回调函数。另请查看promises和async/await作为使用回调的更清晰的替代方法。

fs.readFile

NodeJS无法正确加载其他文件

1 个答案: