javascript - NodeJS + Hapi + CSS 麻烦-6ren

javascript - NodeJS + Hapi + CSS 麻烦

转载作者：太空宇宙更新时间：2023-11-03 17:41:51

25

4

我正在使用 hapi 在 Node js 中创建一个小型虚拟主机这是为了练习，因为我对 Node 不是很熟悉，但我正在尽我所能学习。

我当前的问题是，我正在尝试从包含目录中获取一个 css 文件。使用 Hapi 我的 app.js 看起来有点像这样:

var Path = require("path");
var Hapi = require('hapi');
var HandleBars = require('handlebars');
var server = new Hapi.Server();

server.views({
    engines: {
        html: HandleBars
    },
    path: './views'
});

server.connection({
    port: 5000,
    host: "localhost"
});

server.route({
    method: 'GET',
    path: '/',
    handler: function(request, reply) {
        reply.view('index.html');
    }
});

server.route({
    method: '*',
    path: '/{p*}',
    handler: function(request, reply) {
        reply.view('404.html').code(404);
    }
});

server.route({
    method: 'GET',
    path: '/images/{param*}',
    handler: {
        directory: {
            path: 'public/images'
        }
    }
});

server.route({
    method: 'GET',
    path: '/{file}.css',
    handler: function (request, reply) {
        reply.file("/includes/css/"+request.params.file+".css");
    }
});

server.start(function(err) {
    console.log('Server running at:', server.info.uri);
});

我的 index.html 看起来像这样:

<html>

<head>
    <title>Home</title>
</head>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
<link href="/main.css" rel="stylesheet">

<body>

    <div id="myCarousel" class="carousel slide" data-ride="carousel">
        <!-- Indicators -->
        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner">
            <div class="item active">
                <img src="" alt="First slide">
                <div class="container">
                    <div class="carousel-caption">
                        <h1>Welcome to Beta</h1>
                        <p>Welcome to our site beta, as you will notice a lot of functionality is still being developed. Please be patient!</p>
                        <p><a class="btn btn-lg btn-primary" href="#" role="button">Read Latest Log</a>
                        </p>
                    </div>
                </div>
            </div>
            <div class="item">
                <img src="/images/NewBG.png" alt="Second slide">
                <div class="container">
                    <div class="carousel-caption">
                        <h1>OOHHH the SPOOKS</h1>
                        <p>Watch out for the Spooks!</p>
                        <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn more</a>
                        </p>
                    </div>
                </div>
            </div>
            <div class="item">
                <img src="/images/buttonindie.png" alt="Third slide">
                <div class="container">
                    <div class="carousel-caption">
                        <h1>Proud Supporter of Indie</h1>
                        <p>Welcome to our Indie Game page for State of Grey! a new ariel view pixel horror game based in the VX Ace Game engine. Click our About tab and learn about the team!</p>
                        <p><a class="btn btn-lg btn-primary" href="#" role="button">Browse gallery</a>
                        </p>
                    </div>
                </div>
            </div>
        </div>
        <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left"></span>
        </a>
        <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right"></span>
        </a>
    </div>
    <!-- /.carousel -->
    <div class="container">
        <!-- Example row of columns -->
        <div class="row">
            <div class="col-md-4">
                <h2>{{title1}}</h2>
                <p>{{content}}</p>
                <p><a class="btn btn-default" href="{{detailsLink1}}" role="button">View details &raquo;</a>
                </p>
            </div>


     <div class="col-md-4">
            <h2>{{title2}}</h2>
            <p>{{content}}</p>
            <p><a class="btn btn-default" href="{{detailsLink2}}" role="button">View details &raquo;</a>
            </p>
        </div>
        <div class="col-md-4">
            <h2>{{title3}}</h2>
            <p>{{content}}</p>
            <p><a class="btn btn-default" href="{{detailsLink3}}" role="button">View details &raquo;</a>
            </p>
        </div>
    </div>
    <!--#include virtual="/web/includes/footer.html"-->


</div>
<!-- /.container -->

当我在本地通过 heroku 运行我的主机时，当它被 / 调用时，我似乎找不到 main.css 当我控制台记录路径时，它似乎完美地指向我需要它的地方去。但是它仍然显示为 404 未找到。谁能给我指明一个坚实的方向？提前致谢!

最佳答案

提供路线的顺序很重要。您必须从最具体到最通用。正如 @Pointy 所建议的，您获取 /main.css 的请求被 404 路由隐藏了

