后端传long类型数据到前端精度丢失问题

这篇具有很好参考价值的文章主要介绍了后端传long类型数据到前端精度丢失问题。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

在 Spring Boot 中,将 long 类型传输到前端时,会发现该类型的值可能会出现精度丢失的问题。

这是因为在 JavaScript 中,数字类型默认会被转换为双精度浮点数,而双精度浮点数的精度有限,只能精确表示 2 的 53 次方以内(即 Number.MAX_SAFE_INTEGER,约为 9 x 10^15)的整数。对于超过该范围的长整数,JavaScript 会发生精度丢失,导致值变得不准确。

解决方案一:将 long 转换为字符串

1:在后端将 long 类型的值转换为字符串类型,可以使用 String.valueOf() 方法或者 Long.toString() 方法,如下所示:

long num = 123456789012345L;
String str = String.valueOf(num);
// 或者
String str = Long.toString(num);

2:在前端通过 AJAX 请求获取该字符串类型的值,并将其解析为数字类型。由于 JavaScript 中的数值类型默认使用 IEEE 754 标准的双精度浮点数表示,因此需要使用 JavaScript 的 BigInt() 方法将其转换为大整数类型。

let str = "123456789012345";
let num = BigInt(str);

解决方案二:使用第三方库进行高精度运算

1:在后端将 long 类型的值转换为 BigDecimal 类型(Java 中的高精度类型),并通过 JSON 序列化后传递到前端。这里以 Spring Boot 中使用 FastJSON 序列化为例,如下所示:

BigDecimal num = new BigDecimal("123456789012345");
String jsonStr = JSON.toJSONString(num);

2:在前端使用第三方库 big.jsbignumber.js 进行高精度运算。这里以 big.js 为例,首先需要引入 big.min.js 文件,在代码中使用 Big() 类构造高精度对象,并进行相应的运算。

<script src="big.min.js"></script>
let num = new Big("123456789012345");
let result = num.plus(1);

此外还可以使用注解来解决 long 类型的精度丢失问题

Spring Boot 中提供了 @JsonFormat 注解,可以对实体类中的属性进行序列化和反序列化格式化。对于 long 类型的属性,可以设置其格式为字符串类型,并在前端进行相应的处理,以保持其精度不丢失。

具体实现方式:

1:在实体类中添加 @JsonFormat 注解,设置其 shape 属性为 JsonFormat.Shape.STRING,如下所示:

public class Example {
    @JsonFormat(shape = JsonFormat.Shape.STRING)
    private Long num;
}

2:在前端获取该值时,直接使用字符串类型进行处理,如下所示:

let numStr = data.num;

Spring Boot 中可以通过配置文件来解决 long 类型的精度丢失问题。

在 Spring Boot 的配置文件 application.properties 中添加如下配置:

spring.jackson.serialization.WRITE_DATES_AS_TIMESTAMPS=false
# 将 long 类型序列化为字符串类型
spring.jackson.serialization.WRITE_NUMBERS_AS_STRINGS=true

其中,WRITE_DATES_AS_TIMESTAMPS 表示是否将日期类型序列化为时间戳类型,默认为 true,这里设置为 false 如果需要将日期类型序列化为时间戳类型,则不需要设置此属性。而 WRITE_NUMBERS_AS_STRINGS 则表示是否将数字类型序列化为字符串类型,默认为 false,这里设置为 true 即可将 long 类型序列化为字符串类型。文章来源地址https://www.toymoban.com/news/detail-609075.html

到了这里,关于后端传long类型数据到前端精度丢失问题的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 后端long类型数据在前端产生精度损失

    后端我们常常会用Long类型的数据作为ID,例如用雪花算法生成唯一ID java中long类型的取值范围 (-9,223,372,036,854,775,808)(9,223,372,036,854,775,807)。有19位数字 JavaScript的Number类型是浮点数类型,它可以表示的整数范围是从(-9,007,199,254,740,992)到2^53(9,007,199,254,740,992)只有16位数

    2024年02月16日
    浏览(33)
  • Es 通过javaApi上传数据Long类型丢失精度的问题一次性解决

    通过 updateRequest.docAsUpsert(true) true 表示无匹配_id是插入数据,false 表示无匹配_id会抛出异常

    2024年02月15日
    浏览(35)
  • SpringBoot后端Long数据传到前端js精度损失问题

    在对应的字段上添加注解,将 Long 转为 String 后传输。 在 js 对应的结果接收上使用 BigInt 。

    2024年02月19日
    浏览(33)
  • spring Boot处理返回给前端Long类型精度丢失

    项目中采用springcloud Alibaba技术开发分布式系统,开发过程中采用雪花算法生成分布式Id,为Long类型,而Long类型返回给前端,会出现精度丢失问题。 接下来我们主要了解下,如何快速的处理精度丢失的问题 可以直接在返回实体属性添加\\\"@JsonSerialize(using = ToStringSerializer.class)\\\"。

    2024年02月02日
    浏览(35)
  • 前端接收后端数据时,遇到精度丢失的问题

    之前项目开发过程中遇到过前端接收后端数据时,遇到精度丢失的问题。当时进行了问题记录,本篇博客针对于这个问题进行问题原因并进行多种方式解决这个问题。 前端接收后端返回的数据时出现精度丢失问题,通常是因为在数据传输过程中,数据类型被转换为了 JavaScr

    2024年02月02日
    浏览(34)
  • 如何解决前端传递数据给后端时精度丢失问题

    有时候我们在进行修改操作时,发现修改既不报错也不生效。我们进行排查后发现服务器端将数据返回给前端时没有出错,但是前端js将数据进行处理时却出错了,因为id是Long类型的,而js在处理后端返回给前端的Long类型数据时只能处理前16位,后3位进行了四舍五入操作,例

    2024年02月09日
    浏览(31)
  • SpringBoot解决前端js处理大数字丢失精度问题Long转String

    一、Jackson对Long类型的处理导致精度丢失的问题 表的某一个字段的类型是 BIGINT,对应的 Java 类的属性的类型就是 Long。当这个字段的值由后端返回给前端网页时,发现了精度丢失的问题。比如后端返回的值是 588085469986509185,到了前端是 588085469986509200,后面的几位数变成了

    2024年02月21日
    浏览(29)
  • 前端接收后端传的文件流并下载解决乱码问题

    两种情况: 1.如果这个接口是get的请求: 后端返回文件流,前端可能会导出txt或者excel的时候,里面的中文会出现乱码 就可以直接通过以下方式直接下载: window.location.href = \\\"请求文件流的接口地址\\\" 2.如果这个接口是post的请求:         因为存在多种场景,可能需要通过

    2024年02月11日
    浏览(34)
  • vue前端接收后端传过来的带list集合的数据

    前后端交互,如下的示例 Json 报文,前端采用vue进行接收.

    2024年02月16日
    浏览(41)
  • 前端计算数字精度丢失问题解决方法记录

    在日常一些需求中,总会遇到一些需要前端进行手动计算的场景,那么这里需要优先考虑的则是数字精度问题!具体请看下面截图 如图所示,在JavaScript进行浮点型数据计算当中,会出现计算结果“不正确”的现象。 我们知道浮点型数据类型主要有:单精度float、双精度doub

    2024年02月05日
    浏览(46)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包