后台返回数据打印是[object object]的,报错:SyntaxError: JSON.parse: expected property name or ‘}‘ at line 1 column

今天基于这个问题纠结了一下午,导致这个问题的坑也是挺深的,查找问题最好是从这条数据的存储开始查找

问题1:先确定后台接收数据后存储到数据库里有没有自动转义特殊字符,比如

原始数据是:[{"user_id":20,"good":true}],这样的一个对象数组

存入数据库是:[{"user_id":20,"good":true}]

说明数据经过后端的逻辑处理,把前端的数据转义存储了

解决这个问题,前端传参数组的时候先用JSON.stringify序列化数据,再交给后端,这样就不用管后端开发者怎么处理的数据了

那么,我是序列化后的数据打印看到的还是它:[{"user_id":20,"good":true}],只不过它已经是字符串了

后台存储自动转义的时候,其实就是把一些特殊字符做了一些处理,以免其它更多的bug出现

这里提供两个常用函数处理这种转义的字符串,如下

/***  把html转义成HTML实体字符* @param str* @returns {string}* @constructor*/
export let htmlEncode = (str) => {var s = "";if (str.length === 0) {return "";}s = str.replace(/&/g, "&amp;");s = s.replace(/</g, "&lt;");s = s.replace(/>/g, "&gt;");s = s.replace(/ /g, "&nbsp;");s = s.replace(/\'/g, "&#39;");//IE下不支持实体名称s = s.replace(/\"/g, "&quot;");return s;
}/***  转义字符还原成html字符* @param str* @returns {string}* @constructor*/
export let htmlRestore = (str) => {var s = "";if (str.length === 0) {return "";}s = str.replace(/&amp;/g, "&");s = s.replace(/&lt;/g, "<");s = s.replace(/&gt;/g, ">");s = s.replace(/&nbsp;/g, " ");s = s.replace(/&#39;/g, "\'");s = s.replace(/&quot;/g, "\"");return s;
}

所以,如果后台返回的数据打印是这样的:[object object],

前台是通过    

JSON.parse(item.good) 

无法解析数据,并且报错如下:

SyntaxError: JSON.parse: expected property name or '}' at line 1 column 3 of the JSON data

那你极可能遇到和我一样的问题

我的解决方案是:不动后台逻辑代码处理,前端加一个函数处理返回的数据,这个函数就是我上面分享的

JSON.parse(htmlRestore(item.good))

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/413257.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java开发框架和中间件面试题(4)

27.如何自定义Spring Boot Starter&#xff1f; 1.实现功能 2.添加Properties 3.添加AutoConfiguration 4.添加spring.factory 在META INF下创建spring.factory文件 6.install 28.为什么需要spring boot maven plugin? spring boot maven plugin 提供了一些像jar一样打包…

第二周每周例行报告

1.本周PSP 类型任务开始时间结束时间间隔时间净时间准备工作复习C#&#xff0c;看书2018.9.19 17&#xff1a;032018.9.19 18&#xff1a;17 0min74min编程编写功能一2018.9.20 18&#xff1a;072018.9.20 22&#xff1a;4323min253min编程完善修改功能一2018.9.21…

poj 1083 Moving Tables

题目 两种做法&#xff0c;开始用贪心做的&#xff0c;有种情况没考虑到&#xff0c;结果排序错了。 这个例子&#xff0c;感觉上有三个交点&#xff0c;以为是30&#xff0c;其实是20. 贪心代码&#xff1a; #include <iostream> #include <cstdio> #include <…

oracle parallel_index hint在非分区表的生效

之前没特别注意&#xff0c;在有些场景下希望使用并行索引扫描的时候&#xff0c;发现parallel_index hint并没有生效&#xff0c;于是抽空看了下文档&#xff1a;The PARALLEL_INDEX hint instructs the optimizer to use the specified number of concurrent servers to para…

eclipse 界面设置与字体更改

目录 eclipse 界面设置与字体更改更改界面颜色&#xff08;Windows&#xff09;windows下全设置窗口颜色eclipse下设置Console窗口颜色设置字体与字号安装Courier New字体设置字体eclipse 界面设置与字体更改 每天换一个新的环境总是要重新设置eclipse的各种配置&#xff0c;最…

HTTP和HTTPS协议及工作原理分析

HTTP协议概念 HTTP协议&#xff08;HyperText Transfer Protocol&#xff0c;超文本传输协议&#xff0c;属于应用层&#xff09;是用于从服务器传输超内容到本地浏览器的传送协议。是一个无状态的协议 想了解http&#xff0c;就需要了解TCP&#xff0c;IP协议。因为http是基…

前端兼容性问题

一、CSS 1、浏览器的兼容性问题-CSS 盒子模型(Box Model) 一旦为页面设置了恰当的 DTD&#xff0c;大多数浏览器都会按照上面的图示来呈现内容。然而 IE 5 和 6 的呈现却是不正确的。根据 W3C 的规范&#xff0c;元素内容占据的空间是由 width 属性设置的&#xff0c;而内容周…

索引原理及几种索引类型区别

在关系数据库中&#xff0c;索引是一种单独的、物理的对数据库表中的一列或多列的值进行排序的一种存储结构&#xff0c; 它是某个表中一列或若干列值的集合和相应的指向表中物理标识这些值的数据页的逻辑指针清单。索引的作用相当于图书的目录&#xff0c;可以根据目录中的页码…

Android Studio Intent使用(显式、隐式)

https://blog.csdn.net/u012005313/article/details/47006689 使用Intent能够使程序在不同活动中跳转&#xff0c;意及能够使用不同界面。Intent用法分为显示和隐式 Intent概念&#xff1a;Intent是Android程序中各组件之间进行交互的一种重要方式&#xff0c;不仅可以指明当前…

淘宝首页的HTML以及CSS技术点

1、 一个网页的开发流程 内容结构&#xff0c;比如js、css页面结构。自上而下&#xff0c;从左往右。&#xff08;内容、颜色块、间距、边框&#xff09; 2、 line-height的5种设置方式及区别 normal || 1.5 || 150% || 50px || 5em 初始化元素的时候&#xff0c;一般使用 l…

Windows+Python 3.6环境下安装PyQt4

第一步&#xff1a;下载.whl&#xff0c;地址&#xff1a;https://www.lfd.uci.edu/~gohlke/pythonlibs/#pyqt4&#xff0c;这里可以下载不同的python版本对应的包。 第二步&#xff1a;选择一个目录&#xff0c;将下载好的文件放到该目录下&#xff0c;然后cmd下&#xff0c;c…

0065-数方块

题目 数方块难度级别&#xff1a;A&#xff1b; 运行时间限制&#xff1a;1000ms&#xff1b; 运行空间限制&#xff1a;51200KB&#xff1b; 代码长度限制&#xff1a;2000000B 试题描述在墙角堆放着一堆完全相同的正方体小木块&#xff0c;如下图所示&#xff1a; 因为木块堆…

【HNOI2006】鬼谷子的钱袋

本题在洛谷上的链接&#xff1a;https://www.luogu.org/problemnew/solution/P2320 做法和二进制划分很像&#xff0c;&#xff0c;&#xff0c;原来我的二进制划分一直有点问题&#xff08;之前我是枚举2的n次方然后减&#xff0c;逃&#xff09;。。。 我们举20这个例子&…

小米5安卓使用微信X5 Blink内核调试

1.打开微信开发模式&#xff0c;连续点击MIUI版本 2.在其他高级设置、开发者选项打开调试 3.打开微信调试工具&#xff0c;选择移动调试&#xff0c;安卓设备调试&#xff0c;选择X5 BINK, 4.手机用数据线连接电脑&#xff0c;并用微信扫描二维码,打开TBS调试 5.退出微信&…

c语言小项目-使用mysql数据库的图书管理系统

VS2013通过MySQL方式连接到MySQL MySQL官网上C的API有两个。一个是很成熟的mysql,另一个是MySQL Connector/C,近两年才出的,模仿JDBC做的,封装得很方便使用。这里使用的是mysql方式。 1.新建bookAdminSys工程 2.将文件夹MySQL目录下的include添加到VC目录中的包含目录中,另外将…

二年级小学生四则运算30道题目

实现代码&#xff1a; #include <stdio.h>#include <string.h>#include <stdlib.h>#include <time.h>int main(int argc, char **argv){int a[30],b[30]; int i,c,d;srand((unsigned int)time(NULL));for (i 0; i < 30; i){ a[i] rand()%101; b…

Java第一次上机实验源代码

小学生计算题&#xff1a; package 第一次上机实验_; import java.util.*; public class 小学计算题 { public static void main(String[] args){ System.out.println("请输入要出的题目的类型\n" "1、加法\n" "2、减法\n" "3、乘法\n"…

Centos7安装SVN+HTTP

1.首先安装svn yum install subversion 2.安装httpd yum install httpd 3.安装apache的svn操作模块 yum install mod_dav_svn yum install openssl openssl-devel 4.查看svn版本 svnserve –version 5.创建svn版本库 svnadmin create /home/svn/project 6.进入svn的c…

MyEclipse2015双击不能打开文件

1.返回桌面 2.连续按5次Shift键 3.点击启用粘滞键 4.再点击应用&#xff0c;然后确定 4.然后重新打开一下myeclipse2015就可以了 第二种方法&#xff1a; 1.关闭MyEclipse Explor窗口&#xff08;这个MyeclipseExplor是有问题的&#xff0c;不推荐用这个&#xff09; 2.W…