Angular Dart对接Spring Boot时JSON解码特殊字符乱码问题

Dart官方http库解析响应内容时，如果后端返回的响应头Content-Type未明确声明charset=utf-8，会默认使用ISO-8859-1（Latin-1）编码解码字节流，你当前仅在请求头设置了字符集，后端返回的响应未携带编码声明，才会出现UTF-8编码的ò被错误解析为ò的情况。

提供两种可独立使用的修复方案，按需选择即可：

方案1：前端Dart侧修复（无需改后端代码，见效最快） #

不要直接使用response.body，手动将响应二进制字节流用UTF-8解码即可，修改login方法逻辑：

// 顶部引入convert库
import 'dart:convert';

Future<LoginResponse> login(String tessera, String password) async {
    try {
      final response = await _http.post(_loginUri, headers: _headers,
      body: json.encode({"tessera" : tessera, "password" : password}));
      // 替换原response.body，手动解码字节流
      final String responseBody = utf8.decode(response.bodyBytes);
      print(responseBody);
      return LoginResponse.fromJson(json.decode(responseBody));
    } catch (e) {
      throw _handleError(e);
    }
}

方案2：后端Spring Boot侧修复（从根源统一所有接口编码） #

配置Spring Boot全局返回UTF-8编码的响应头，Dart http库识别后会自动使用UTF-8解码，无需修改前端代码：

• 全局配置方式，在application.yml中添加如下配置：

spring:
  http:
    encoding:
      force: true
      charset: UTF-8
      enabled: true

如果使用application.properties，对应配置为：

spring.http.encoding.force=true
spring.http.encoding.charset=UTF-8
spring.http.encoding.enabled=true

• 单接口配置方式，给登录接口的@PostMapping注解添加produces属性：

@PostMapping(value = "/api/login", produces = "application/json;charset=UTF-8")
public LoginResponse login(@RequestBody LoginRequest request) {
    // 原有业务逻辑
}

内容的提问来源于stack exchange，提问作者Razlo3p