Migrated repository
Go to file
2016-03-20 22:54:57 +08:00
bin DoraCMS v1.0.8 版本更新 2015-11-23 15:26:23 +08:00
models DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
public DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
routes DoraCMS V1.1.1版本更新 2016-03-20 22:54:57 +08:00
util DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
views DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
操作文档 DoraCMS v1.0.9版本更新 2015-12-18 16:07:04 +08:00
.gitignore Initial commit 2015-08-15 20:26:59 +08:00
app.js DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
CHANGELOGS.md DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
LICENSE Initial commit 2015-08-15 20:26:59 +08:00
package.json DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
README.md DoraCMS V1.1.1版本更新 2016-03-20 22:00:37 +08:00
robots.txt DoraCMS代码重构 2015-08-30 13:57:49 +08:00
settings.js DoraCMS开源版本 2015-08-15 20:47:42 +08:00

##问题:

  • 1、redis connection to 127.0.0.1:6379 failed 这个是redis连接不上的问题请看这篇文章DoraCMS redis报错问题
  • 2、failed to load c++ bson extension 这个问题不用管,node自己的问题,不影响程序运行
  • 3、今天正式去掉了node_modules运行前需要在代码根目录下执行 npm install 来安装不然会导致不同node或系统兼容性问题感谢@faceair的建议)
  • 4、testuser 用户只有后台查看的权限,作为前端博客还在维护,目的是让用户了解后台结构和相关功能,不允许普通用户有数据库相关操作,请知悉
  • 5、后台数据初始化的方式已变更不用那么麻烦了具体参考DoraCMSV1.0.7升级指南 ###-------------------------------------------------------------------------------

DoraCMS

#DoraCMS

DoraCMS是基于Nodejs+express+mongodb编写的一套内容管理系统结构简单较目前一些开源的cmsdoracms易于拓展特别适合前端开发工程师做二次开发。

代码演示1.基于DoraCMS 定制的博客系统 管理地址:http://www.html-js.cn/admin (账号:testuser,密码doracms

代码演示2.基于 DoraCMS 定制的视频分享站点

操作文档链接:

http://www.html-js.cn/details/Ey20NbBi.html

http://www.html-js.cn/details/VkldQTPs.html

开发文档链接:

http://www.html-js.cn/details/VJpfeMYj.html(不断更新)

