WebExtension：为什么浏览器会在请求的URL末尾添加斜杠？

Question

当我向http://www.example.com发起请求时，为什么在webRequest.onBeforeRequestListener中看到的是http://www.example.com/？

例如：

chrome.webRequest.onBeforeRequest.addListener(
  details => console.log('Sending request to', details.url),
  { urls: ['<all_urls>'] });
fetch('http://www.example.com');

将会打印

Sending request to http://www.example.com/

这与网络请求监视器中显示的请求URL一致。例如，如果我将其转换为curl命令，则请求如下所示：

curl 'http://www.example.com/' -H 'Accept: */*' -H 'Connection: keep-alive'
    -H 'Accept-Encoding: gzip, deflate' -H 'Accept-Language: en-US,en;q=0.9'
    -H 'User-Agent: ...' --compressed

因此，最初发出的请求是针对http://www.example.com/而非http://www.example.com。这个决定必须是在浏览器中做出的，而非服务器端。

使用XMLHttpRequest时也会出现同样的行为，与fetch相同。我使用的是Chrome浏览器，但在Firefox上也是一样的。

问题：

- 为什么浏览器会自动更改它？它也会发生在其他URL上。据我所知，添加尾随斜线通常可以解决问题，但总体来说，这是一个破坏性的改变。 - 如果我想在onBeforeRequest监听器中过滤当前请求到特定的URL，如何可靠地匹配它？例如，仅检查URL是否相同将失败。 - 浏览器中是否还有更多的重写URL规则需要注意？

- Philipp Claßen

---

关于尾随斜杠的其他答案：https://dev59.com/s3E85IYBdhLWcg3w2HXs，https://webmasters.stackexchange.com/questions/35643/is-trailing-slash-automagically-added-on-click-of-home-page-url-in-browser - Luka Čelebić

@PredatorIWD 感谢提供链接。这似乎证实了我在答案中所写的内容。 - Philipp Claßen

Answer 1

我想到了，浏览器只是在修复一个无效的URL。

引用自 维基百科，URL看起来像这样：

scheme:[//[user[:password]@]host[:port]][/path][?query][#fragment]

如果存在权限部分，则路径必须以单斜杠（/）开头，如果不存在，也可以以单斜杠开头，但不能以双斜杠开头。路径始终被定义，尽管定义的路径可能为空（零长度），因此没有尾随斜杠。

http://example.com具有权限部分（在此示例中为模式加主机名：http://example.com），但这使得路径为空。根据规范，路径必须以/开头，因此浏览器通过将空路径替换为/来修复它。

如果您使用有效的URL，例如http://example.com/abc，则无需修改它。

- Philipp Claßen

---

据我所知，这来自HTTP RFC。以下是相关引用 https://dev59.com/s3E85IYBdhLWcg3w2HXs#2581514 - Eugene Gr. Philippov

@Philip，我觉得这个不是修复URL的方法，请看一下我发的问题，这里“/”并不会自动添加：https://dev59.com/SFSPsogBPY-HTNNjEbrT - Sup Ravi Kumar

@SupRaviKumar，一个技术上无效的URL（如http://example.com）和一个有效的URL（如http://example.com/abc）之间存在差异。只有在第一种情况下，才会添加“/”（如我的答案所述）。在您链接的问题中，涉及到了第二种情况。由于URL格式良好且更改可能会改变其含义，因此浏览器不会更改它。 - Philipp Claßen