前台提交数据到node服务器(post方式)


post方式同样有两种办法,一种是表单提交,一种是ajax提交。

在此之前需要安装一个中间件:body-parser,安装好后在app.js头部引入:

1 bodyParser = require('body-parser');

并且添加配置代码:

1 //接收json数据
2 app.use(bodyParser.json()); 3 //extended:true代表可以接收任何数据类型的数据
4 app.use(bodyParser.urlencoded( { extended : true } ));

 1、form提交:

  前台模板文件post.ejs上写如下代码:

1 <form action="/reg" method="post">
2         <input type="text" name="name" />
3         <input type="password" name="password" />
4         <input type="submit"  />
5 </form>

  index.js添加一个路由规则:

 1 //添加路径,通过该路径响应post.ejs模板
 2 router.get('/post',(req,res) => {  3     res.render('post.ejs');  4 });  5 router.post('/reg',(req,res) => {  6     //req.body 用来接收post方式提交的数据
 7     sql('insert into `user` (`id`,`username`,`password`) values (0,?,?)',[req.body.name,req.body.password],(err,result) => {  8         if (err){  9             console.log('[INSERT ERROR] - ',err.message); 10             return; 11  } 12  res.json({ 13             success : '[INSERT SUCCESS] - '
14  }); 15  }); 16 });

 

2、ajax提交:

  前台模板文件post.ejs写如下代码:

 1     <input type="text" name="name" class="name" />
 2     <input type="password" name="password" class="psw" />
 3     <input type="submit" class="submit" />
 4     <script src="/jquery.js"></script>
 5     <script>
 6  $('.submit').click(function () {  7  $.ajax({  8  url : '/reg',  9  type : 'post', 10  data : { 11  name : $('.name').val(), 12  password : $('.psw').val() 13  }, 14  success : function (data) { 15 
16  } 17  }); 18  }); 19     </script>

 

  index.js添加一个路由规则:

  (代码同上)

 

 

 

 

   


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM