node中，渲染页面时报错的问题

 最近在学习一个博客管理后台的项目，小项目，很基础的那种，怎么说呢，还是很适合初学者学习的，比如我这种菜鸟，好了言归正传。

在学习这个项目时，遇到了几处问题，而关于从数据库中请求得到数据然后渲染到页面的过程中报错的问题就是其中之一。

它是一个什么错误的，就是下面这个错误：

 错误的地方就是：SyntaxError:Unexpected token R in JSON at position 0

箭头指出的地方可能有所变化，我遇到的就几种，而且很容易解决

其实，网上有很多这个问题的解决办法，我也是百度过来的，但是问题答案很零散，我在此简单整理一下，顺便也给自己提个醒。

好了，扯了这么多，我们直接上答案

我们先来分析一下，这种错误，其实就是与json数据有关的，而在后端与json文件有关的无非就是从数据库中请求数据了

1. 第一种情况

//没有渲染页面 单纯响应数据

// 从数据库中查询数据 并保存到datas变量中
let datas = await Article.find().populate('author');
//将数据响应到浏览器页面
res.send(datas); // 数据会被响应到浏览器

如果此时到浏览器中查看，它是不会报错的，浏览器中可以正常拿到这个数据，而且也能打印出来

那我们再来看，如果渲染页面呢？

// 渲染页面 并且传递数据

// 从数据库中请求数据
let datas = await Article.find().populate('author');

// res.send(datas);

// 将数据渲染到页面
res.render('admin/article', {
      articles: datas
 });

此时，如果刷新页面，浏览器以及后台都会报错，而报错形式如下：

下面就是解决方法之一：

// 渲染页面 并且传递数据

// 从数据库中请求数据
let datas = await Article.find().populate('author').lean();
// 只需在查询代码之后 加上一个lean()方法即可
// res.send(datas);

// 将数据渲染到页面
res.render('admin/article', {
      articles: datas
 });

如此，只需要在查询方法后面加一个lean()方法即可  

现在，页面就不报错了，页面也渲染出来了，而且数据也没问题

关于这个lean(）方法，我没有查到是什么作用，有知道的大佬，希望告知一下，万分感谢！

2. 第二种情况

 对于在数据库中查询数据，我们单单从一个数据集合中查询数据的情况很少，很多时候我们都要进行数据集合的联合查询

在这个项目的学习中，我用到了一个第三方模块（express-sex-page）,它是一个分页查询的第三方模块，可以帮助我们快速实现数据的分页显示

这时候，我们的查询代码就变成下面这样了

// 从数据库中查询数据
// Pagination就是express-sex-page对象
// exec() 方法就是向数据库发送查询请求
 let datas = await pagination(Article).find().page(page).size(2).display(3).populate('author').exec();

// res.send(datas)

res.render('admin/article', {
     articles: datas
});

此时，如果单纯想在页面中拿到数据，那么也不会报错，数据会被正常打印出来

但是，如果渲染页面的话，还是会报错上面的那种错误，这是怎么回事呢？

主要还是数据格式的问题

此时，就会有人问，我们的查询条件后面少了lean（）方法，没错，在上面的代码中，我没有加lean（）方法

其实，不是不加，而是加了会报错

// 从数据库中查询数据
// Pagination就是express-sex-page对象
// exec() 方法就是向数据库发送查询请求
 let datas = await pagination(Article).find().page(page).size(2).display(3).populate('author').exec().lean();

// 此时，代码会报错，报错位置就是lean() 无法解析为一个函数 具体参考完整报错内容 有兴趣的朋友的可以自己尝试一下
// res.send(datas)

res.render('admin/article', {
     articles: datas
});

我当时也是这样想的，事实上我直接就是加上了，但是，结果却不尽人意啊.....

此时，也是有解决方法的，方法如下：

// 从数据库中查询数据
// Pagination就是express-sex-page对象
// exec() 方法就是向数据库发送查询请求
 let datas = await pagination(Article).find().page(page).size(2).display(3).populate('author').exec().lean();

// 此时，代码会报错，报错位置就是lean() 无法解析为一个函数 具体参考完整报错内容 有兴趣的朋友的可以自己尝试一下
// res.send(datas)

// 解决方法(我们可以将查询的到的数据转化一次)
let str = JSON.stringify(datas);
let json = JSON.parse(str);
// 然后将转化后的数据json 传递给页面
res.render('admin/article', {
     articles: json
});

此时，页面就可以正常渲染了，至于其中原因（抱歉，我已经懵了，苦笑中......），可能还有更好的方法

3. 第三种情况

如果，此时你的页面还是报错，而报错内容还是老样子，那么可能就是你的模板文件出错了

我们得到数据，在模板文件中进行处理时，常常使用的是模板语法（art-template-web）

模板语法错误，也会导致出现这种类型的错误

比如：模板语句没有闭合

{{block}}
    ...
{{/block}}

{{if}}
    ...
{{/if}}

{{each}}
    ...
{{/each}}

......

4. 写在最后

最后写点个人感悟吧，个人感觉，无论是学习新知识，还是尝试做项目，如果遇到问题，那么就想办法解决它，不管是百度，还是请教别人，都是对自己的一种提升。

遇到代码报错也是一样的，了解它并解决它，以后遇到的问题也会越来越少。

文章到此也就结束，说实话，内容挺水的（苦笑.....），没有什么干货，啰里啰嗦，没头没尾，各位道友也就凑合看吧！

如有错误之处，还望大佬不吝指点，谢谢！