Node.js的express框架

初次写博客，有不足的地方，还请你们多多包涵！

话很少说，我是一个从事前端工做一年的小白，对于前端的知识认识仍是比较少的。听大牛说写博客分享能够提高本身的技能。因此就来各位大牛面前献丑一波0.0

是由于看到node的介绍是想要建立本身的服务，新手比较适合node一些。今天我是来分享一下我使用node.js中的express框架的一些基本心得。

首先你是要有安装node的，，安装教程在这个里面，

http://www.runoob.com/nodejs/nodejs-install-setup.html

按照教程安装好之后，咱们开始使用express框架，我用express写了一个简单的小Demo，只是获取到一条数据（我是一张图片）。

1：咱们须要有是三个文件，一个是html文件，和一个js文件（在js文件里面写服务），第三个是json文件（服务来获取的数据）

ajax.html  和nono.js 以及ajaxaa.json  和 jquery的js文件，json数据比较简单，就一个对象

2：首先是咱们的静态的页面，没有多大要求，能有一个装数据的地方就能够的。

1 <div class="all">
2 <div class="image">
3 
4 </div>
5 <p class="info"></p>
6 </div>

 

 

3：js文件里面，咱们这样写

             由于要用的是express框架，因此咱们先下载上这个框架，打开相应文件夹cmd进入小黑框（我是这样叫的）而后咱们输入命令cnpm install express --save这个命令出现如下就是成功了，文件夹里面或多出package.json的文件

其次我么你在js的文件里面引入这个框架，这样写  var ex = require("express");就是引入了，定义一个变量调用他 var app = ex();而后咱们能够用这个框架先开启一个服务，代码以下

1 var ex = require("express");
2 var app = ex();
3 
4 app.get("/", function(req, res) {
5 res.send("你好呀")
6 });
7 var r = app.listen(8124, function() {
8 console.log("开启成功")
9 })

 

用咱们定义的这个变量写一个gte方法，里面有两个参数，一个是和前台页面相同的一个参数，后面是一个回调函数，函数里面有两个对象，来处理和相应数据 req，res

res.send（）是传送HTTP响应,咱们来启动服务，打开相应的文件夹下，cmd进入黑窗口，输入node nono.js          是node+js文件名

服务开启成功，咱们打开浏览器，输入咱们的端口号  http://localhost:8124/  打开以后能够看到，咱们在send()里面输入的话

到这里咱们已经开启一个服务了，下面咱们开始写获取到json里面的数据，咱们用fs来进行读取和写入，file是对应的咱们的json文件的位置

var ex = require("express");
var app = ex();
var fs = require("fs");
var file = "../info/ajaxaa.json"

 

下面我会粘贴进去一段话，这是用来防止跨域问题的，固然咱们的res.send("你好呀")这段话就能够注释了，

1 res.writeHead(200, {
2 "content-type": "text/html;charset=utf-8",
3 "Access-Control-Allow-Origin": "*"
4 });

 

下面咱们是要来读取json里面的数据 因此要用到  readFile这个方法，代码以下，其中 这个方法里面有两个参数，一个file是咱们上面定义的json文件地址变量，后面跟一个函数，函数里面两个参数err是失败，data就是咱们的数据，

若是失败，那就打印一下，只是为了方便看出来，不写也没事，成功以后咱们也打印一下，以后在进咱们小黑里面输入命令结果以下：其中显示服务开启成功，以及成功获取到数据，

1 fs.readFile(file,function(err,data){
2 if(err){
3 console.log("'失败");
4 }else{
5 console.log("成功")
6 }
7 })

 

下面就是比较复杂的一个问题，我也是搞了有一段时间，咱们打印一下数据data会显示一堆的二进制的，解决方法是 data.toString()吧他转换成了不是二进制的，在而后咱们须要用 var arr1 = JSON.parse(arr); 吧它转出那个对象形式

可是咱们要传给前台的必须是字符串形式的，咱们还需在转换一下 JSON.stringify(arr1)，这样咱们就能够向前台传送数据了，这是真题的后js文件里面的代码

 1 var ex = require("express");
 2 var app = ex();
 3 var fs = require("fs");
 4 var file = "../info/ajaxaa.json"
 5 
 6 app.get("/", function(req, res) {
 7 //res.send("你好呀")
 8 res.writeHead(200, {
 9 "content-type": "text/html;charset=utf-8",
10 "Access-Control-Allow-Origin": "*"
11 });
12 fs.readFile(file,function(err,data){
13 if(err){
14 console.log("'失败");
15 }else{
16 var arr = data.toString();
17 console.log(arr);
18 var arr1 = JSON.parse(arr);
19 console.log(arr1);
20 res.end(JSON.stringify(arr1))
21 }
22 })
23 });
24 var r = app.listen(8124, function() {
25 console.log("开启成功")
26 })；

 

前台的获取 ：

 我是使用的jq的ajax获取的，info是p标签，url是咱们后台本身启动的服务的接口，$ajax里面是有基本的四个属性，type是咱们要用get仍是post来操做，咱们本次讲的是get,下次试一下post

url就是咱们的后台接口，asyns:是否异步处理，默认的true，success是成功以后的操做，一个函数，里面是res成功，也是有一个判断，若是让成功，咱们就获取到这个对象，获取到的是后台传来的字符串，咱们是呀操做对象的，用json.parse来把字符串转换成对象形式，json.stringify是把对象转换成字符串形式。

获取到这个对象以后，用for   in 来循环这个兑现，咱们的object[o],是咱们的每个对象数据，object[o].p就是获取到咱们的数据，能够把它写进我么你的p标签里面。

 1 var info = $('.info');
 2 var url = "http://127.0.0.1:8124"
 3 $.ajax({
 4 type: "get",
 5 url: url,
 6 async: true,
 7 success: function(res) {
 8 if(res) {
 9 var obj = JSON.parse(res);
10 console.log(obj);
11 for(var o in obj) {
12 console.log(obj[o].p);
13 var str = `<span>` + obj[o].p + `</span>`
14 info.html(str)
15 };
16 } else {
17 console.log("失败");
18 }
19 }
20 });

 

 

今天这个json的express框架就这么一些了，第一次写博客内容，有很差的也但愿你们多指出来，你们一块儿进步。我会持续更新的。