首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

利用Mongoose让JSON数据直接插入或更新到MongoDB

Posted in Javascript onMay 03, 2017

前言

Nodejs基于Javascript，MongoDB脚步同样也是基于Javascript。而且他们的数据存储格式都是JSON，这就是为什么要把他们放在一起的原因了。如果程序前后端能直接处理JSON，我想数据处理过程又可以极大的减化了，代码量又将低少1/5。多么的兴奋啊！让我们来动手验证一下想法吧。

本文重点介绍web前端通过JQuery发起POST提交JSON数据，通过Mongoose直接插入或更新到MongoDB。

工程目录沿用nodejs-demo，增加/mongoose路径及对应文件。

文章目录

  • 配置Mongoose
  • 创建目录及文件
  • 插入数据，POST提交JSON增加一条记录
  • 查询数据，取出刚增加的记录

1. 配置Mongoose

增加mongoose的类库

cd d:/workspace/project/nodejs-demo
npm install mongoose

D:\workspace\project\nodejs-demo\node_modules\mongoose\node_modules\mongodb\node_modu
C:\Program Files (x86)\MSBuild\Microsoft.Cpp\v4.0\Microsoft.Cpp.InvalidPlatform.Targe
e_modules\mongodb\node_modules\bson\build\bson.vcxproj]
mongoose@3.6.10 node_modules\mongoose
├── muri@0.3.1
├── hooks@0.2.1
├── sliced@0.0.3
├── mpath@0.1.1
├── ms@0.1.0
├── mpromise@0.2.1 (sliced@0.0.4)
└── mongodb@1.3.3 (kerberos@0.0.2, bson@0.1.8)

安装时，有64位兼容性错误提示没关系，Mongoose类库安装完成。

增加models目录

mkdir models

在models目录，增加mongodb.js文件

var mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/nodejs');
exports.mongoose = mongoose;

指定Mongo的数据库名为nodejs

2.创建目录及文件

在models目录，增加数据模型Movie.js

var mongodb = require('./mongodb');
var Schema = mongodb.mongoose.Schema;
var MovieSchema = new Schema({
name : String,
alias : [String],
publish : Date,
create_date : { type: Date, default: Date.now},
images :{
coverSmall:String,
coverBig:String,
},
source :[{
source:String,
link:String,
swfLink:String,
quality:String,
version:String,
lang:String,
subtitle:String,
create_date : { type: Date, default: Date.now }
}]
});
var Movie = mongodb.mongoose.model("Movie", MovieSchema);
var MovieDAO = function(){};
module.exports = new MovieDAO();

指定Mongo的数据库集为Movie

数据类型，包括了String,Date,Array,Mixed]

打开app.js增加访问路径

var express = require('express')
, routes = require('./routes')
, user = require('./routes/user')
, movie = require('./routes/movie')
, http = require('http')
, path = require('path')
, ejs = require('ejs')
, SessionStore = require("session-mongoose")(express);
...
app.get('/movie/add',movie.movieAdd);//增加
app.post('/movie/add',movie.doMovieAdd);//提交
app.get('/movie/:name',movie.movieAdd);//编辑查询
app.get('/movie/json/:name',movie.movieJSON);//JSON数据

在routes目录，增加movie.js

var Movie = require('./../models/Movie.js');
exports.movieAdd = function(req, res) {
if(req.params.name){//update
return res.render('movie', {
title:req.params.name+'|电影|管理|moive.me',
label:'编辑电影:'+req.params.name,
movie:req.params.name
});
} else {
return res.render('movie',{
title:'新增加|电影|管理|moive.me',
label:'新增加电影',
movie:false
});
}
};
exports.doMovieAdd = function(req, res) {
res.send({'success':true});
};

在views目录，增加movie.html

<% include header.html %>
<div class="container-fluid">
<div class="row-fluid">
<div class="span8">
<form>
<fieldset>
<legend><%=label%></legend>
<textarea id="c_editor" name="c_editor" class="span12" rows="10"></textarea>
<button id="c_save" type="button" class="btn btn-primary">保存</button>
</fieldset>
<form>
</div>
</div>
</div>
<% include footer.html %>

网页效果：http://localhost:3000/movie/add

利用Mongoose让JSON数据直接插入或更新到MongoDB

3. 插入数据，POST提交JSON增加一条记录

基础环境，都搭建好后，我们开台准备向mongodb中插入数据。

首先创建一个json数据文件，这样我们可以方便点，直接读入这个文件，创建JSON数据对象了。

在public/javascripts/目录，增加movie.json文件

