最近有人来问我，作为前端开发人员保存用户数据信息的最简便的方法是什么。因此我来说明一下如何实现它。
配置数据库
首先我们须要先有一个数据库。你可以通过 mlab 获取一个免费的。注册之后，在 MongoDB 的部属表中点击 新建。 我们要用的是这个免费的沙盒数据。
创建数据库之后，我们需要创建一个账户以便于我们进行自我验证。点击数据库名称，然后点击 用户 ， 并添加数据库用户 。 写下你选择的之后要用到的用户名和密码 。
前端开发者该如何设置数据库
在数据库页面的顶部，你能够看到一个 MongoDB URI 。这是我们数据库的网址。这个数据库的 URI 相当于网页的 URL 。通常情况下，MongoDB 的 URI 如下：
| mongodb://<dbuser>:<dbpassword>@<host>:<port>/<dbname> |
例如，我的：
| mongodb://admin:superSecretPassword@ds111885.mlab.com:11885/medium |
设置服务器
我们会在后端使用 Node。你可能单击 这里 克隆我在 Glitch 上的项目，省去自己设置的麻烦。
我们从 server.js 开始，如下：
// init project const express = require('express'); // the library we will use to handle requests const app = express(); // instantiate express app.use(require("cors")()) // allow Cross-domain requests app.use(require('body-parser').json()) // automatically parses request data to JSON // base route app.get("/", function (request, response) { response.send("TODO") // always responds with the string "TODO" }); // base route app.post("/", function (request, response) { response.send("TODO") // always responds with the string "TODO" }); app.put("/", function (request, response) { response.send("TODO") // always responds with the string "TODO" }); // listen for requests, the process.env.PORT is needed because // we are using glitch, otherwise you could have written 80 or whatever var listener = app.listen(process.env.PORT, function () { console.log('Your app is listening on port ' + listener.address().port); }); |
我们首先导入了 express —— 这个库用来处理向我们的服务器送来的请求。
我们需要 use(require(cors)) 来允许跨域请求。跨域请求是从某个域名的网站去请求另一个域名下的服务。
app.use(require('body-parser').json()) 为自动为我们将请求数据解析成 JSON。
然后我们向 get 方向传递想要处理的路由，以及处理请求的回调。也就是说只要有人打开网站中的 / 页面，请求就会被传递给那个回调来处理。域名部分是隐含的，所以如果你的的域是 http://shiny-koala.glitch.com，路由 /about 就是 http://shiny-koala.glitch.com/about。
确切地说，我说的“打开页面”是指产生一个使用 GET 方法发送给服务的请求。HTTP 方法只是你发送给服务的请求类型，我们只会使用这些：
GET 方法用于从服务器获取资源。比如，打开 Facebook 的时候，它需要加载 HTML、CSS 和 JavaScript。
POST 方法用于在服务器上创建资源。比如在 Facebook 上发布内容，写在发布内容中的信息使用通过 POST 请求发送给服 Facebook 务器。
PUT 方法用于更新服务器上的资源。比如，你在修改某篇发布内容的时候，就使用 PUT 请求将修改的内容发送给 Facebook 服务器。
app.post 和 app.put 的工作方式和 app.get 很像，但是有足够合理的理由使用 POST 和 PUT 方法代替 GET。
路由
在你进行服务器开发时，你需要进行一些测试。你可以用简单的网站 REST test test 或者 Insomnia 应用程序去运行一下 HTTP 请求。
点击 显示 按钮，来检查 Glitch 应用程序的 URL 。
到目前为止，我们只是用过路由 / 。但是如果我们想对不同的用户存储不同的信息，我们就需要给不同的用户分配一个不同的路由。
例如： /ZaninAndrea 和 /JohnGreen
现在有一个难点：
我们不可能对每一条路由进行编码，因为它不是一个可扩展的方法。我们需要的是 路由参数 。接下来我们只编码一个路由：/:user
冒号是在表达要捕捉任何以/开始的并且只包含字符数字的路由。
如下例所示：
/ZaninAndrea 能够捕捉到
/Johnny45 能够捕捉到
/alex/score 不 能捕捉到
我们可以在变量 request.params.user 中检索 user
上文内容不用于商业目的，如涉及知识产权问题，请权利人联系博为峰小编(021-64471599-8017)，我们将立即处理。