注意:开源后陆续发现了一些问题,我都提交了,今后也会持续补充,开发文档或遇到问题请直接参考我博客的文章(http://www.html-js.cn/details/VJpfeMYj.html),

或者在该版块下留言这里会不断更新因为精力有限并不保证word版开发指南会保持最新

###版本更新 2016年3月20日21:45:40 ###版本号v1.1.0 ###更新内容:

  • 1、提取了管理员信息查询的静态方法
  • 2、重新优化了广告模块图片广告管理更方便了
  • 3、修复了一个文档查询的bug过滤掉隐藏的content感谢@jier945的建议
  • 4、修复了文件管理和模板编辑的bug文件读取用相对路径更安全
  • 5、提取了关联对象删除的公共方法
  • 6、添加文档页面添加了一个新增tag的入口
  • 7、去掉了admin路由中的io暂时用不上
  • 8、优化了后台路由添加了adminCtrl过滤器从入口处先过滤一次非法请求提高安全性
  • 9、提取了一些中文信息提示为静态变量

###-------------------------------------------------------------------------------

#DoraCMS开发指南

  • 一、 DoraCMS 安装 2
  • 1.1 安装nodejs 2
  • 1.2 安装Mongodb。 2
  • 1.3 运行DoraCMS 3
  • 1.3.1启动mongodb 3
  • 1.3.2 插入初始数据 4
  • 1.3.3运行DoraCMS 5
  • 1.3.4 访问地址 6
  • 二、 DorCMS 开发 7
  • 2.1 配置文件 7
  • 2.2 关于路由 11
  • 2.3 关于模板 11
  • 2.4 实体类 13
  • 2.5 用到的插件 15
  • 2.6 关于编码 16
  • 三、总结 16
  • 四、FAQ 17

##一、DoraCMS 安装

1.1 安装nodejs

  • DoraCMS 是基于Nodejs 开发的所以要想正常运行DoraCMS 需要nodejs环境。在Nodejs官网(https://nodejs.org/) 根据电脑版本下载对应的安装文件进行安装,安装完成后,打开命令窗口执行 node -v如果出现版本号证明安装成功。我的电脑是64位版本安装了重启之后才生效。

1.2 安装Mongodb。

  • DoraCMS 使用的是Mongodb 的数据库至于Mongodb 的特点和nosql的优势在此就不做详细描述了。安装方法很简单到官网 (https://www.mongodb.org/) 下载对应版本直接安装就可以了。这里有一点需要注意的是如果你安装在D盘安装完成后在D盘根目录下创建文件夹 data ,不然启动mongo会提示数据库路径错误当然你也可以通过命令启动mongodb来指定数据库的路径如果你不想麻烦就照我说的处理就可以了。

  • 1、在本地盘建立一个文件夹最好英文名称通过svn checkout 出DoraCMS的代码svn地址svn://git.oschina.net/doramart/DoraCMS

  • 注:.idea 不属于项目文件夹为webstorm 工程文件,不必理会。

  • 1.3 运行DoraCMS

  • 1.3.1启动mongodb

  • 找到mongodb安装目录下bin文件夹执行 mongod.exe

1.3.2 插入初始数据

  • 找到routes下的validat.js文件,注释下面的代码
  • qq 20151112111825
  • 找到/models/db 下的 adminFunc.js 注释下面的一段直接返回true
  • qq 20151112111915

至此,访问后台页面就不需要登录了,开启服务后,你可以直接访问地址: 管理员添加 http://127.0.0.1:81/admin/manage/adminUsersList 用户组管理 http://127.0.0.1:81/admin/manage/adminGroupList 注意:先添加用户组,在添加管理员,完成上面的操作,把代码还原回去,并重启服务。用刚才设置的管理员信息登录后台。

1.3.3运行DoraCMS

  • 在刚刚svn下载的代码目录下 调出cmd命令窗口执行npm start

  • 如果没有报错,证明运行成功了。

  • 注意DoraCMS 指定了默认端口号为80如果您的机器已经占用了80端口这里会报错如果想修改默认端口号可以到代码的bin目录下 www 文件修改,当然修改完成,访问路径记得带上端口号:

  • 至此doraCMS就运行起来了

1.3.4 进入后台,找到模板配置模块。切换到安装主题选项卡,点击安装。

1.3.5 安装成功后会在可用主题中找到刚安装的主题,在可用主题中点击“启用”,即可激活改主题:

1.3.6 访问地址

前台127.0.0.1 (默认81端口) 后台127.0.0.1/admin

二、DorCMS 开发

2.1 配置文件

  • DoraCMS 的主要配置在 settings.js 中设置(/onlineCMS/models/db/settings.js
    SITETITLE : '前端开发俱乐部', // 站点名称
    SITEDOMAIN : 'http://www.html-js.cn', // 站点域名
    SITEICP : '粤ICP备15038960号-2', // 站点备案号
    SITEVERSION : 'd20151012142453', // 静态资源版本戳
    SYSTEMMAIL : 'doramart@qq.com', // 管理员个人邮箱
    UPDATEFOLDER : process.cwd()+'/public/upload', // 默认上传文件夹本地路径
    TEMPSFOLDER : process.cwd()+'/views/web/temp', // 默认模板文件夹本地路径
    DATAOPERATION : process.cwd()+'/models/db/bat', //数据库操作脚本目录
    DATABACKFORDER : 'C:/softbak/mongodbConfig/mongodata/', // 服务端数据库操作脚本目录
    CMSDISCRIPTION : '前端开发俱乐部,分享前端知识,丰富前端技能。汇集国内专业的前端开发文档,为推动业内前端开发水平共同奋斗。html,js,css,nodejs,前端开发,jquery,web前端, web前端开发, 前端开发工程师',
    SITEKEYWORDS : '前端开发俱乐部,前端俱乐部,DoraCMS,内容管理系统, 前端开发, web前端, 前端开发工程师,前端资源, angularjs, 前端开发工具, nodejs ,boostrap',
    SITEBASICKEYWORDS : '前端开发俱乐部,前端开发,前端俱乐部,DoraCMS', // 基础关键词
  • 针对上面这些静态参数都进行了详细的注释,如果你设置了数据库账号密码,则需要在这里做相应的配置,同时需要在 Dbopt.js 中做相应的数据库连接设置。
### Settings.js 中有四个参数需要注意一下:
- UPDATEFOLDER : process.cwd()+'/public/upload', // 默认上传文件夹本地路径
- TEMPSFOLDER : process.cwd()+'/views/web/temp', // 默认模板文件夹本地路径
- DATAOPERATION : process.cwd()+'/models/db/bat', //数据库操作脚本目录

上面三个参数原则上不用修改UPDATEFOLDER 指定上传文件的目录TEMPSFOLDER 为指定的模板文件夹DATAOPERATION 为执行数据备份的脚本目录文件夹

- DATABACKFORDER : 'C:/softbak/xxxx/', // 服务端数据库操作脚本目录
- DATABACKFORDER 指定数据备份的本地路径。
  • 下面的配置都是后台模块的静态参数:
	SYSTEMMANAGE : new Array('sysTemManage','DoraCMS后台管理'),  // 后台模块(系统管理)
    ADMINUSERLIST : new Array('sysTemManage_user','系统用户管理'),
    ADMINGROUPLIST : new Array('sysTemManage_uGroup','系统用户组管理'),
    ADSLIST : new Array('sysTemManage_ads','广告管理'),
    FILESLIST : new Array('sysTemManage_files','文件管理'),
    DATAMANAGE : new Array('sysTemManage_data','数据管理'), // 数据管理
    BACKUPDATA : new Array('sysTemManage_data_1','数据备份'), // 数据备份
    SYSTEMLOGS : new Array('sysTemManage_logs','操作日志'), // 系统操作日志


    CONTENTMANAGE : new Array('contentManage','内容管理'), // 后台模块(内容管理)
    CONTENTLIST : new Array('contentManage_content','文档管理'),
    CONTENTCATEGORYS : new Array('contentManage_cateGory','文档类别管理'),
    CONTENTTAGS : new Array('contentManage_tag','文档标签管理'), //标签管理
    CONTENTTEMPS : new Array('contentManage_temp','文档模板管理'), //模板管理
    MESSAGEMANAGE : new Array('contentManage_msg','留言管理'), // 留言管理

    USERMANAGE : new Array('userManage','会员管理'), // 后台模块(会员管理)
    REGUSERSLIST: new Array('userManage_user','注册用户管理')
  • 改参数对应后台模板文件 adminTemp.ejs 中的模块列表的:

  • 也就是说,如果新增模块,需要在配置文件(settings.js) 和 adminTemp.ejs 中配置相应的cid。

  • 这个属性是权限控制需要的除此之外加入新模块后需要在权限管理模块加入新模块并配置对应的cid

2.2 关于路由

  • DoraCMS 中所有的请求都是通过nodejs的路由来处理的原理类似于java中的 struts 。 路由文件在routes文件夹下
Admin.js , 后台所有模块管理路由
Content.js 前台文档相关
Index.js 首页相关(也包含文档列表和文档相亲)
System.js 系统操作的相关路由 (比如文件上传、邮件发送等)
Users.js 用户中心的相关请求走这里
Validat.js 后台权限控制(没有授予管理权限(session)会直接过滤掉请求)

2.3 关于模板

  • DoraCMS 是基于ejs 模板引擎来表现前台页面的选择ejs 是因为比jade更好理解一些。属性js的童鞋也好接受ejs的语法来展示数据。DoraCMS 的模板文件都在 views 文件夹下:

  • 解析:

  • 1、views 下的 index.ejs 为首页主体内容sitemap.ejs 是站点地图的主体内容sitemap.ejs是展示给用户看的不需要手动更新。

  • 2、Web 为前台的所有模板文件web根目录下的 do404.ejs, do505.ejs , dosuccess.ejs 是处理操作过程结果反馈的模板,这些是普遍需要用到的。

  • 3、Users 是用户相关页面模板。

  • 4、Temp中包含了公共header和footer以及文档模板aboutMe、blog、lab 都属于文档模板,可以根据自己的需要自行添加。

  • 5、public 文件夹中的模板暂时没用到。

  • 6、Manage 里是后台的所有页面模板adminTemp.ejs 是模板外壳,里面包含了各个模块列表和一些公共的引用。

  • 7、public 文件夹下是公共目录主要放置静态文件包括前台和后台的静态jscss以及DoraCMS 用到的jquery插件等。Public 下的文件都是公开的在app.js 中设置。

2.4 实体类

  • 这里称为“实体类”可能有些不妥在java中这部分确实就叫实体类代表每个对象所具有的属性文件存放于models 文件夹中。每个对象都有详细注释,开发者自己去查看就可以了。

2.5 用到的插件

  • 开发过程中很多功能并不是自己写的用到了npm上比较优秀的一些插件在此选出一些做介绍所有插件在 node_modules 下

  • 1、Express nodejs 框架是DoraCMS的基础框架

  • 2、Gm 图片缩略图,为上传图片生成指定大小的缩略图

  • 3、Moment 时间格式化工具,功能非常强大

  • 4、Nodemailer nodejs邮件发送组件

  • 5、Formidable 文件上传组件

  • 6、Qiniu 七牛云存储组件,用于将文件上传到七牛上

  • 7、Qr-image 用户将自定义链接生成二维码图片的组件,轻量级 很方便

  • 8、Archiver 文件夹压缩工具将指定文件夹压缩为zip

  • 9、Shortid 用在了实体类中用于生成短id替代 mongodb 的长id

  • 10、Validator 用户服务端数据校验,提供很多方法对数据进行校验

  • 11、Ueditor-nodejs 将nodejs和百度的ueditor整合这个组件感觉很有用

  • 12、Mongoose 用于nodejs 连接 mongodb并提供了丰富的数据处理的接口

2.6 关于编码

  • 1、DoraCMS 的编码,前台主要用到了 ejs 模板和ejs语法 展示数据后台主要用到了ejs和 angularjs 来展示数据。不熟悉 angularjs 的童鞋和简单了解一下对于后台展示数据非常方便但是不适合前台因为angularjs 不适合做seo 。
  • 2、DoraCMS 基于 nodejs + express 编写所以前端基本是div+css+js ,服务端主要是js对js比较了解的前端开发者很容易就能上手。
  • 3、DoraCMS 80%的代码都有注释,详细介绍了接口的用途和细节处理,方便查看。

三、总结

  • DoraCMS 开发时间比较短功能并不是很丰富但是麻雀虽小、五脏俱全基本功能都是具备的。由于DoraCMS是本人独立开发由于技术有限难免会有些处理不好的地方或者一些很明显的bug虽然我也在不断的改善如果您发现了问题请您不佞赐教如果确实存在问题我会不断的更新上去这也是开源的目的之所在。如果您有更好的解决方案或者对DoraCMS有更好的想法也可以通过我的博客联系我让我们一起探讨共同进步。

四、FAQ

1、一直没看到说设置数据库密码这样安全么

  • 当然不安全,本地调试可以不用设置密码,程序部署上去肯定是要设置数据库账号密码的,怎样设置呢,给个链接大家可以参考下:
  • http://ibruce.info/2015/03/03/mongodb3-auth/

2、网络上很多cms都很强大为什么要选择DoraCMS

  • 当然目前很多成熟的cms织梦、phpcms等DoraCMS 刚起步自然比不了首先DoraCMS创建的目的是为了更深入的了解nodejs并付诸实践开源的目的也是为了通过案例来不断改进我们的nodejs水平共同提高其次DoraCMS结构清晰、模块简单上手很容易。目前市面的cms结构复杂想要自己修改定制学习成本比较高。初识nodejs的开发者可以了解一个cms实现的基础过程熟悉nodejs的也可以用DoraCMS 来进行二次开发不用再从头开始。DoraCMS 遵循MIT协议完全开源您可以自由定制属于你自己的网站而不必花很多时间去处理最基础的一些东西为了让更多的人去了解和认识nodejs于是DoraCMS 诞生了。

3、演示地址在哪里?

代码演示1.基于DoraCMS 定制的博客系统

代码演示2.基于 DoraCMS 定制的视频分享站点

4、为什么上传图片失败

  • DoraCMS 默认在3个地方用到了上传用户上传头像、添加文档主图、内容详情中文件、图片或附件上传。

  • 其中用户上传头像、添加文档主图默认使用七牛,所以如果您没有配置七牛云存储开发者相关信息,就会上传失败,需要在 /models/db/setting.js 下进行配置:

  • (七牛免费10G空间注册账号就可以获取到相关信息了)。

  • 当然有的童鞋不想用七牛想直接传到网站相关目录也是可以的。DoraCMS 预留的有通过 uploadify 上传图片或文件,而且上传接口自带了图片缩略图截取功能。您可以通过查看 /public/javascripts/webapp.js 下的 initUploadLogoBtn 方法:

function initUploadLogoBtn($scope){
    $("#uploadify").uploadify({
        'swf': '/plugins/uploadify/uploadify.swf',
        'uploader': '/system/upload?type=images&key=userlogo',
        'buttonText': '选择图片',
        'height': 40,
        'width': 138,
        'fileTypeDesc': 'Image Files',
        'fileTypeExts': '*.gif; *.jpg; *.png',
        'auto': true,
        'multi': true,
        'onUploadSuccess' : function(file, data, response) {
                alert("上传成功");
            $scope.logoFormData.logo = data;
            $("#myImg").attr("src",data);
            $('#submitLogo').removeClass('disabled');
        },
        'onComplete': function(event, queueID, fileObj, response, data) {
           
            alert("文件:" + fileObj.name + " 上传成功!");
        },

        'onUploadError' : function(file, errorCode, errorMsg, errorString) {
            alert('The file ' + file.name + ' could not be uploaded: ' + errorString);
        },
        'onError': function(event, queueID, fileObj) {
            alert("文件:" + fileObj.name + " 上传失败!");
        }
    });
}
  • 通过上面的初始化按钮方法,您可以找到后台上传接口和处理方式。这两种上传方式您可以自己选择。