Safari 和 Chrome 在使用自定义 URL 架构时,URL 构造器的行为不一致。

huangapple go评论90阅读模式
英文:

Inconsistent behavior of the URL constructor between Safari and Chrome, when working with custom URL schema

问题

我正在尝试弄清楚为什么在Safari和Chrome中两个相同的URL构造函数调用之间存在差异。

这是来自Safari的示例:

Safari 和 Chrome 在使用自定义 URL 架构时,URL 构造器的行为不一致。

这是来自Chrome的示例:

Safari 和 Chrome 在使用自定义 URL 架构时,URL 构造器的行为不一致。

我正在开发一个在各种移动平台(如Android和iOS)中嵌入Webview的应用程序。URL构造函数的这种行为导致了问题。

正如你在Chrome中看到的,路径名包含了错误的localhost,主机名和主机也为空,在Safari中一切看起来都正常。

我试图在本地设置manifest.json以测试是否可以通过注册自定义URL模式来控制此行为,还尝试使用navigator.registerProtocolHandler进行操作,这是链接到文档。

英文:

I am trying to figure out why there is a difference between two identical URL constructor calls in Safari and Chrome

Here is the example from Safari:

Safari 和 Chrome 在使用自定义 URL 架构时,URL 构造器的行为不一致。

And here is an example from Chrome:

Safari 和 Chrome 在使用自定义 URL 架构时,URL 构造器的行为不一致。

I'm working on an application that embeds inside a webview for various mobile platforms such as Android and Ios. This behavior of the URL constructor creates problems.

As you can in the chrome pathname includes localhost which is incorrect, the hostname and host are also empty, in safari everything seems fine

I was trying to set up manifest.json locally to test is there a way to control this behavior by registering custom URL schema, also I was trying to play with navigator.registerProtocolHandler, here is the link to the docs.

答案1

得分: 1

这不是URL构造函数的实际问题。问题实际上出现在传递给构造函数的参数上。

正如你可能已经知道的,JavaScript 是一门有点“糊弄性”的语言。它不像其他语言那样非常严格和拘谨,而是尽可能优雅地处理一切,而不会抛出异常(这就是为什么我们有那么多糟糕的 JavaScript 开发人员的原因)。

第一点:test 不是一个真正的协议

第一个问题是 test:// 实际上不是一个真正的协议。但是 URL 构造函数并不关心这一点,因为人们每天都在创造新的协议。因此,URLtest:// 视为有效的协议。

第二点:主机名不正确

这就是 URI 和 URL 之间的区别。URI 的主机名可以采用任何格式(在协议 :// 之后,在路径 / 之前)。

而对于 URL,主机名必须包含域名(google)和顶级域名(.com)。有一些 URL,就像你的这个例子,不包含顶级域名。在使用 localhost 的情况下,你还应该包括端口号(:3000:8080 或类似的)。


如果你尝试以下内容,你会注意到它们具有相同的实现:

new URL('https://localhost:3000/my/path?query=my+query')
英文:

This is not really a problem with the URL constructor. The problem is actually with the argument that has been provided to the constructor.

As you probably already know, JavaScript is quite a hacky language. Rather than being very strict and uptight, it tries to handle everything as gracefully as possible rather than throwing an exception (that's why we have tons of terrible JavaScript developers).

First: test is not an actual protocol

The first issue is that test:// is not an actually a protocol. However, the URL constructor doesn't really care because people make up new protocols every single day. Because of this, URL will accept test:// as a valid protocol

Second: Hostname is incorrect

This is where the difference between a URI and a URL come into play. A URI can have any format as the hostname (after the protocol, ://, and before the path, /).

With a URL, the hostname must contain the domain name (google) and the top-level domain (.com). There are some URLs, like yours, that don't include a top-level domain. In the case that you are using localhost, you should also include a port number (:3000 or :8080 or something like that).


If you try the following, then you will notice that they have identical implementations:

new URL('https://localhost:3000/my/path?query=my+query')

huangapple
  • 本文由 发表于 2023年5月25日 00:39:50
  • 转载请务必保留本文链接:https://go.coder-hub.com/76325742.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定