客户端 - 服务器架构结构(带节点js) - 在哪里放置index.html文件?

时间:2017-01-06 14:43:24

标签: javascript angularjs node.js architecture

我已经构建了一个服务器客户端应用程序(nodejs - 在服务器上,角度 - 在客户端上)。

我曾经将我的所有代码放在一个项目中(一个文件夹),但后来我觉得将逻辑划分为服务器文件夹和客户端文件夹对我来说更有意义。

我渴望断开服务器代码和客户端代码之间的所有依赖关系,因为每一方都可以独立存在。

问题:

  1. 我在哪里放index.html?
  2. 它显然与客户端有关,但服务器(expressJS)在服务器时加载它。

    1. 让我说我把这个index.html文件放在客户端文件夹中,如下图所示..
    2. 如何让server.js知道它?

      此代码不起作用:

      var app = express();
      app.use(bodyParser.json());
      app.use('/',express.static(__dirname));
      
      app.use('/scripts', express.static(path.join(__dirname,
          'node_modules')));
      
      app.get('/', function (req, res) {
          res.sendFile(express.static(path.join(__dirname + '../client/index.html')));
      });
      

      enter image description here

2 个答案:

答案 0 :(得分:2)

通常使用快递应用,您将拥有一个包含客户资产的“公共”文件夹,index.html就是其中之一。

app.use('/',express.static(path.join(__dirname, '/public')));

然后,运行节点服务器,打开浏览器并将其指向该服务器,express将从“public”文件夹中提供“index.html”。

修复步骤

  • client文件夹重命名为public
  • public文件夹中拖动server,使其像server/public
  • 一样
  • app.use('/',express.static(__dirname));更改为app.use('/', express.static(path.join(__dirname, '/public')));

请注意:应避免使用app.use('/',express.static(__dirname));,而是向公众提供整个服务器目录。

如果您想更好地了解项目布局。 看看yoeman.io,特别是它有快递的项目模板。

http://yeoman.io/

  

Yeoman帮助您启动新项目,规定最佳实践   和工具,以帮助您保持高效。

答案 1 :(得分:1)

var app = express();
app.use(bodyParser.json());
app.use('/',express.static(__dirname));

//it will serve all files in client directory under the '/' route        
app.use('/', express.static(path.join(__dirname, '/client'));
});

//and the client side scripts installed through npm will be served under '/scripts' route
app.use('/scripts', express.static(path.join(__dirname, '/client/node_modules')))

最好在单独的文件夹中提供客户端模块,即在node_module目录中也有client文件夹,你应该安装所有应该从客户端加载的模块。除此之外,client文件夹似乎是公开的,因此值得为整个文件夹提供服务。

如果要为客户端安装模块,请转到终端中的'/client/node_modules'目录并运行npm。所以如果你是linux,那么:

  1. cd client/
  2. npm init
  3. npm install YOUR_DESIRED_MODULE
  4. 如果根目录中的服务器端安装模块的模块