browser - Web 浏览器中的后退按钮如何工作？

Question

我在网上搜索了这个问题，但一无所获:

后退按钮的逻辑是什么？当我们点击网络浏览器上的后退按钮时会发生什么？

我真的很想了解更多。

Answer 1

您的网络浏览器会保留您在该窗口中访问过的网页的堆栈(或列表，如果您愿意的话)。假设您的主页是 search.example，您可以从那里访问其他一些网站:video.example、portal.example 和 news.example。访问最后一个后，列表如下所示:

search.example -> video.example -> portal.example -> news.example
                                                          ^
                                                          |
                                                     current page

当您按“后退”按钮时，浏览器会将您带回到列表中的上一页，如下所示:

search.example -> video.example -> portal.example -> news.example
                                        ^
                                        |
                                   current page

此时，您可以再次按“后退”键转到 video.example，也可以按“前进”键再次转到 news.example。假设您第二次按“返回”:

search.example -> video.example -> portal.example -> news.example
                       ^
                       |
                  current page

如果您现在访问 example.com，列表将更改为如下所示:

search.example -> video.example -> example.com
                                      ^
                                      |
                                 current page

请注意，portal.example 和 news.example 均已从列表中消失。这是因为你走了一条新路线。浏览器仅维护您访问过的页面列表，而不是您曾经访问过的每个页面的历史记录。浏览器也不知道您正在访问的网站的结构，这可能会导致一些令人惊讶的行为。

您正在访问一个购物网站(作为一个简短的示例，shop.example)，该网站包含可供浏览的产品类别和子类别。网站设计者贴心提供了breadcrumbs靠近窗口顶部，可让您浏览类别。您从网站的首页开始，单击“硬件”，然后单击“内存”。该列表现在如下所示:

search.example -> shop.example -> shop.example/hw -> shop.example/hw/mem
                                                           ^
                                                           |
                                                      current page

您想要返回到“硬件”类别，因此您使用面包屑导航到父类别，而不是使用“后退”按钮。现在浏览器列表如下所示:

search.example -> shop.example -> shop.example/hw -> shop.example/hw/mem -> shop.example/hw
                                                                                  ^
                                                                                  |
                                                                             current page

根据网站结构，您向后退(上一级)，但对于浏览器，您前进，因为您单击了链接。每当您单击链接或在地址栏中输入 URL 时，就浏览器而言，您都会继续前进，无论该链接是否会将您带到您已经访问过的页面。

最后，您想要返回主站点页面 (shop.example)。您可以使用面包屑，但这次您单击“后退”按钮 - 显然它应该将您提升一级，对吧？但它会带你去哪里呢？

最初让许多用户(包括我自己，当我碰巧这样做时)感到困惑，它会让你“下降”一个级别，回到内存类别。查看页面列表，很容易看出原因:

search.example -> shop.example -> shop.example/hw -> shop.example/hw/mem -> shop.example/hw
                                                            ^
                                                            |
                                                       current page

要仅使用“后退”按钮返回主页，需要再按两次，才能“返回”到“硬件”类别，最后回到主页。对于我们程序员来说，发生的事情似乎很明显，但它总是让普通用户感到惊讶，因为他们没有意识到浏览器不知道他们碰巧访问的任何网站的层次结构。

如果浏览器允许网站设计者对“后退”按钮进行编程以执行明显的操作(使您更上一层楼)而不是它现在所做的任何事情，那会很棒吗？

评论者询问浏览器是否重新加载页面或只是从本地缓存中显示它。

答案是视情况而定。站点设计者可以指定浏览器是否应该缓存页面。对于设置为非缓存的页面，当您按“后退”键时，浏览器会从服务器重新加载页面，就像您第一次访问它一样。对于缓存的页面，浏览器会从缓存中显示它，速度要快得多。