文档章节

node-vue-MongoDB从构建项目到服务器部署

疯狂的亮坨坨
 疯狂的亮坨坨
发布于 2017/09/11 11:56
字数 938
阅读 23
收藏 0
点赞 0
评论 0

用到技术:node-vue-vuex-axios-es6/es7-mongodb 记录一下项目从无到有到服务器部署 Centos 6 MongoDB 3.2.7

一、利用vue-cli构建项目: 1、安装vue-cli至全局

 npm install -g vue-cli

2、使用vue-cli初始化项目:

 vue init webpack-simple node-vue-demo

3.安装依赖:

npm install

4.运行项目:

npm run dev

二、启动node服务及安装mongodb 1.在项目文件夹下创建server文件夹放node代码 2.在server文件夹下创建app.js

const api = require('./api')
const fs = require('fs')
const path = require('path')
const bodyParser = require('body-parser')
const express = require('express')
const app = express()

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(api);

// 静态文件
app.use(express.static(path.resolve(__dirname, '../dist')))
app.get('*', function(req, res) {
    const html = fs.readFileSync(path.resolve(__dirname, '../dist/index.html'), 'utf-8')
    res.send(html)
})

//允许跨域访问
app.all('*',function (req, res, next) {
	console.log(req,res)
	res.header("Access-Control-Allow-Origin", "*");
    res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    next();
});

// 监听80端口
app.listen(80);
console.log('server is running 80');

3.创建api.js

"use strict";
const models = require('./db');
const express = require('express');
const router = express.Router();

// 创建账号
router.post('/api/login/createAccount',(req,res) => {
    let newAccount = new models.Login({
        account : req.body.account,
        password : req.body.password
    });
    newAccount.save((err,data) => {
        if (err) {
            res.send(err);
        } else {
            res.send('Create success');
        }
    });
});

// 获取全部账号
router.get('/api/login/getAccount',(req,res) => {
    // 查找数据库
    models.Login.find((err,data) => {
        if (err) {
            res.send(err);
        } else {
            res.send(data);
        }
    });
});

module.exports = router;

5.安装下载并安装mongodb(linux安装方法)

这里我们在官网下载源码进行安装. 下载地址: https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel62-3.2.7.tgz

使用wget下载

cd /usr/local
wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel62-3.2.7.tgz
tar -xvf mongodb-linux-x86_64-rhel62-3.2.7.tgz
mv mongodb-linux-x86_64-rhel62-3.2.7 mongodb
配置环境变量

修改/etc/profile, 添加如下内容

export MONGODB_HOME=/usr/local/mongodb
export PATH=$MONGODB_HOME/bin:$PATH
执行命令:
vim /etc/profile
source /etc/profile

查看mongodb版本信息 mongod -v


启动

创建数据库目录

MongoDB需要自建数据库文件夹.
mkdir -p /data/mongodb
mkdir -p /data/mongodb/log
touch /data/mongodb/log/mongodb.log
添加配置文件
新建mongodb.conf配置文件, 通过这个配置文件进行启动.
vim /etc/mongodb.conf
配置文件内容:
dbpath=/data/mongodb
logpath=/data/mongodb/log/mongodb.log
logappend=true
port=27017
fork=true
##auth = true # 先关闭, 创建好用户在启动

通过配置文件启动
mongod -f /etc/mongodb.conf
about to fork child process, waiting until server is ready for connections.
forked process: 2814
child process started successfully, parent exiting
出现successfully表示启动成功了.

进入 MongoDB后台管理 Shell
cd /usr/local/mongodb/bin
./mongo
创建数据库

use test
switched to db test
创建成功.

创建用户, 设置权限
db.createUser(
    {
        user: "test",
        pwd: "test",
        roles: [ { role: "readWrite", db: "test" } ]
    }
)

4.连接mongodb

const mongoose = require('mongoose');
// 连接数据库
mongoose.connect("mongodb://admin:Password@172.0.0.1:27017/admin",{useMongoClient:true});
//如没有创建用户则:"mongodb://172.0.0.1:27017/test

const db = mongoose.connection;
db.once('error',() => console.log('Mongo connection error'));
db.once('open',() => console.log('Mongo connection successed'));

const loginSchema = mongoose.Schema({
    account : String,
    password : String
});


const Models = {
    Login : mongoose.model('Login',loginSchema)
}

