页面加载后多久可以读取路径名？

Question

我有一个显示记录列表的页面： 我的应用程序。com/records/ 以及显示所选记录详细信息的页面： 我的应用程序。com/record-details/497

（我正在使用 ui-router 和 angular 所以我的路径指定为 url: '/record-details/:id/' )

QA 发现，从一个记录页面，他们可以破解 URL 以尝试命中另一条记录，如下所示：myapp.com/record-details/498

我想阻止这种情况。

正确记录的数据是内部传递的，通过JavaScript，从列表到详情页面，所以我有机会进行比较。所以我正在做的是将通过 JS 传递的 recordId 与从 URL 中提取的 id 进行比较。如果它们不匹配，那么有人试图破解 URL，我可以重新路由页面。

不幸的是，URL 在我第一次测试时不可用。我想知道为什么不可以，需要多长时间才能可用。

我的记录详情页面中的代码是这样开始的：

function init(){
   // do some regex manipulation of pathname
   // compare url-RecordId with in-memory-RecordId
   console.log('rawurl : ' + window.location.pathname);
}
init();

输出：

rawurl : myapp.com/records/

所以：当加载我的DETAILS页面时，pathname变量仍然指向记录列表页面！

我等待路径名反映详细信息页面的时间越长 URL，用户看到我的页面空白、损坏和即将重新路由的时间就越长，这是一种糟糕的用户体验。

我怎样才能快速ui有效地重新路由页面？

Answer 1

根据经验，您永远不应尝试规避服务器操作（因此使用客户端代码获取 /records/{id} 的请求。恶意用户可以用他们自己的文件替换您的 javascript 文件，甚至可以跳过您的验证码。

正如 Quentin 在评论中提到的，更好、更安全的解决方案是在服务器端代码中使用 Authorise/Authentication 层，以确保允许用户请求该记录。虽然我不知道您的成员资格架构是如何工作的，所以我无法对细节发表评论。希望这能为您指明正确的方向！

Answer 2

我找到了简短的答案（但它没有解决更大的安全问题，也没有完全解决我的问题）。

添加“$location”依赖项，然后执行以下操作： $location.path()

所以，这个：

console.log(":) " + $location.path());
console.log(":( " + window.location.pathname);

输出这个：

:) myapp.com/record/497/
:( myapp.com/records/

出于某种原因，它提供了正确的 URL，即使 angular 文档实际上说它是“...基于 window.location...”...

https://docs.angularjs.org/guide/$location

谢谢大家。我会和我的团队一起解决更大的安全问题。

页面加载后多久可以读取路径名？

how soon on page load can I read the pathname?

javascript

angular-ui-router