使用Express和允许文件包含服务页面

时间:2020-12-20 11:00:34

I'm building an Multi-Page Application at the moment with Express & Angular. I've set up my folder structure like this:

我正在使用Express&Angular构建一个多页面应用程序。我已经设置了这样的文件夹结构:

project
|- server.js (The webserver)
|- routes.js (The routes to serve the html pages)
|   |- node_modules
|   |- config
|   |- controllers (The routes for the API)
|   |- models (The SQL models - Sequelizer
|   |- client
|      |- client.js (AngularJS main module)
|      |- pages (Splitting the pages into Angular SPA)
|         |- pageFolder (One for each page)
|            |- page.html (The template for this SPA)
|            |- page.js (The AngularJS controller)
|            |- views (The views for the page)

I've done extensive research and this seemed like a very comfortable way to structure everything. The API section of my code works like a charm as does the AngularJS modules on the client-side. I'm struggling with linking the two.

我做了大量的研究,这似乎是一种非常舒适的方法来构建一切。我的代码的API部分就像魅力一样,客户端的AngularJS模块也是如此。我正在努力将两者联系起来。

In my routes.js file, I serve the index files for the particular page that has been requested - for example:

在我的routes.js文件中,我提供了已请求的特定页面的索引文件 - 例如:

var express = require("express");
var router = express.Router();

router.get("/", function(request, response){
    response.sendFile("home.html",{
        root: "client/pages/home"
    });
});

router.get("/otherPage", function(request, response){
    response.sendFile("otherPage.html",{
        root: "client/pages/otherPage"
    });
});


module.exports = router;

This was working perfectly file until I started trying to integrate the AngularJS modules into the pages. I have set up a /resources static route to the node_modules folder, which lets me include AngularJS and other libraries in each of the pages. The AngularJS Controllers, however, are placed in each of the page folders rather than in a centralized folder controllers and when I try include a controller like this for example:

这是完美的文件,直到我开始尝试将AngularJS模块集成到页面中。我已经设置了一个/ resources静态路由到node_modules文件夹,这让我可以在每个页面中包含AngularJS和其他库。但是,AngularJS控制器放在每个页面文件夹中,而不是放在集中式文件夹控制器中,当我尝试包含这样的控制器时,例如:

<script src="home.js"></script>

The server is handling the request as http://website.com/home.js which I can understand but I'm not sure how to allow the pages to include files within their folder?

服务器正在处理请求http://website.com/home.js,我可以理解,但我不知道如何允许页面包含其文件夹中的文件?

Any suggestions would be appreciated :)

任何建议,将不胜感激 :)

1 个解决方案

#1


1  

Can you try this:

你能试试这个:

app.use(express.static('folder1'));
app.use('/folder2', express.static('folder2'));

router.get("/otherPage", function(request, response){
    response.sendFile(__dirname + "/otherPage.html");
});

This way, website.com/folder2 will serve files from folder2 and you can just obtain them by website.com/folder2/file and when you go to website.com/otherPage, it will give you the /otherPage.html and stuff like that.

这样,website.com/folder2将提供来自folder2的文件,您可以通过website.com/folder2/file获取它们,当您访问website.com/otherPage时,它会为您提供/otherPage.html等内容那。

#1


1  

Can you try this:

你能试试这个:

app.use(express.static('folder1'));
app.use('/folder2', express.static('folder2'));

router.get("/otherPage", function(request, response){
    response.sendFile(__dirname + "/otherPage.html");
});

This way, website.com/folder2 will serve files from folder2 and you can just obtain them by website.com/folder2/file and when you go to website.com/otherPage, it will give you the /otherPage.html and stuff like that.

这样,website.com/folder2将提供来自folder2的文件,您可以通过website.com/folder2/file获取它们,当您访问website.com/otherPage时,它会为您提供/otherPage.html等内容那。

相关文章