在不安全的前端计算价格？
Calculate price on frontend insecure?
我想知道是否可以操纵在前端完成的价格计算？我读了很多关于 JavaScript 价格计算器的文章，其业务逻辑仅在客户端，但对安全性一无所知。
考虑以下场景：
- React 应用程序有一个组件（表单）可以根据其子组件（表单输入）的状态（用户交互）计算价格。
- 这些子组件的价格来自API。
- 但是计算是由父组件处理的——在前端。
是否可以通过表格发送经过处理的计算结果？
这里有一个重要的教训 - 某人完全有可能更改浏览器和服务器之间发送的任何值，因为他们可以拦截 HTTP 请求并修改值。
编辑：更多细节。
当您提交表单或触发带有参数的 API 请求时，浏览器会创建一个指向您的 URL 的 HTTP 请求，并且您的参数会在其中编码。这个数据包可以被拦截和改变，所以它可以通过你所有的客户端验证（这实际上只是为了用户体验），并随意修改。
您最好学习如何使用 Burp Suite 等工具来了解如何完成此操作，并了解有关网络安全的更多信息。
这就是我们同时使用客户端 和 服务器端验证的原因。
您应该在前端具有正确的逻辑 运行，但实际上在服务器上复制此逻辑并验证数据是否正确。如果不是，则由您决定如何处理它，但您应该始终对从客户端 -> 服务器移动的数据保持警惕。
是的，仅客户端计算（没有服务器端验证）是不安全的。
不幸的是，限制您的（客户端）表单可以发送的值不足以防止操纵。这是因为 HTTP 请求可以通过各种不同的方法发送，而不仅仅是从您构建的表单。
要绕过此保护，攻击者需要做的就是检查您对服务器的 API 请求（例如，使用 Chrome 或 Firefox 中的开发人员工具），然后使用计算值改变。 Firefox 的开发人员工具甚至有一个功能 "Edit and Resend" 专门允许您执行此操作（它也有调试和测试 APIs 的合法用途）。
你没有服务器环境的控制权吗？如果你这样做，你为什么不想在那里实施验证？如果您告诉我们更多关于您的设置的信息，那么我们可能会帮助您找到解决问题的好方法:)
假设您在一家商店担任收银员。一位顾客到达并说
"I want to buy this Ice Cream, it costs 2$"
您信任您的客户并向他收取 2 美元。现在另一个（恶意的）客户到达并说：
"I want to buy this Ice Cream, it costs -1000$"
你信任他，给了他1000$。
不太对吧？就像收银员检查价格一样，您的服务器也必须这样做。或者收银员/服务员自己查价。
"I want this Ice Cream"
"It costs 4$"
我想知道是否可以操纵在前端完成的价格计算？我读了很多关于 JavaScript 价格计算器的文章，其业务逻辑仅在客户端，但对安全性一无所知。
考虑以下场景：
- React 应用程序有一个组件（表单）可以根据其子组件（表单输入）的状态（用户交互）计算价格。
- 这些子组件的价格来自API。
- 但是计算是由父组件处理的——在前端。
是否可以通过表格发送经过处理的计算结果？
这里有一个重要的教训 - 某人完全有可能更改浏览器和服务器之间发送的任何值，因为他们可以拦截 HTTP 请求并修改值。
编辑：更多细节。
当您提交表单或触发带有参数的 API 请求时，浏览器会创建一个指向您的 URL 的 HTTP 请求，并且您的参数会在其中编码。这个数据包可以被拦截和改变，所以它可以通过你所有的客户端验证（这实际上只是为了用户体验），并随意修改。
您最好学习如何使用 Burp Suite 等工具来了解如何完成此操作，并了解有关网络安全的更多信息。
这就是我们同时使用客户端 和 服务器端验证的原因。
您应该在前端具有正确的逻辑 运行，但实际上在服务器上复制此逻辑并验证数据是否正确。如果不是，则由您决定如何处理它，但您应该始终对从客户端 -> 服务器移动的数据保持警惕。
是的，仅客户端计算（没有服务器端验证）是不安全的。
不幸的是，限制您的（客户端）表单可以发送的值不足以防止操纵。这是因为 HTTP 请求可以通过各种不同的方法发送，而不仅仅是从您构建的表单。
要绕过此保护，攻击者需要做的就是检查您对服务器的 API 请求（例如，使用 Chrome 或 Firefox 中的开发人员工具），然后使用计算值改变。 Firefox 的开发人员工具甚至有一个功能 "Edit and Resend" 专门允许您执行此操作（它也有调试和测试 APIs 的合法用途）。
你没有服务器环境的控制权吗？如果你这样做，你为什么不想在那里实施验证？如果您告诉我们更多关于您的设置的信息，那么我们可能会帮助您找到解决问题的好方法:)
假设您在一家商店担任收银员。一位顾客到达并说
"I want to buy this Ice Cream, it costs 2$"
您信任您的客户并向他收取 2 美元。现在另一个（恶意的）客户到达并说：
"I want to buy this Ice Cream, it costs -1000$"
你信任他，给了他1000$。
不太对吧？就像收银员检查价格一样，您的服务器也必须这样做。或者收银员/服务员自己查价。
"I want this Ice Cream"
"It costs 4$"