SyntaxError: Unexpected token u in JSON at position 1

项目场景：

在将ES的数据发送到前端的过程中出现了数据无法展示的情况。

---

问题描述

前端无法展示数据，并出现乱码。后端，发出警告但是没有报错。

---

原因分析：

查看后端的警告，发现没什么问题，在看前端的数据，发现也是正常的。问题应该出在前端数据转换上。

05-31 19:43:04.504 [http-nio-8080-exec-1] INFO  o.a.c.core.ContainerBase.[Tomcat].[localhost].[/] - Initializing Spring DispatcherServlet 'dispatcherServlet'
05-31 19:43:04.504 [http-nio-8080-exec-1] INFO  org.springframework.web.servlet.DispatcherServlet - Initializing Servlet 'dispatcherServlet'
05-31 19:43:04.506 [http-nio-8080-exec-1] INFO  org.springframework.web.servlet.DispatcherServlet - Completed initialization in 2 ms
05-31 19:43:05.687 [http-nio-8080-exec-4] WARN  org.elasticsearch.client.RestClient - request [POST http://120.48.46.177:9200/hotel/_search?typed_keys=true&max_concurrent_shard_requests=5&ignore_unavailable=false&expand_wildcards=open&allow_no_indices=true&ignore_throttled=true&search_type=query_then_fetch&batched_reduce_size=512&ccs_minimize_roundtrips=true] returned 2 warnings: [299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "Elasticsearch built-in security features are not enabled. Without authentication, your cluster could be accessible to anyone. See https://www.elastic.co/guide/en/elasticsearch/reference/7.16/security-minimal-setup.html to enable security."],[299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "[ignore_throttled] parameter is deprecated because frozen indices have been deprecated. Consider cold or frozen tiers in place of frozen indices."]
05-31 19:43:05.706 [http-nio-8080-exec-5] WARN  org.elasticsearch.client.RestClient - request [POST http://120.48.46.177:9200/hotel/_search?typed_keys=true&max_concurrent_shard_requests=5&ignore_unavailable=false&expand_wildcards=open&allow_no_indices=true&ignore_throttled=true&search_type=query_then_fetch&batched_reduce_size=512&ccs_minimize_roundtrips=true] returned 2 warnings: [299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "Elasticsearch built-in security features are not enabled. Without authentication, your cluster could be accessible to anyone. See https://www.elastic.co/guide/en/elasticsearch/reference/7.16/security-minimal-setup.html to enable security."],[299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "[ignore_throttled] parameter is deprecated because frozen indices have been deprecated. Consider cold or frozen tiers in place of frozen indices."]
05-31 19:43:10.673 [http-nio-8080-exec-7] WARN  org.elasticsearch.client.RestClient - request [POST http://120.48.46.177:9200/hotel/_search?typed_keys=true&max_concurrent_shard_requests=5&ignore_unavailable=false&expand_wildcards=open&allow_no_indices=true&ignore_throttled=true&search_type=query_then_fetch&batched_reduce_size=512&ccs_minimize_roundtrips=true] returned 2 warnings: [299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "Elasticsearch built-in security features are not enabled. Without authentication, your cluster could be accessible to anyone. See https://www.elastic.co/guide/en/elasticsearch/reference/7.16/security-minimal-setup.html to enable security."],[299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "[ignore_throttled] parameter is deprecated because frozen indices have been deprecated. Consider cold or frozen tiers in place of frozen indices."]
05-31 19:43:10.675 [http-nio-8080-exec-6] WARN  org.elasticsearch.client.RestClient - request [POST http://120.48.46.177:9200/hotel/_search?typed_keys=true&max_concurrent_shard_requests=5&ignore_unavailable=false&expand_wildcards=open&allow_no_indices=true&ignore_throttled=true&search_type=query_then_fetch&batched_reduce_size=512&ccs_minimize_roundtrips=true] returned 2 warnings: [299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "Elasticsearch built-in security features are not enabled. Without authentication, your cluster could be accessible to anyone. See https://www.elastic.co/guide/en/elasticsearch/reference/7.16/security-minimal-setup.html to enable security."],[299 Elasticsearch-7.16.3-4e6e4eab2297e949ec994e688dad46290d018022 "[ignore_throttled] parameter is deprecated because frozen indices have been deprecated. Consider cold or frozen tiers in place of frozen indices."]

 

查看前端的报错信息，前端提示json转换失败，提示错误的代码在383行。

SyntaxError: Unexpected token u in JSON at position 1

分析提示报错信息的代码：打印错误的地方在catch哪里，数据走catch表示then里面的代码错误了。于是乎分别在各个比较重要的地方进行打印操作。前端再次运行发现 console.log(3)这个语句无法进入，确定问题在if语句块内。

        axios.post("/hotel/list", params)
          .then(resp => {
            this.hotels = resp.data.hotels;
            this.total = resp.data.total;
            console.log(1)
            this.totalPage = Math.floor((this.total + 5 - 1) / 5);
            console.log(2)
            if (location) {
              this.setMapCenter(location);
            } else if(this.hotels && this.hotels.length > 0){
              this.setMapCenter(this.hotels[0].location);
            }
            this.initMarker();
            console.log(3)
          })
          .catch(err => {
            console.log(err)
            this.hotels = []
            this.total = 271;
            this.totalPage = 28;
          })
      },

if语句块最终跳转到下面这个方法中，最终发现了问题所在。我在把数据插入ES中的时候location这个属性是不加空格的，而前端在解析json的时候是加空格的，最终导致json无法解析。因此在进行数据插入时要保持数据一致，不然很容易错。找这个错误花了我两个小时的时间，就是为了一个空格。

 

 

---

解决方案：

前端解析时删去空格。

    location(loc) {
        let arr = loc.split(",");
        let json = '[' + arr[1] + ',' + arr[0] + ']'
        return JSON.parse(json);
      },