{
"name": "未来警察",
"alias": ["Future X-Cops ","Mei loi ging chaat"],
"publish": "2010-04-29",
"images":{
"coverBig":"/img/movie/1_big.jpg",
"coverSmall":"/img/movie/1_small.jpg"
},
"source":[{
"source":"优酷",
"link":"http://www.youku.com",
"swfLink":"http://player.youku.com/player.php/sid/XMTY4NzM5ODc2/v.swf",
"quality":"高清",
"version":"正片",
"lang":"汉语",
"subtitle":"中文字幕"
},{
"source":"搜狐",
"link":"http://tv.sohu.com",
"swfLink":"http://share.vrs.sohu.com/75837/v.swf&topBar=1&autoplay=false&plid=3860&pub_catecode=",
"quality":"高清",
"version":"正片",
"lang":"汉语",
"subtitle":"中文字幕"
}]
}

在public/javascripts/目录，增加jquery.json-2.4.js类库

<script src="/javascripts/jquery-1.9.1.min.js"></script>
<script src="/javascripts/bootstrap.min.js"></script>
<script src="/javascripts/jquery.json-2.4.js"></script>
<script src="/javascripts/movie.js"></script>
</body>
</html>

在public/javascripts/目录，增加movie.js文件，作为前端脚本

$(function() {
var mdata={};
var url = '/javascripts/movie.json';
$.getJSON(url, function(data) {
mdata=data;
render_editor_form(mdata);
render_event_form(mdata);
});
var render_editor_form=function(data){
$('#c_editor').val($.toJSON(data));
};
var render_event_form=function(){
$('#c_save').on('click',function(event){
var data = {};
data['content'] = mdata;
$.ajax({
type: "POST",
url: '/movie/add',
data: data,
success: function (data, textStatus){
if(data.success){
$('#msg').html('成功保存!');
$('#msg').addClass('alert alert-success');
$(location).attr('href','/movie/'+mdata.name);
} else {
$('#msg').html(data.err);
$('#msg').addClass('alert alert-error');
}
}
});
});
};
});

修改views/footer.html，增加movie.js文件引用，同时增加jquery.json包

<script src="/javascripts/jquery-1.9.1.min.js"></script>
<script src="/javascripts/bootstrap.min.js"></script>
<script src="/javascripts/jquery.json-2.4.js"></script>
<script src="/javascripts/movie.js"></script>
</body>
</html>

网页效果：http://localhost:3000/movie/add

利用Mongoose让JSON数据直接插入或更新到MongoDB

在models/Movie.js，增加save方法

MovieDAO.prototype.save = function(obj, callback) {
var instance = new Movie(obj);
instance.save(function(err){
callback(err);
});
};

在routes/movie.js，调用save方法

exports.doMovieAdd = function(req, res) {
console.log(req.body.content);
var json = req.body.content;
if(json._id){//update
} else {//insert
Movie.save(json, function(err){
if(err) {
res.send({'success':false,'err':err});
} else {
res.send({'success':true});
}
});
}
};

控制台日志

Express server listening on port 3000
{ name: '未来警察',
alias: [ 'Future X-Cops ', 'Mei loi ging chaat' ],
publish: '2010-04-29',
images:
{ coverBig: '/img/movie/1_big.jpg',
coverSmall: '/img/movie/1_small.jpg' },
source:
[ { source: '优酷',
link: 'http://www.youku.com',
swfLink: 'http://player.youku.com/player.php/sid/XMTY4NzM5ODc2/v.swf',
quality: '高清',
version: '正片',
lang: '汉语',
subtitle: '中文字幕' },
{ source: '搜狐',
link: 'http://tv.sohu.com',
swfLink: 'http://share.vrs.sohu.com/75837/v.swf&topBar=1&autoplay=false&plid=3860&pub_ca
quality: '高清',
version: '正片',
lang: '汉语',
subtitle: '中文字幕' } ] }
POST /movie/add 200 57ms - 21b

数据已插入MongoDB

利用Mongoose让JSON数据直接插入或更新到MongoDB

4. 查询数据，取出刚增加的记录

models/Movie.js,增加findByName方法

MovieDAO.prototype.findByName = function(name, callback) {
Movie.findOne({name:name}, function(err, obj){
callback(err, obj);
});
};

routes/movies.js,增加movieJSON

exports.movieJSON = function(req, res) {
Movie.findByName(req.params.name,function(err, obj){
res.send(obj);
});
}

前端javascripts/movie.js，从/movie/json/xxx处取数据

var mdata={};
var url = '/javascripts/movie.json';
var movie=$('#c_editor').attr('movie')
if(movie){
url = '/movie/json/'+movie;
}

修改 views/movie.html

<textarea id="c_editor" name="c_editor" rows="10" <%= (movie?'"movie='+movie+'"':'') %>></textarea>

访问我们的网页

http://localhost:3000/movie/未来警察

