Node Express 初探

Posted 苍暮之星

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Node Express 初探相关的知识,希望对你有一定的参考价值。

一如既往,先上一张图

 Express 基于 Node.js 平台,快速、开放、极简的 web 开发框架。 

关于Express更多相关知识请链接至官网http://www.expressjs.com.cn/ 

1、访问本地服务

在指定的目录中创建app.js

 1 //express 
 2 var express = require(\'express\');
 3 //app核心
 4 var app = express();
 5 //get
 6 app.get(\'/\', function (req, res) {
 7   res.send(\'Node express 初试探....!\');
 8 });
 9 //访问端口
10 var server = app.listen(1314, function (req,res,next) {
11   var host = server.address().address;
12   var port = server.address().port;
13   console.log(host);

 node 启动app.js文件,浏览器端输入localhost:1314 即可访问响应内容 Node Express 初探.....

2.实现浏览器端url参数路由跳转

 1 //express
 2 var express = require(\'express\');
 3 var app = express();
 4 
 5 //express.static 设置静态资源(images/js/css等)文件目录
 6 app.use(express.static(\'public\'));
 7 
 8 //get请求 根据url实现路由跳转 
 9 app.get(\'/index.html\', function (req, res) {
10     res.sendFile(__dirname + \'/\' + \'index.html\');
11 });
12 
13 //get请求 根据url实现路由跳转 c
14 app.get(\'/login.html\', function (req, res) {
15     res.sendFile(__dirname + \'/\' + \'login.html\');
16 });
17 //端口
18 var server = app.listen(1314, function () {
19     var host = server.address().address;
20     var port = server.address().port;
21     console.log("实例应用,访问地址为 http://%s:%s", host, port);
22 })

inde.html 主页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Node Express路由跳转</title>
</head>
<body>
    <p>实现Express路由跳转......</p>
</body>
</html>
View Code

login登录页面

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 7     <title>Node Express路由跳转</title>
 8 </head>
 9 <body>
10    <form action="" method="GET">
11         姓名:<input type="text" name="username"><br/>
12         密码:<input type="password" name="pass"></br>
13         <input type=\'submit\' value=\'提交\'/>
14     </form>
15 </body>
16 </html>
View Code

3、get提交

//提交表单数据
app.get(\'/app_get\', function (req, res) {
    // 输出json格式
    // 将接收的数据转换为json格式输出
    response = {
        username : req.query.username,
        pass : req.query.pass,
    };
    console.log(response);
    res.end(JSON.stringify(response));
});

设置form属性 <form action="http:///localhost:1314/app_get" method="GET"></form> 即可,响应数据是字符串对象

4、post提交

 1 var express = require(\'express\');
 2 var app = express();
 3 var bodyParser = require(\'body-parser\');
 4 // 创建 application/x-www-form-urlencoded 编码解析
 5 var urlencodedParser = bodyParser.urlencoded({
 6     extended : false
 7 });
 8 app.use(express.static(\'public\'));
 9 app.get(\'/post.html\', function (req, res) {
10     res.sendFile(__dirname + \'/\' + \'post.html\');
11 });
12 app.post(\'/app_post\', urlencodedParser, function (req, res) {
13     // JSON 格式
14     response = {
15         username : req.body.username,
16         pass : req.body.pass,
17     };
18 
19     console.log(response);
20     res.end(JSON.stringify(response));
21 });
22 var server = app.listen(1314, function () {
23     var host = server.address().address;
24     var port = server.address().port;
25     console.log("应用实例,访问地址为 http://%s:%s", host, port);
26 })

设置form属性 <form action="http:///localhost:1314/app_post" method="post"></form> 即可

以上是关于Node Express 初探的主要内容,如果未能解决你的问题,请参考以下文章

node 06

初探node.js

node初探(很全的hello world工程)

Node.js初探

如何添加node express 为windows 启动服务器

Swagger 生成 Node.JS Express 服务器代码