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,总结:不要太相信自己的英文水平,否则会付出玩一个小时的代价 [笑哭] [笑哭] [笑哭]

发布了27 篇原创文章 · 获赞 13 · 访问量 5979

猜你喜欢

转载自blog.csdn.net/weixin_44103733/article/details/105462477