Angular 2 HTTP响应JSON数字格式不一致，如何设置文化区域统一？

这绝对是区域本地化设置搞的鬼！我之前也碰到过类似的坑，给你拆解下问题根源和解决办法：

问题到底出在哪？ #

首先得澄清：JSON规范里的数值是固定用英文小数点（.）的，@angular/http默认用的JSON.parse根本不会管系统区域，所以大概率不是前端解析的锅。更可能的情况是：

• 后端会根据你请求头里的Accept-Language（这个是浏览器跟着系统区域自动携带的），把数值转成对应区域的字符串返回，而不是返回原生的JSON数值类型；
• 或者你的前端代码里，自己写了依赖系统区域的数值解析逻辑，没用到原生的JSON解析。

怎么解决？ #

分几种情况给你具体方案：

首选：让后端返回标准JSON数值

如果能联系后端同学改代码，直接要求他们返回原生数值类型，比如：

{ "amount": 233.55 }

这种情况下，不管你用什么区域的电脑，前端解析出来的都是正确的233.55，彻底解决问题。

后端改不了？前端手动统一解析

如果后端没法调整，那就在前端强制用en-US区域的规则来解析数值字符串：

import { Http } from '@angular/http';

// 你的请求代码可以这么改
this.http.get('/api/your-endpoint')
  .map(response => {
    const rawData = response.json();
    // 把amount字符串转成统一格式的数值
    const amountStr = rawData.amount.toString();
    // 简单粗暴版：只保留数字和英文小数点
    const normalizedAmount = parseFloat(amountStr.replace(/[^0-9.]/g, ''));
    // 要是想更严谨，用Intl API处理复杂区域格式
    // const parts = new Intl.NumberFormat('en-US').formatToParts(amountStr);
    // const normalizedStr = parts.map(part => part.type === 'decimal' ? '.' : part.value).join('');
    // const normalizedAmount = Number(normalizedStr);
    return { ...rawData, amount: normalizedAmount };
  })
  .subscribe(result => {
    console.log(result.amount); // 不管在哪台电脑上都是233.55
  });

另一种思路：强制后端返回统一格式

你也可以在请求头里固定Accept-Language为en-US，告诉后端“就给我英文区域的格式”：

import { Http, Headers } from '@angular/http';

this.http.get('/api/your-endpoint', {
  headers: new Headers({
    'Accept-Language': 'en-US'
  })
})
.map(response => response.json())
.subscribe(result => {
  // 这时候后端应该会返回符合en-US格式的数值了
});

额外排查小技巧 #

• 看看两台电脑的浏览器语言设置：浏览器的Accept-Language优先级会影响后端返回的内容，检查是不是一台是中文/用逗号做小数点的区域，另一台是英文区域；
• 直接看API原始响应：打开浏览器开发者工具的Network面板，找到你的API请求，看Response里的原始数据，确认后端返回的到底是数值还是字符串，格式有没有差异。

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