我要评论初次写博客，有不足的地方，还请大家多多包涵！
话不多说，我是一个从事前端工作一年的小白，对于前端的知识认识还是比较少的。听大牛说写博客分享可以提升自己的技能。所以就来各位大牛面前献丑一波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：首先是我们的静态的页面，没有多大要求，能有一个装数据的地方就可以的。
<div class="all">
<div class="image">
</div>
<p class="info"></p>
</div>
3：js文件里面，我们这样写
因为要用的是express框架，所以我们先下载上这个框架，打开相应文件夹cmd进入小黑框（我是这样叫的）然后我们输入命令cnpm install express --save这个命令出现以下就是成功了，文件夹里面或多出package.json的文件
其次我么你在js的文件里面引入这个框架，这样写 var ex = require("express");就是引入了，定义一个变量调用他 var app = ex();然后我们可以用这个框架先开启一个服务，代码如下
var ex = require("express");
var app = ex();
app.get("/", function(req, res) {
res.send("你好呀")
});
var r = app.listen(8124, function() {
console.log("开启成功")
})
用我们定义的这个变量写一个gte方法，里面有两个参数，一个是和前台页面相同的一个参数，后面是一个回调函数，函数里面有两个对象，来处理和相应数据 req，res
res.send（）是传送HTTP响应,我们来启动服务，打开相应的文件夹下，cmd进入黑窗口，输入node nono.js 是node+js文件名
服务开启成功，我们打开浏览器，输入我们的端口号 http://www.lhsxpumps.com/_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("你好呀")这段话就可以注释了，
res.writeHead(200, {
"content-type": "text/html;charset=utf-8",
"Access-Control-Allow-Origin": "*"
});
下面我们是要来读取json里面的数据 所以要用到 readFile这个方法，代码如下，其中 这个方法里面有两个参数，一个file是我们上面定义的json文件地址变量，后面跟一个函数，函数里面两个参数err是失败，data就是我们的数据，
如果失败，那就打印一下，只是为了方便看出来，不写也没事，成功之后我们也打印一下，之后在进我们小黑里面输入命令结果如下：其中显示服务开启成功，以及成功获取到数据，
fs.readFile(file,function(err,data){
if(err){
console.log("'失败");
}else{
console.log("成功")
}
})
下面就是比较复杂的一个问题，我也是搞了有一段时间，我们打印一下数据data会显示一堆的二进制的，解决方法是 data.toString()吧他转换成了不是二进制的，在然后我们需要用 var arr1 = JSON.parse(arr); 吧它转出那个对象形式
但是我们要传给前台的必须是字符串形式的，我们还需在转换一下 JSON.stringify(arr1)，这样我们就可以向前台传送数据了，这是真题的后js文件里面的代码
var ex = require("express");
var app = ex();
var fs = require("fs");
var file = "../info/ajaxaa.json"
app.get("/", function(req, res) {
//res.send("你好呀")
res.writeHead(200, {
"content-type": "text/html;charset=utf-8",
"Access-Control-Allow-Origin": "*"
});
fs.readFile(file,function(err,data){
if(err){
console.log("'失败");
}else{
var arr = data.toString();
console.log(arr);
var arr1 = JSON.parse(arr);
console.log(arr1);
res.end(JSON.stringify(arr1))
}
})
});
var r = app.listen(8124, function() {
console.log("开启成功")
})；
前台的获取 ：
我是使用的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标签里面。
var info = $('.info');
var url = "http://127.0.0.1:8124"
$.ajax({
type: "get",
url: url,
async: true,
success: function(res) {
if(res) {
var obj = JSON.parse(res);
console.log(obj);
for(var o in obj) {
console.log(obj[o].p);
var str = `<span>` + obj[o].p + `</span>`
info.html(str)
};
} else {
console.log("失败");
}
}
});
今天这个json的express框架就这么一些了，第一次写博客内容，有不好的也希望大家多指出来，大家一起进步。我会持续更新的。
您可能感兴趣的文章:
如您对本文有疑问或者有任何想说的，请 点击进行留言回复，万千网友为您解惑！
网友评论