全栈 Todolist-database 篇(Cloud MongoDB)

·  阅读 576
全栈 Todolist-database 篇(Cloud MongoDB)

全栈 Todolist-MongoDB 篇

写在最前面

  • 这篇是辅助 server 篇 配置 MongoDB clound 数据库的文章,大家可以先看 server 篇。

您可以按照顺序阅读

0、注册使用 MongoDB Atles

BDwdRU.png

一、创建集群

1、选择创建

BDwxyQ.md.jpg

2、咋们选择免费的集群 tab

BD0kWT.md.jpg

3、所有的都默认选择即可 AWS 和 美国的服务器

BD0QFx.md.jpg

4、配置完以后,正式创建集群

BD020s.md.jpg

二、Database Access 数据库用户配置

5、选择创建新用户

BD0L7R.md.jpg

6、用户管理者配置

  • 选择 ==password== 模式,用户名和密码,下面有随机密码的选项,使用后建议复制一下保存下来。其他的都默认,最后 ==Add User==

BDBENt.md.jpg

三、NetWork Access 网络安全配置

6、选择 NetWork Access 配置

BDsg2V.md.jpg

7、配置 IP

  • 地址白名单,为了方便我们先直接选择==access from anywhere==, comment 备注一下 ‘anywhere’

BDsXrD.md.jpg

confirm 确定以后,等到 status 状态由 pending --> Active 咋们就可以正常使用这个配置好的云数据库了。

四、配置 nodemon.json

  • 还记得咋们 server 篇配置的 nodemon.json 中的三个参数嘛。

  • nodemon.json

{
    "env": {
        "MONGO_USER": "your-username",
        "MONGO_PASSWORD": "your-password",
        "MONGO_DB": "your-db-name"
    }
}
复制代码

username 和 password 在 database access 中配置过了,db-name 就是 Clusters 的 title,初始的名字一般为 Cluster0

{
    "env": {
        "MONGO_USER": "xxx", // 你配置的 username
        "MONGO_PASSWORD": "xxx", // 配置的 password 
        "MONGO_DB": "Cluster0"
    }
}
复制代码

BD6FYR.md.jpg

  • 配置好以后,我们点击 Cluster 中的 Cluster0 的 connect 按钮。
  • 选择 Connect your application
  • 默认 node, copy 这段代码,到我们 server 中的 app.ts 中就可以了。

BD6gnU.md.jpg

  • app.ts
import express, { Express } from 'express';
import mongoose from 'mongoose';
import cors from 'cors';
import todoRoutes from './routes';
import bodyParser from 'body-parser';

const app: Express = express();

const PORT: string | number = 4000;
// const PORT: string | number = process.env.PORT || 4000;

console.log(process.env.PORT);

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

const uri: string = `mongodb+srv://${process.env.MONGO_USER}:${process.env.MONGO_PASSWORD}@cluster0.4qpw4.mongodb.net/${process.env.MONGO_DB}?retryWrites=true&w=majority`;
// 这段 url 来自mongoDB cloud

const options = { useNewUrlParser: true, useUnifiedTopology: true };
mongoose.set('useFindAndModify', false);

mongoose
    .connect(uri, options)
    .then(() =>
        app.listen(PORT, () =>
            console.log(`Server running on http://localhost:${PORT}`)
        )
    )
    .catch((error) => {
        throw error;
    });

复制代码

五 最后的最后,我们启动服务器看看链接是否成功

yarn start
复制代码
分类:
前端
标签:
分类:
前端
标签:
收藏成功!
已添加到「」, 点击更改