利用Mongoose让JSON数据直接插入或更新到MongoDB

数据从/movie/json/未来警察，处读取。完成尝试。

修改操作与插入的操作类似，我就不做演示了。

以上程序代码，大家可自行下载学习。

github地址：https://github.com/bsspirit/nodejs-demo

本地下载：http://xiazai.3water.com/201705/yuanma/nodejs-demo(3water.com).rar

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对三水点靠木的支持。

利用Mongoose让JSON数据直接插入或更新到MongoDB

- Author -

Conan

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
javascript中&quot;/&quot;运算符常见错误
Oct 13 Javascript
JavaScript模板入门介绍
Sep 26 Javascript
IE、FF、Chrome浏览器中的JS差异介绍
Aug 13 Javascript
下拉框select的绑定示例
Sep 04 Javascript
javascript动态创建及删除元素的方法
Dec 22 Javascript
2种jQuery 实现刮刮卡效果
Feb 01 Javascript
jquery实现清新实用的网页菜单效果
Aug 28 Javascript
JavaScript原型及原型链终极详解
Jan 04 Javascript
总结jQuery插件开发中的一些要点
May 16 Javascript
Koa2微信公众号开发之消息管理
May 16 Javascript
JavaScript实现简易计算器小功能
Oct 22 Javascript
Vue实现boradcast和dispatch的示例
Nov 13 Javascript
xmlplus组件设计系列之选项卡（Tabbar)（5）
May 03 #Javascript
javascript过滤数组重复元素的实现方法
May 03 #Javascript
JS实现图片点击后出现模态框效果
May 03 #Javascript
xmlplus组件设计系列之下拉刷新（PullRefresh)（6）
May 03 #Javascript
javascript 判断一个对象为数组的方法
May 03 #Javascript
深入理解node.js之path模块
May 03 #Javascript
判断颜色是否合法的正则表达式(详解)
May 03 #Javascript
DE1103(2) DE1107(3) frg-100(1) 239军机(1) AN-LP1(1) SONY600GR(1) 根德5570(1) DE1105(1) YAESU(1) ICF-903L(1)
You might like
山进SANGEAN ATS-909X电路分析
2021/03/02 无线电
在PHP3中实现SESSION的功能（三）
2006/10/09 PHP
PHP Google的translate API代码
2008/12/10 PHP
ThinkPHP模板之变量输出、自定义函数与判断语句用法
2014/11/01 PHP
谈谈PHP中substr和substring的正确用法及相关参数的介绍
2015/12/16 PHP
PHP编程获取图片的主色调的方法【基于Imagick扩展】
2017/08/02 PHP
实例讲解php实现多线程
2019/01/27 PHP
php连接mysql数据库最简单的实现方法
2019/09/24 PHP
javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox
2008/08/05 Javascript
Prototype Function对象 学习
2009/07/12 Javascript
在网页中使用document.write时遭遇的奇怪问题
2010/08/24 Javascript
网页防止tab键的使用快速解决方法
2013/11/07 Javascript
利用JS判断用户是否上网(连接网络)
2013/12/23 Javascript
浅谈javascript 迭代方法
2015/01/21 Javascript
jQuery实现自动调用和触发某个事件的方法
2016/11/18 Javascript
AngularJS前端页面操作之用户修改密码功能示例
2017/03/27 Javascript
Bootstrap table学习笔记（2） 前后端分页模糊查询
2017/05/18 Javascript
vue-router重定向和路由别名的使用讲解
2019/01/19 Javascript
ES6的解构赋值实例详解
2019/05/06 Javascript
layui实现tab的添加拒绝重复的方法
2019/09/04 Javascript
Pyhton中防止SQL注入的方法
2015/02/05 Python
在Python中处理字符串之isdigit()方法的使用
2015/05/18 Python
在Django的模型和公用函数中使用惰性翻译对象
2015/07/27 Python
Python语言描述KNN算法与Kd树
2017/12/13 Python
基于python中__add__函数的用法
2019/11/25 Python
浅谈keras使用预训练模型vgg16分类,损失和准确度不变
2020/07/02 Python
如何用Python 加密文件
2020/09/10 Python
日本民宿预约平台：STAY JAPAN
2017/07/01 全球购物
ktv中秋节活动方案
2014/01/30 职场文书
护士自我评价
2014/02/01 职场文书
工厂采购员岗位职责
2014/04/08 职场文书
晚自修旷课检讨书怎么写
2014/11/17 职场文书
大连导游词
2015/02/12 职场文书
如何使JavaScript休眠或等待
2021/04/27 Javascript
pytorch中[..., 0]的用法说明
2021/05/20 Python
Beekeeper Studio开源数据库管理工具比Navicat更炫酷
2022/06/21 数据库