如何阻止用户编辑 URL
How to block user from editing URL
我目前正在制作一个回答问题的网站，但遇到了问题。
即比如在回答第二题时，用户想回到上一题编辑答案，有2种方式：
- 使用浏览器的撤消按钮
- 更改URL
ex: question?id=2 change to question?id=1
网络将重新加载上一个问题，他们可以更改答案。
我已经阻止了方法 #1，但是如果用户更改 URL，我不知道如何阻止它？
想请教你的解决方法，我用的是js，如果用vue3 ts就更好了
无法直接阻止修改顶级 URL，但是，您可以采取其他几种解决方案。如果您使用的是 Vue Router，则可以使用 navigation guards and redirect back if an invalid change is detected. Otherwise, for a more traditional solution, you can hide the URL inside of an iframe，其 URL 将无法从导航栏访问。示例 HTML：
<iframe src="/question?id=2"></iframe>
请记住，任何客户端安全都可以被绕过，最好将敏感数据存储在服务器上。对于 iframe，具有开发工具知识的人修改其中的 URL 是微不足道的。
如果您想阻止用户输入问题 #1 的新答案，那么您需要在服务器上保留一些状态。维护一个问题列表，跟踪哪些问题已经得到回答，哪些还没有。当您请求 question?id=1 并且服务器状态是用户已经回答问题 #1 时您提供的页面应该显示错误，或者只是强制它转到第一个未回答的问题，或者通过重定向或仅提出问题 2 或一些合理的东西。但底线是服务器需要状态。
这就像，如果我转到我的银行页面并在我的浏览器中编辑我的余额以在我的银行账户余额末尾添加几个 000，它实际上不会改变我的金额银行，就是本地显示的内容。要实际更改银行余额，我必须向服务器发出请求，导致我的余额被更改。
你也一样。如果您不想接受对已提交问题的新答案，那么您会知道页面何时尝试提交答案。该页面可能会对用户对问题 1 的回答执行 POST，并且服务器将答案保存在某处。如果浏览器对同一个问题做了另一个 POST 的回答（因为用户破解了 URL），您可以简单地拒绝请求并拒绝更改服务器状态，返回某种错误，例如“你已经回答了那个问题”。
您在此事件中为用户提供的体验并没有那么重要（他们是黑客），但为了做一些合理的事情，请考虑将浏览器重定向到正确的问题。下一个未回答的问题可能是对“您已经回答了该问题”REST 响应的一部分。
你不能阻止用户更改 URL 所以你需要做的是找到一些方法来检测用户是否更改了 URL，然后在后端做一些事情.问题是您无法将它们发送回它们来自的页面，因此它们的流会中断。
如果您使用标准 <form> 输入，最简单的方法可能是在提供页面时包含一个具有唯一 ID 的隐藏输入：
<input type="hidden" id="noCheating" name="noCheating" value="34657">
然后当网络服务器处理 POST 时，您可以检查发布的数据中是否存在 noCheating 以及它是否没有退出。
如果后续页面请求有 referer headers，服务器可以检查这些请求，然后拒绝没有它们的 GET 请求。
这两种方法都是一种容易实现的方法，旨在将 99% 不关心的人拒之门外。如果您担心真正的黑客，您将不得不在每一步都保存状态，然后验证之前问题的数据是否已经按照@Wyck 的建议提交。
正如其他人所说，鉴于 url 地址栏无法由网页。
我猜你是在请求 API 当用户尝试编辑答案时看起来像下面这样？我的建议是 将请求方法更改为 POST 并通过 Body 传递参数，而不是从查询字符串传递参数 （这基本上是后端的工作）。
通过这样做，您的 url 将始终显示为 /question 而不是 /question?id=xxx，这意味着用户无法通过更改 id 参数返回。
我目前正在制作一个回答问题的网站，但遇到了问题。 即比如在回答第二题时，用户想回到上一题编辑答案，有2种方式：
- 使用浏览器的撤消按钮
- 更改URL
ex: question?id=2 change to question?id=1
网络将重新加载上一个问题，他们可以更改答案。
我已经阻止了方法 #1，但是如果用户更改 URL，我不知道如何阻止它？ 想请教你的解决方法，我用的是js，如果用vue3 ts就更好了
无法直接阻止修改顶级 URL，但是，您可以采取其他几种解决方案。如果您使用的是 Vue Router，则可以使用 navigation guards and redirect back if an invalid change is detected. Otherwise, for a more traditional solution, you can hide the URL inside of an iframe，其 URL 将无法从导航栏访问。示例 HTML：
<iframe src="/question?id=2"></iframe>
请记住，任何客户端安全都可以被绕过，最好将敏感数据存储在服务器上。对于 iframe，具有开发工具知识的人修改其中的 URL 是微不足道的。
如果您想阻止用户输入问题 #1 的新答案，那么您需要在服务器上保留一些状态。维护一个问题列表，跟踪哪些问题已经得到回答，哪些还没有。当您请求 question?id=1 并且服务器状态是用户已经回答问题 #1 时您提供的页面应该显示错误，或者只是强制它转到第一个未回答的问题，或者通过重定向或仅提出问题 2 或一些合理的东西。但底线是服务器需要状态。
这就像，如果我转到我的银行页面并在我的浏览器中编辑我的余额以在我的银行账户余额末尾添加几个 000，它实际上不会改变我的金额银行，就是本地显示的内容。要实际更改银行余额，我必须向服务器发出请求，导致我的余额被更改。
你也一样。如果您不想接受对已提交问题的新答案，那么您会知道页面何时尝试提交答案。该页面可能会对用户对问题 1 的回答执行 POST，并且服务器将答案保存在某处。如果浏览器对同一个问题做了另一个 POST 的回答（因为用户破解了 URL），您可以简单地拒绝请求并拒绝更改服务器状态，返回某种错误，例如“你已经回答了那个问题”。
您在此事件中为用户提供的体验并没有那么重要（他们是黑客），但为了做一些合理的事情，请考虑将浏览器重定向到正确的问题。下一个未回答的问题可能是对“您已经回答了该问题”REST 响应的一部分。
你不能阻止用户更改 URL 所以你需要做的是找到一些方法来检测用户是否更改了 URL，然后在后端做一些事情.问题是您无法将它们发送回它们来自的页面，因此它们的流会中断。
如果您使用标准 <form> 输入，最简单的方法可能是在提供页面时包含一个具有唯一 ID 的隐藏输入：
<input type="hidden" id="noCheating" name="noCheating" value="34657">
然后当网络服务器处理 POST 时，您可以检查发布的数据中是否存在 noCheating 以及它是否没有退出。
如果后续页面请求有 referer headers，服务器可以检查这些请求，然后拒绝没有它们的 GET 请求。
这两种方法都是一种容易实现的方法，旨在将 99% 不关心的人拒之门外。如果您担心真正的黑客，您将不得不在每一步都保存状态，然后验证之前问题的数据是否已经按照@Wyck 的建议提交。
正如其他人所说，鉴于 url 地址栏无法由网页。
我猜你是在请求 API 当用户尝试编辑答案时看起来像下面这样？我的建议是 将请求方法更改为 POST 并通过 Body 传递参数，而不是从查询字符串传递参数 （这基本上是后端的工作）。
通过这样做，您的 url 将始终显示为 /question 而不是 /question?id=xxx，这意味着用户无法通过更改 id 参数返回。