module.exports = Models;

5.启动node服务

node  /server/app.js

6.vue调用node服务

<template>
  <div class="hello">
    <img src="../assets/logo.png">
    <h2>Hello</h2>
    <div>
      <p>账号:<input type="text" v-model='account'></p>
      <p>密码:<input type="text" v-model='password'></p>
      <button @click='login'>创建</button>
      <button @click='query'>查看创建</button>
    </div>
    <ul>
      <li style="display:block;" v-for="(val, key) in list">
        <span>用户名:{{val.account}}密码:{{val.password}}</span>
      </li>
    </ul>
  </div>
</template>

<script>
import http from "./../lib/http";
import apiUrl from "./../lib/ApiSetting";
export default {
  name: 'hello',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      account:'',
      password:'',
      list:{}
    }
  },
  created() {
     
  },
  methods: {
    login(){
      if(this.account&&this.password){
        http(apiUrl.createAccount,
          {
            account:this.account,
            password:this.password
          })
        .then((res)=>{
          alert('创建成功')
        })
      }
    },
    query(){
      http(apiUrl.getAccount)
      .then((res)=>{
        console.log(res.data)
        this.list = res.data
      })
    }
  }

}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
  font-weight: normal;
}

ul {
  list-style-type: none;
  padding: 0;
}

li {
  display: inline-block;
  margin: 0 10px;
}

a {
  color: #42b983;
}
</style>

三、node服务常驻linux系统

$ sudo npm install forever -g   #安装
$ forever start ./server/app.js          #启动
$ forever stop ./server/app.js         #停止
$ forever start -l forever.log -o out.log -e err.log ./server/app.js   #输出日志和错误
//此次有个小坑,如果进入server里面运行app.js会提示未找到模块

部署完成 GitHub地址:https://github.com/474782977/node-vue

© 著作权归作者所有

共有 人打赏支持
疯狂的亮坨坨
粉丝 0
博文 1
码字总数 938
作品 0
Spring Cloud-Honghu Cloud分布式微服务云系统—技术点

鸿鹄Cloud是基于springcloud的,spring cloud本身提供的组件就很多,但我们需要按照企业的业务模式来定制企业所需要的通用架构,那我们现在需要考虑使用哪些技术呢? 下面我针对于spring cl...

itcloud ⋅ 04/25 ⋅ 0

Vue命令行工具vue-cli

Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置,带来现代化的前端开发流程。只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可...

韦姣敏 ⋅ 前天 ⋅ 0

Node连接MySQL并封装其增删查改

Node连接MySQL并封装其增删查改 Node连接Mysql 说到node,可能大家会想到MOngoDB作为数据库,这里将会介绍node与mysql的连接,并分享了封装好的实例代码,在项目开发中可直接使用。下一篇博客...

优惠券活动 ⋅ 05/18 ⋅ 0

vue入门环境搭建及demo运行

vue简介: Vue.js 是一套构建用户界面的渐进式框架。他自身不是一个全能框架——只聚焦于视图层。因此它非常容易学习,非常容易与其它库或已有项目整合。在与相关工具和支持库一起使用时,V...

挑战者666888 ⋅ 05/22 ⋅ 0

mongodb安裝及初相识(node,使用mongoose )

官网 https://www.mongodb.com/ 下载安装mongodb https://docs.mongodb.com/manual/tutorial/install-mongodb-on-windows/ 安装到最后一步时,将左下角的勾选去掉,那个勾选是安装图形化界面...

天上月丶 ⋅ 05/03 ⋅ 0

Node后台|数据库的安装及使用(简版)

MAC 安装mongoDB 启动 mongoDB 判断mongoDB是否已经开启 关闭 mongoDB的服务 mongodb启动成功后会显示 然后我们去看看node如何连接mongodb node 连接mongoDB需要用到 mongoose 如果连接成功的...

贝一平 ⋅ 05/30 ⋅ 0

大数据分析挖掘学习方向?数据分析师的就业前景怎么样?

加米谷数据分析挖掘课程明细,从理论到云端实操环境到项目实战,手把手教您从0掌握数据分析与挖掘技术,带您走进数据时代。 第一阶段(python基础) python入门:1、Python版本特性介绍2、P...

加米谷大数据 ⋅ 04/17 ⋅ 0

Docker MongoDB 部署

