资讯专栏INFORMATION COLUMN

vue+koa2+mongo前后端分离restful,配置和部署到云

miracledan / 2174人阅读

摘要:前端项目使用搭建项目,这里就不发了安装和配置或加载。目录下文件修改来个请求,查看结果。

一。前端项目

1.使用vue-cli(vue2.0)搭建项目,这里就不发了.

axios安装和配置

~ npm install axios

1. main.js或app.js加载axios。
    import axios from "axios"
    Vue.prototype.$axios = axios
2. config目录下index.js文件修改proxyTable

3. view来个get请求,查看结果。

二。后端项目

1. 使用koa2脚手架
~ npm install -g koa-generator
~ koa2 nosqlDemo
~ npm install

项目搭建后基本目录

2. app.js配置后端跨域,更改api请求端口为8081
    ctx.set("Access-Control-Allow-Origin", "*");
    ctx.set("Access-Control-Allow-Headers", "X-Requested-With");
    ctx.set("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");

3. 使用monk或mongoose,这里使用monk操作mongo
    ~ npm install monk
    
    在user.js里调用
        const Monk = require("monk")
        const db = Monk("mongodb://管理员账号:管理员密码@xxx.xxx.xx.xx:27017/testDb?authSource=admin") // testDb就是要查询的数据库集合

4. 表(文档)查询
    const user = db.get("userinfo");
    router.get("/dpi/getList", async (ctx) => {
        let st = await user.find();
        ctx.response.type = "application/json";
        console.log(st)
        ctx.body = st;
    })
先来几条疯狂输出的测试数据(mongo3.65之后查询语句不一样了)

5. 需要本地调试配置ide-debug,这里使用vscode
    {
        "version": "0.2.0",
        "configurations": [
            {
                "type": "node",
                "request": "launch",
                "name": "debug-app",
                // "runtimeExecutable": "nodemon",
                "program": "${workspaceRoot}/app.js",
                "restart": true,
                "console": "integratedTerminal",
                "skipFiles": [                  //skipFiles使断点不进入到node_model包
                    "${workspaceRoot}/node_modules/**/*.js",
                    "/**/*.js"
                ]
            }
        ]
    }

点一下有惊喜

三. 将后端ftp上传到centos,并切换到目录下启动

centos下web环境配置(这里设置目录/srv/www/server)参考:

https://segmentfault.com/a/1190000015431830

~ npm start

后端中预留的app目录包含层和m层,以后分离routes里的逻辑需要用到。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/19291.html

相关文章

  • ONE-sys 整合前后脚手架 koa2 + pm2 + vue-cli3.0 + element

    摘要:项目地址干货求本脚手架主要致力于前端工程师的快速开发一键部署等快捷开发框架,主要目的是想让前端工程师在一个阿里云服务器上可以快速开发部署自己的项目。 项目地址https://github.com/fanshyiis/... 干货!求star showImg(https://segmentfault.com/img/remote/1460000017886870); 本脚手架主要致力于...

    刘福 评论0 收藏0
  • node技术栈 - 收藏集 - 掘金

    摘要:异步最佳实践避免回调地狱前端掘金本文涵盖了处理异步操作的一些工具和技术和异步函数。 Nodejs 连接各种数据库集合例子 - 后端 - 掘金Cassandra Module: cassandra-driver Installation ... 编写 Node.js Rest API 的 10 个最佳实践 - 前端 - 掘金全文共 6953 字,读完需 8 分钟,速读需 2 分钟。翻译自...

    王伟廷 评论0 收藏0
  • 最简单的前后分离部署Koa2

    摘要:既然前段工程化是基于,那么选择做前后端分离部署也是理所应当的。有了这三个东西,我们就可以搭建出最简单的前端服务器了。 前后端分离开发应该已经是很多公司的标配了,然而,在前端工程化的体系下,开发环境代码和生产环境代码往往是平级的,不再是整个文件夹往服务器上一扔就了事,这让每次的部署过程相当繁琐。 如下是常见的项目目录: Project └──javaSrc └──app ...

    SegmentFault 评论0 收藏0
  • Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站

    摘要:前端打造了前端网站和后台管理系统。根目录都是开发源代码,根目录下的文件夹下都是前端网站项目源代码,根目录下的文件夹下都是后台管理系统的源代码。后台管理系统使用在根目录下进入项目,安装包,执行命令,启动服务浏览器打开即可以访问。 showImg(https://segmentfault.com/img/remote/1460000019603918); 这是个什么的项目? 使用 Node...

    wangxinarhat 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<