node+vue+MongoDB全栈开发（遇到的坑）

大家好，我是Counterrr。

（ps：有一段时间没更新博客了，因为工作实在是太忙了，公司前端就我一人，搞了挺多项目，近期还搞了美国疫情分期网页主要用了Vue + ElementUi + echarts + Bmap，有点跑题了今天不讲这个）

一、今天主要说说node+vue+MongoDB的项目初始化遇到的几个坑。
主要有A端（admin端管理员端 ）+ C端（customer用户端） + 后台（node的后端框架express）;
在用mongoose连接数据库的时候主要遇到两个坑，两个非常简单的坑都是自己粗心造成的，今天记录一下报错的信息：

1. 前台发送ajax请求一直请求不成功，返回的信息data对象下，code字段-2，并且显示信息：“ECONNREFUSED”，就是数据库一直连接不上。找了一晚上错误，结果发现在后台入口index.js里面没有引入数据连接的js文件。（ps：被自己蠢到家了。）
2. 在入口index.js文件中引入后，后端终端又报错了，具体报错如下：UnhandledPromiseRejectionWarning: MongoParseError: No hostname or hostnames provided in connection string。 主要原因在mongoose.connect()函数中连接数据库加了空格

OK，简单记录下。

二、记录下使用elementUi，el-menu上router属性，el-menu-item属性index二级路由跳转的坑。在router下index.js路由配置中，在主路由 / 下记录两个二级子路由，children: [ { path: '/categories/create', component: CategoryEdit }, { path: '/categories/list', component: CategoryList } ] 在页面去点击时，第一次会正确解析，第二次点击时，会出现这种怪异现象：/categories/categories/create多拼接了一个字段，纠其原因，在el-menu-item属性index下不能这样写index="categories/create" 改成index="/categories/create"这样就能在根路径去请求。问题解决。

三、记录下在使用node的express时，管理员验证这块，在express后端代码中加入，jwt即jsonwebtoken验证管理员登录模块时，再使用到element-ui组件库中el-upload组件时，图片上传报错，401，unauthorization错误。在el-upload组件上加入headers属性，并且将本地localStorage的token加入到请求头部Authorization中，死活不成，在控制台查看请求报文，也是存在authrization字段，注意出现authrization而不是authorization，所以说是我在设置字段时少写了一个o，总结：不要太相信自己的英文水平，否则会付出玩一个小时的代价 [笑哭] [笑哭] [笑哭]