最近有人问我前端开发者保存用户数据信息最简单的方法是什么。所以让我解释一下如何去做。要配置数据库首先我们需要有一个数据库。你可以通过mlab免费获得一个。注册完成后，在MongoDB部署表中点击新建。我们要使用的是这个免费的沙盒数据。创建数据库后，我们需要创建一个帐户，以便我们对自己进行身份验证。单击数据库名称，然后单击用户，并添加一个数据库用户。记下您选择的用户名和密码，供您稍后使用。在数据库页面的顶部，您可以看到一个MongoDBURI。这是我们数据库的URL。这个数据库的URI相当于网页的URL。通常，MongoDB的URI如下：mongodb://:@:/例如，我的：mongodb://admin:superSecretPassword@ds111885.mlab。com:11885/medium设置服务器我们将使用Node作为后端。您可以单击此处在Glitch上克隆我的项目，从而省去自己设置它的麻烦。我们从server.js开始，如下：//initprojectconstexpress=require('express');//thelibrarywewillusetohandlerequestsconstapp=express();//instantiateexpressapp.use(require("cors")())//allowCross-domainrequestsapp.use(require('body-parser').json())//自动将requestdata解析为JSON//baserouteapp.get("/",function(request,response){response.send("TODO")//始终响应字符串"TODO"});//baserouteapp.post("/",function(request,response){response.send("TODO")//总是用字符串"TODO"});app.put("/",function(request,response){response.send("TODO")//总是用字符串"TODO"});//监听请求，需要process.env.PORT因为//weareusingglitch，否则你可以写80orwhatevervarlistener=app.listen(process.env.PORT,function(){console.log('Yourappislisteningonport'+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测试或Insomnia应用程序来运行HTTP请求。单击Show按钮以检查Glitch应用程序的URL。到目前为止，我们只使用了路由/。但是如果我们要为不同的用户存储不同的信息，就需要为不同的用户分配不同的路由。示例：/ZaninAndrea和/JohnGreen现在有一个困难：我们不能对每条路线进行编码，因为它不是一种可扩展的方法。我们需要的是路由参数。接下来我们只编码一个路由：/:user冒号表示我们想要捕获任何以/开头且仅包含字母数字的路由。如下例所示：/ZaninAndrea可以捕获/Johnny45可以捕获/alex/score不能捕获我们可以在变量request.params.user//baserouteapp.get("/:user",function(request,response){response.send(request.params.user)});//baserouteapp.post("/:user",function(request,response){response.send(request.params.user)});//baserouteapp.put("/:user",function(request,response){response.send(request.params.user)});现在服务器可以响应每个查询并显示查询的用户名。向数据库中添加数据现在我们知道了用户是谁，我们想存储一些关于他的信息。要查询数据库，我们将使用mongodb库。您可以通过两种方式安装它：npminallmongodb--save或者如果您使用Glitch，您可以切换到package.json文件并单击添加包按钮。我们加载mongodb库，然后将MongoDBURI存储在一个变量中：constmongodb=require('mongodb');//loadmongodbconsturi=process.env.URI;URI是敏感信息-这是访问数据库所需的全部信息。***把URI放在一个.env文件里，.env文件里的信息别人是看不到的。URI=mongodb://admin:PASSWORD@ds111885.mlab.com:11885/mediumGlitch会自动将变量从.env文件加载到process.env变量中。连接数据库是一个异步操作，所以我们需要像这样在回调中包装所有服务器设置：mongodb.MongoClient.connect(uri,function(err,db){//baserouteapp.get("/:user",function(request,response){response.send(request.params.user)});//baserouteapp.post("/:user",function(request,response){response.send(request.params.user)});//baserouteapp.put("/:user",function(request,response){response.send(request.params.user)});//listenforrequests,theprocess.env.PORTisneededbecause//weareusingglitch,otherwiseyoucouldhavewritten80orwhatevervarlistener=app.listen(process.env.PORT,function(){console.log('Yourappislisteningonport'+listener.address().port);});})数据库组织在包含文档（基本上是JSON文件）的集合中.因此，让我们连接到User集合（我们将在第一次访问时创建它）。mongodb.MongoClient.connect(uri,function(err,db){constcollection=db.collection('users')//...}首先我们先操作POST路由，当我们第一次添加用户时，这条路由上传数据时会用到，然后我们会使用PUT路由来更新数据。app.post("/:user",function(request,response){//insertsanewdocumentontheservercollection.insertOne({...request.body,user:request.params.user},function(err,r){if(err){response.send("Anerororoccured")}else{response.send("Allwell")}})});collection.insertOne方法向收集器添加一个新文档。在本例中，每个用户都有自己的文档。{...request.body,user:request.params.user}利用扩展运算符将请求主体和用户通过URL提供的数据组合起来。存储在收集器中的文档是操作的结果。第二个参数是一个回调，它只是通知用户操作的结果。从数据库中获取数据我们已经在服务器上存储了一些数据，现在我们要从服务器中读取数据。我们使用GET方法来获取它。app.get("/:user",function(request,response){collection.find({user:request.params.user}).toArray(function(err,docs){if(err){response.send("Aneroroccured")}else{response.send(docs)}})});这时候第一个参数是一个过滤器，用来告诉数据库只给我们发送用户的属性信息文档。用户信息以数组的形式存储在文档中，因为理论上不止一个文档存储用户属性信息。我们必须避免这种情况发生。文档以数组的形式返回给用户，因为理论上可以有多个具有用户属性的文档。我们必须确保不会发生这种情况。更新数据库数据***还有很重要的一点，使用PUT方法更新已有的用户信息。//baserouteapp.put("/:user",function(request,response){collection.updateOne({user:request.params.user},{$set:{...request.body,user:request.params.user}},function(err,r){if(err){response.send("Aneroroccured")}else{response.send("Allwell")}})});最后一个参数是过滤设备，类似于GET方法的第一个参数。第二个参数是更新文档的请求-您可以从此处获取更多信息。在我们的例子中，我们告诉数据库将用户传递的数据与已经存在的数据合并。不过要小心，因为嵌套参数将被替换而不是合并。***这只是数据库和后端编程的开始，但足以让您开始个人项目。以后我可能会写一些关于认证的文章，在此之前，请不要在里面存储一些敏感数据。你可以在这里修改这个完整的项目，你需要有自己的数据库，如果你还没有创建它，回到配置数据库部分。如果你觉得这篇文章还不错，请给点掌声，让更多人看到。谢谢！