{path: '/{p*}',
handler: function(request, reply) {
    reply.view('404.html').code(404);

您将在此处找到有关在 api documentation 中提供静态文件的更多详细信息

关于javascript - NodeJS + Hapi + CSS 麻烦，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28946512/

25

4

0

文章推荐： python - 调试 Ruby/Python/Groovy

文章推荐： c# - 如何在 <%# Eval "or")%> 内联语句中使用 ('column' 条件？

文章推荐：相当于 Ruby 赋值习语的 PHP

node.js - Nodejs - 如何在 ubuntu 中卸载旧版本的 nodejs 和安装新版本的 nodejs
我的 React 项目需要更新 nodejs。那么我如何将我的 Node js 重新安装到 Ubuntu 16.04 中的最新版本。我当前的 Node 版本是 node -v v6.0.0 我当前的
debugging - NodeJS - NodeJS 的分步调试器
我正在寻找逐步调试 NodeJS 服务器代码的有效方法。目前我使用了几十个console.log()，这非常困难。完美的工具可以让我检查堆栈中每个变量的值并逐行跟踪我的程序。首选操作系统 = MacO
javascript - NodeJS 不会导入非 NodeJS 文件
我的网站上有以下两个文件: firebase.js gridsome-server.js firebase.js 是一个“常规”javascript 文件，包含以下内容: import firebas
javascript - Nodejs 从 NodeJS 应用程序的不同文件夹执行二进制文件
我有一个nodejs应用程序从文件夹A执行，二进制X也在文件夹A中执行(使用子进程exec)。二进制 X 在文件夹 A 中生成输出文件 O，因此始终从调用位置开始。我需要nodejs应用程序来在仲裁
javascript - NodeJS - 如何编写连接到 NodeJS 服务器并接收广播消息的客户端
我有以下nodeJS服务器，它似乎工作正常。我想编写一个客户端，从服务器接收消息并根据消息调用一些 JS。涉及的步骤是: 用户访问网址http://server.xyz.com:8080/pa no
node.js - Nodejs - Nodejs 中是否存在类似于请求模块的模块？
我想从 Node 服务器进行其余 api 调用。我目前脑子里有请求模块。您是否会建议用于 Nodejs 中生产实践的 REST 调用(get/post)的任何其他最佳模块？问候，公羊最佳答案 R
javascript - 已弃用消息 : "Auto import from ' process' (property) NodeJS. Process.mainModule？ : NodeJS. 模块 NodeJS.Module 'mainModule' 已弃用"
我正在尝试像这样使用 mainModule: const { mainModule } = require('process'); module.exports = path.dirname(main
node.js - NodeJS 0.10.25 (Ubuntu 14.04) 和 NodeJS 4.1 的区别(编译自 NodeJS.org Source)
我现在对那些版本号真的很困惑。我正在计划一个新项目，想知道这两个版本之间有什么区别。这两个版本之间似乎有很大的跳跃，但现在我找不到区别。使用 4.1 版安全吗？感谢您的帮助! 最佳答案跳转到 v
Javascript/Nodejs 在 nodejs 模块的顶层使用 await
我试图找到我的问题的解决方案，但找不到，并且正在寻找一些“最佳实践示例”。我有一个 nodejs express 应用程序，我的函数在文件中拆分。例如我有这个 Controller (oktacont
javascript - 使用没有 nodeJs 的 nodeJS 模块
这看起来像是一个非常简单的问题，但作为一个 JS 初学者，我想知道是否可以在 webextension 中使用 NodeJS 模块(例如我想使用这个:https://github.com/yaronn
javascript - NodeJs 中的级联 require，要求一个文件需要另一个文件 NodeJs
我有一个文件。a.js class A{ constructor(name){ this.name = name; } displayName(){ conso
node.js - 如何从 NodeJS 管道到 NodeJS？
我想做的是这样的: node x.js | node y.js 文件 x.js 只是打印一个字符串: console.log("hi"); 文件 y.js 旨在通过 process.stdin 获取字
node.js - Nodejs 语法突出显示到 Nodejs 中的终端
对于这个新的nodejs debugger I am working on我想对显示的源代码行进行着色。有什么关于 npm 使用的建议吗？有很多语法荧光笔，但使这种情况有点不同的是输出是到终端；它
javascript - 在 nodejs 公用文件夹中公开 nodejs 库
有没有什么方法可以从 ejs View 中引用包含在 node_modules 文件夹中的 Nodejs 库？我正在使用 expressjs 并且我的客户端库由 /public 文件夹提供，如下所示
javascript - 开始使用 NodeJS - 在 nodeJS 中找不到模块
我是 NodeJS 的新手，我正在尝试根据 NodeJS 站点上的指南在 NodeJS 中创建一个服务器。我已经在我的电脑上安装了 NodeJS 并使用以下代码制作了 app.js 文件。 const
angularjs - 从 Nodejs 向 Nodejs 发送请求
我有一个 nodejs-express 服务器 (1) 与 mongodb 通信，还有一个 web 服务器 (2) 在 nodejs-express 和 Angularjs 中。我正在尝试发出 pos
javascript - 将数据从 javascript 文件传递到 Nodejs 服务器 - Nodejs
我一直在解决(firebase 和 nodejs)问题，这是该问题的第四部分，如何在登录到 server.js 后传递数据我已经尝试过this但未能使其正常工作。基本上，我正在尝试将用户idTok
javascript - (不正确的响应 NodeJS + Socket IO)NodeJS 在页面刷新时在套接字上多次写入数据
每次页面刷新时，NodeJS 都会在套接字上多次写入数据。当我刷新页面时，nodejs 服务器写入套接字的计数增加，在多个页面刷新时，写入计数固定为 3。请检查控制台输出是否有此奇怪的响应。请提出同
javascript - 通过从 NodeJS 中执行 PHP 脚本来重新启动 NodeJS
我在尝试更新文件夹并再次部署其内容时遇到问题。我必须使用 NodeJS 并已获得端口 8080 来使用。我尝试创建一个 php 脚本(update.php): 现在我想启动NodeJS脚本进行更新，
node.js - nodejs 多线程 vs nodejs 单线程
我不明白java多线程系统和Nodejs多线程系统在性能和资源共享方面的区别。由于 NodeJS 为您的程序使用事件循环单线程，但在幕后，它将任务分配给不同的线程，如文件读取或数据库查询。所以它使用多

首页

博学

6Ren·AI

商城

javascript - NodeJS + Hapi + CSS 麻烦