Node.js的路由跳转的一点理解

最新推荐文章于 2024-02-18 08:48:59 发布

舰行天下

最新推荐文章于 2024-02-18 08:48:59 发布

阅读量5.8k

点赞数

分类专栏：其他文章标签： Node.js

本文链接：https://blog.csdn.net/sinat_23156865/article/details/51483781

版权

其他专栏收录该内容

8 篇文章 0 订阅

订阅专栏

这几天学了下Node.js,凭借自己查资料和看教程（cnds）,发现没有找到有关node.js路由跳转的一些东西，所以打算自己写一点儿对node.js的理解，也不知道是对是错，希望对大家有帮助

这个是项目目录

index.html代码

<html>
<body>
这里是静态页面
<form action="http://127.0.0.1:8081/process_get" method="POST">
First Name: <input type="text" name="first_name">  <br>

Last Name: <input type="text" name="last_name">
<input type="submit" value="Submit">
</form>
</body>
</html>

upload.html代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    这里是html页面
</head>
<body>

</body>
</html>

upload.ejs. 和 upload.jade

<html>
<body>
这里是ejs
<form action="http://127.0.0.1:8081/process_get" method="POST">
    First Name: <input type="text" name="first_name">  <br>

    Last Name: <input type="text" name="last_name">
    <input type="submit" value="Submit">
</form>
</body>
</html>

<html>
<body>
这里是jade
<form action="http://127.0.0.1:8081/process_get" method="POST">
First Name: <input type="text" name="first_name">  <br>

Last Name: <input type="text" name="last_name">
<input type="submit" value="Submit">
</form>
</body>
</html>

下面来看代码吧这个是用npm自己生成的一个项目我就是在上面来实现吧具体怎么建立项目请自己查，毕竟学习不能偷懒

// 加载路由控制
var routes = require('./routes/index');
var users = require('./routes/users');

//创建项目实例
var app = express();
// view engine setup定义EJS模板引擎和模板文件位置，也可以使用jade或其他模型引擎
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
//app.set('view engine', 'jade');
//app.set('view engine','html');

// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
// 匹配路径和路由
//访问服务器的静态资源
app.use('/static',express.static(path.join(__dirname, 'static')));
app.use('/', routes);
app.use('/', users);

上面的有中文的是我自己弄上去的注释都很清楚

接下来就是路由了

我在项目目录下创建了一个 static文件夹主要是为了放一些静态资源，比如用到的 html/index.html

router.get('/upload.jade', function(req, res, next) {
  //
  res.render('upload.jade');
  res.end();
});

router.get('/upload.ejs', function(req, res, next) {
  //
  res.render('upload.ejs');
  res.end();
});
//若没有后缀则按视图解析器的后缀
router.get('/upload.html', function(req, res, next) {
  //
  res.render('upload');
  res.end();
});
//跳转到静态页面
router.get('/static', function(req, res, next) {
  //
  res.redirect('/static/html/index.html');
  res.end();

先来看效果地址栏 http://127.0.0.1:3000/static 刷新

访问：http://127.0.0.1:3000/upload.ejs

http://127.0.0.1:3000/upload.jade

这个jade可能会报错没有这个模型*（包）用控制台进入项目目录 npm install jade （下次碰到这种首先就是安装包）

我们用的是ejs视图渲染（不知道是不是这样形容）

要是不加后缀会访问哪一个呢像访问：http://127.0.0.1:3000/upload

这就取决于

app.set('view engine', 'ejs');
//app.set('view engine', 'jade');

这段代码意思就是你用的那个引擎在views目录下如果么有指定后缀就默认渲染引擎

如上代码访问结果是

还有就是访问静态资源；要加

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

并注意要加载使用路由代码前如上面这个代码这样

若么有要访问

http://127.0.0.1:3000/static/html/index.html

是这样的

正确的是

最后我也是初学者就是因为在网上没有找到很好的资料才走了很多弯路希望这个对要学习的人有帮助若没有用对浪费你们宝贵的时间抱歉

而且我也不知道是不是这个样子的如果有错误请大家指点迷津

舰行天下

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
Node.js的路由跳转的一点理解

对 node.js页面或者说是路由选择的一点儿理解。然后就是访问静态资源的一些问题
复制链接

扫一扫

专栏目录

Node.js的路由跳转的一点理解

“相关推荐”对你有帮助么？