MongoDB 是一款较为常用的NOSQL 数据库,结合 Docker 使用,能实现轻松配置部署、迁移,本文以下为简要介绍如何在 Docker 中部署并使用 MongoDB。下文主要分为几个部分,内容如下: MongoDB ...

speculatecat ⋅ 04/06 ⋅ 0

Spring boot中mongodb的使用

mongodb的增删改查 Spring Boot对各种流行的数据源都进行了封装,当然也包括了mongodb,下面给大家介绍如何在spring boot中使用mongodb: 1、pom包配置 pom包里面添加spring-boot-starter-dat...

glen_xu ⋅ 06/11 ⋅ 0

MongoDB 3.0+安全权限访问控制

1、启动没有访问控制的MongoDB服务 sudo service mongod start 2、连接到实例 mongo --port 27017 指定额外的命令行选项来连接Mongo shell到部署Mongodb服务器, 如--host 3、创建的用户管理员...

我是小谷粒 ⋅ 06/13 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

个人博客的运营模式能否学习TMALL天猫质量为上?

心情随笔|个人博客的运营模式能否学习TMALL天猫质量为上? 中国的互联网已经发展了很多年了,记得在十年前,个人博客十分流行,大量的人都在写博客,而且质量还不错,很多高质量的文章都是在...

原创小博客 ⋅ 今天 ⋅ 0

JavaScript零基础入门——(十一)JavaScript的DOM操作

JavaScript零基础入门——(十一)JavaScript的DOM操作 大家好,欢迎回到我们的JavaScript零基础入门。最近有些同学问我说,我讲的的比书上的精简不少。其实呢,我主要讲的是我在开发中经常会...

JandenMa ⋅ 今天 ⋅ 0

volatile和synchronized的区别

volatile和synchronized的区别 在讲这个之前需要先了解下JMM(Java memory Model :java内存模型):并发过程中如何处理可见性、原子性、有序性的问题--建立JMM模型 详情请看:https://baike.b...

MarinJ_Shao ⋅ 今天 ⋅ 0

深入分析Kubernetes Critical Pod(一)

Author: xidianwangtao@gmail.com 摘要:大家在部署Kubernetes集群AddOn组件的时候,经常会看到Annotation scheduler.alpha.kubernetes.io/critical-pod"="",以表示这是一个关键服务,那你知...

WaltonWang ⋅ 今天 ⋅ 0

原子性 - synchronized关键词

原子性概念 原子性提供了程序的互斥操作,同一时刻只能有一个线程能对某块代码进行操作。 原子性的实现方式 在jdk中,原子性的实现方式主要分为: synchronized:关键词,它依赖于JVM,保证了同...

dotleo ⋅ 今天 ⋅ 0

【2018.06.22学习笔记】【linux高级知识 14.4-15.3】

14.4 exportfs命令 14.5 NFS客户端问题 15.1 FTP介绍 15.2/15.3 使用vsftpd搭建ftp

lgsxp ⋅ 今天 ⋅ 0

JeeSite 4.0 功能权限管理基础(Shiro)

Shiro是Apache的一个开源框架,是一个权限管理的框架,实现用户认证、用户授权等。 只要有用户参与一般都要有权限管理,权限管理实现对用户访问系统的控制,按照安全规则或者安全策略控制用户...

ThinkGem ⋅ 昨天 ⋅ 0

python f-string 字符串格式化

主要内容 从Python 3.6开始,f-string是格式化字符串的一种很好的新方法。与其他格式化方式相比,它们不仅更易读,更简洁,不易出错,而且速度更快! 在本文的最后,您将了解如何以及为什么今...

阿豪boy ⋅ 昨天 ⋅ 0

Python实现自动登录站点

如果我们想要实现自动登录,那么我们就需要能够驱动浏览器(比如谷歌浏览器)来实现操作,ChromeDriver 刚好能够帮助我们这一点(非谷歌浏览器的驱动有所不同)。 一、确认软件版本 首先我们...

blackfoxya ⋅ 昨天 ⋅ 0

线性回归原理和实现基本认识

一:介绍 定义:线性回归在假设特证满足线性关系,根据给定的训练数据训练一个模型,并用此模型进行预测。为了了解这个定义,我们先举个简单的例子;我们假设一个线性方程 Y=2x+1, x变量为商...

wangxuwei ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部