ajax|json ajax json乱码解决方法及解析技巧

🔍 AJAX | JSON 关键词内容

📌 核心概念

• AJAX：异步JavaScript与XML（Asynchronous JavaScript and XML），用于无刷新数据交互。
• JSON：轻量级数据格式（JavaScript Object Notation），替代XML的流行选择。

🚀 AJAX + JSON 应用场景

• 动态加载数据（如分页、实时搜索）
• 前后端分离架构的数据传输
• API接口交互（如RESTful服务）

💡 乱码解决方法

1. 统一编码：确保前后端均使用UTF-8（推荐✅）。

   • 后端示例：response.setContentType("application/json;charset=UTF-8");
   • 前端示例：Content-Type: application/json; charset=utf-8

2. 转码处理：

   

   • JavaScript：encodeURIComponent() 或 decodeURIComponent()
   • Java：new String(request.getBytes("ISO-8859-1"), "UTF-8")

3. 框架配置：

   • Spring MVC：@RequestMapping(produces="application/json;charset=UTF-8")
   • jQuery AJAX：contentType: "application/json; charset=utf-8"

🔧 解析技巧

• 前端解析JSON：

  let data = JSON.parse(response); // 字符串转对象
  console.log(data.key); 

• 后端生成JSON（以Java为例）：

  ObjectMapper mapper = new ObjectMapper();
  String json = mapper.writeValueAsString(obj); // 对象转JSON字符串

⚠️ 常见坑点

• 未设置响应头导致浏览器解析错误❌
• 跨域请求（CORS）未处理🔒
• JSON格式错误（如缺少引号/逗号）

🌟 趣味Tips

• 用try-catch捕获JSON解析异常，避免页面崩溃💥
• 调试神器：console.log(JSON.stringify(data)) 格式化输出👨‍💻