AnguarJS + node.js (web-server.js) 从 url 中删除 hashtag 并由服务器端支持 [英] AnguarJS + node.js (web-server.js) remove hashtag from url and support it by server side

问题描述

据我所知，为了从 angularJS 中删除主题标签，我需要添加以下代码:

As far as i understand in order to remove the hashtag from angularJS i need to add the following code:

config(function($locationProvider) {
    $locationProvider.html5Mode(true);
}).

添加此代码后，我从我的简单服务器 (web-server.js) 获得 404，这是与 angular tuotorial 提供的相同的简单服务器.

after added this code, i get 404 from my simple server (web-server.js) which is the same simple server provided with angular tuotorial.

从 stackoverflow 中，我找到了 2 个链接，它们帮助我了解我需要向服务器添加路由以支持此操作.

From the stackoverflow i found 2 links that helped me to understand that i need to add routing to my server in order to support this operation.

链接中没有标签的AngularJs路由?

路由和清理路径(无标签)不在 angularJS 中工作

好吧，我不明白如何将 web-server.js 添加到我需要的路由

well i didn't understand how to add web-server.js the routing i needed

我以前的链接是:/app/index.html/#cars现在他是/app/index.html/car

my link was previously was: /app/index.html/#cars and now he is /app/index.html/car

我应该如何更改 web-server.js 以满足我的新路由需求?

how should i changed web-server.js in order to fit my new routing needs?

谢谢.

推荐答案

使用路由设置节点服务器最简单、最快捷的方法是使用 Express 框架.

The simlpiest and the fastest way to set up node server with routing is to use Express framework.

使用 Express，您的 Web 应用程序的框架非常简单，如下所示:

With Express very simple skeleton of your webapp would look like this:

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

var app = express();

app.configure(function() {
    app.set('views', __dirname + '/app');
    app.set('view engine', 'ejs');       //EJS template engine (no HTML for now)
    app.use('/public', express.static(__dirname + '/public'));  //specify path to your static files
});

//"car", "bus", and "van" are the pages of your app
app.get('/:page(|car|bus|van)', function(req, res) {
    res.render('index', {
        page: req.params.page     //pass page to the view (just in case)
    });
});

http.createServer(app).listen(80);

然后您必须创建 /app/index.ejs 文件，它实际上是具有一些附加功能的 html 文件.

Then you will have to create /app/index.ejs file which is in fact the html file with some additioal features.

因此，当您在浏览器中导航到 /car、/bus 或 /van 时，您将看到 的内容>index.ejs 文件.

Thus, when you navigate in your browser to /car, /bus, or /van you will see the content of index.ejs file.

希望这有帮助！

编辑

我刚刚更正了 /:page(|car|bus|van) 部分.请尝试最新版本

I've just corrected /:page(|car|bus|van) part. Please try the last version

编辑 2

哦，我忘了说，你必须从命令行npm install ejs 才能开始使用 EJS 模板

Oh, I forgot to say, you have to npm install ejs from command line to start using EJS templates

这篇关于AnguarJS + node.js (web-server.js) 从 url 中删除 hashtag 并由服务器端支持的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！