[Web翻译]网络之外的超链接

197 阅读22分钟

原文地址:css-tricks.com/hyperlinkin…

原文作者:css-tricks.com/author/atis…

发布时间:2018年7月11日

超链接是网络中最古老和最流行的功能。超文本(也就是http/s中的ht)这个词意味着有超链接的文本。链接到其他人的超文本的能力使网络,成为一个网络--一组连接的页面。这一基本特征使网络成为一个非常强大的平台,很明显,应用程序的世界需要这一特征。所有现代平台都支持应用程序注册URI(自定义协议)的方式,也有通用链接(在应用程序中处理网络链接)。

让我们看看为什么我们要利用这个功能以及如何做到这一点。

为什么要有应用程序的链接?

创建应用程序可以打开的URI,提供了一系列独特的好处。一个URL封装了网页的整个状态(在大量使用JavaScript的单页应用(SPA)出现之前,它曾经是这样的,即使在单页应用中,保持这一功能也是最好的做法)或一个网络应用,在应用中最好有路由,这样URL导航就不会中断。URL允许浏览器有一致的后退和前进按钮,以及重新加载和收藏页面。而像谷歌的搜索则依赖于网页地址和网络应用程序来引导用户到正确的地方。允许应用程序打开URL提供了一种方法,可以从其他应用程序、网站甚至是应用程序内部链接内容和功能,如帮助/教程页面。

琐事! 桌面应用程序甚至在万维网出现之前就有了超链接,如1987年Mac上的Hypercard和1990年的Windows帮助。网络中的超链接的革命性之处在于,你可以链接由他人创建并拥有的内容。这种跨应用链接的概念在传统平台上并不流行,直到智能手机的崛起。

通过命令行的应用程序链接

已经有一个用于命令行界面的外壳,它支持传递参数,将结果从一个应用程序重定向到另一个,甚至是脚本。尽管如此,由于各种原因,需要对超链接的支持是可取的。

  • 安全性。命令行脚本太复杂了,不可能做对。指望技术用户(不是开发人员)了解如何对命令行脚本进行消毒,并确保该脚本不会意外地调用某些东西,如rm -rf ~/Documents,是非常危险的。命令行不是沙盒式的,虽然它提供了一种力量,但它把责任放在了用户身上,很容易被利用。
  • 浏览器支持。浏览器不能提供命令行界面。它的建立是为了在沙盒中运行不受信任的第三方代码,这一点不能被打破。而且,如果我们不尊重网络技术的规则,应用程序会把自己孤立在互联网之外。这损失太大了。
  • 移动。在移动世界中,触摸键盘不如在桌面上使用的物理键盘那么好,那么直观。因此,即使有命令行,它也很难使用。所有的重定向和链式的力量都不像在基于键盘的命令行上那样有效。在这种情况下,像URL这样更简单的解决方案是更可取的。
  • 状态。理论上,命令行界面可以提供一种方法,使应用程序在任何状态下都可以使用。但是,实际上,它是为一个单独的目的而建立的:启动应用程序来执行一个任务,然后用一个代码返回。此外,它被Windows和Mac中的GUI去掉了优先级。许多应用程序(如Microsoft Word和Adobe Photoshop)从未有成熟的命令行支持。它们甚至不存在于环境PATH中,需要完整的路径才能启动。URIs提供了一种全新的方式来看待应用程序之间的信息以及功能的连接。它们是一种安全的、现代的应用程序之间的通信方式,用户不需要思考。

链接术语

深度链接

深度链接是一个概念,网站/应用程序中的一个特定页面/功能可以被链接到。例如,css-tricks.com/link/to/thi… 是更广泛的css-tricks.com 链接中的这个页面的深度链接。与打开应用程序的表面链接不同,深层链接是在特定的状态下打开应用程序,其中有通过的数据,准备被消费。自定义URI(如下所述)是在应用程序内实现深度链接的第一种方法,"深度链接 "在许多情况下现在是自定义URI的同义词,尽管它也可以指通用链接。

自定义URI

网络上总是有某些自定义URI链接到默认应用程序,如mailto:username@host.com 和tel:1234567890,分别代表电子邮件和电话。这是一个显而易见的选择,所有主要平台都提供了一种方法,让应用程序注册一个URI协议--比如css-tricks://<链接详情>--可以打开一个深度链接的本地应用程序。它应该封装整个状态,并提供所有的路由优势,以打开应用程序,如果它在系统上是可用的。当应用程序已经安装,并且希望打开用户首选的实现所需协议的应用程序(如浏览器或电子邮件客户端)时,这些为应用程序之间的通信提供了一个良好的接口。

自定义URI对于用户希望有一个选择来执行某种选择的一类应用是很好的,但由于以下原因,它们对于将网站链接到本地应用的任务不是很好。

  • 安装。与网页不同,本机应用程序需要安装,如果没有安装,你有两个选择:将用户发送到应用程序商店(也提供了一个自定义URI)或适当的回退。这两个任务都需要额外的代码,而URI并没有封装。应用商店的URI将是另一个独立的URI,我们需要存储。此外,我们必须检测应用程序是否安装,这需要导航到URI并处理导航中的错误,类似于404,因为协议没有注册。这并不像锚标签()那样简单,因此,这也是开发者经常抱怨的一个原因。
  • 缺少一个中央登记处。即使一切都做得非常正确,用户仍然可能被扔进一个他们不应该被链接到的应用程序。与DNS系统(保证域名的唯一性)不同,应用平台没有一个中央存储库。因此,多个应用程序可以将csstricks注册为一个自定义的URI。现在,其他人也可以将相同的URI注册为一个应用程序,如果其他应用程序被安装在系统上,而不是所需的应用程序,它就可以代替启动。自定义URI选择应用程序的自由度与我们总是想打开一个特定的应用程序的情况相反。
  • 第三方链接。由于我们上面提到的问题,给第三方提供一个自定义URI是很麻烦的,而且验证它们是很痛苦的。这也是一个新的协议。每个网站都有网络内容的链接,更新整个互联网的内容是不可能的。出于SEO的目的,甚至可能不希望这样做。

因此,如果我们想给用户提供应用程序是查看内容的首选方式的体验,自定义URI并不是完美的解决方案。这在某种程度上可以通过智能应用横幅来缓解,当浏览器获得自定义URI和应用商店链接来识别应用程序时,横幅就会显示出来。但这不会是无缝的。

小知识! URI和URL的定义略有不同,尽管它们可以互换使用。URI代表统一资源标识符,这意味着它封装了获得资源所需的一切。URL(统一资源定位器)是URI的一种特殊类型,用于识别网络上的资源。因此,从技术上讲,一个网络地址就是一个URL,但像csstricks://这样的东西就只是一个URI。

这些都是自定义URI可能有意义的使用情况。

  • 你需要提供一个许多第三方客户端应用程序可以注册的URI。假设你的应用中有一个git://,而用户最喜欢的git客户端可以注册这个URI,并在点击链接时克隆 repo。
  • 你没有一个功能齐全的网站。
  • 你需要一个让用户容易记住的URI。
  • 你愿意处理所有与导航有关的边缘情况。

你可以在使用自定义URI的同时,使用我们接下来要介绍的通用链接,他们可以从暴露自定义URL的应用间通信中获益,而将通用链接留给网络到应用的导航的特殊情况。Android官方称自定义URI为深度链接。

image.png

自定义URI、通用链接和即时应用程序的控制流程

通用链接、应用链接或应用URI

网络到应用的重定向问题可以通过通用链接(在Mac和iOS中称为通用链接)、应用链接(在Android中称为应用链接)或应用URI(在Windows UWP中称为应用URI)来解决,它们是同一概念的不同名称。这封装了每个网站需要编写的逻辑,以便检测已安装的应用程序,启动正确的页面,并在自定义URL的情况下处理导航失败。它与智能应用程序横幅非常相似,即你需要在你的网站上提供应用程序的应用商店链接以进行验证,但它消除了所有的冗余。由于现有的http(s)URL已经包含了整个状态,注册自定义URI是多余的。原始的URL本身就可以导航到应用程序,在应用程序没有安装的情况下,网站可以提供一个后备体验。

一旦你用通用链接注册了你的应用,当应用被安装时,操作系统就会去互联网上找出该应用支持的一组链接。每当这些链接被点击时,本地应用程序就会被启动,而不是浏览器。现在,应用程序中可以提供全面的地址支持,如果应用程序没有安装,可以提供更多的定制体验,并退回到浏览器。通用链接的一个重要区别是,它们确实会影响常规浏览,因此操作系统供应商将其严格锁定。

通用链接的几个好的使用案例包括。

  • 你有一个功能齐全的网站作为退路。
  • 用户希望从网站流向应用程序。
  • 你已经通过在网络上链接你的网站内容而建立了很多的因果关系。

即时链接或递延深层链接

如果用户在打开链接时继续安装应用程序,那么延迟的深度链接就提供了深度链接的缺失。用户可以被转发到应用商店,当应用安装后最终启动时,应用商店会负责维护上下文。这就在安装应用的情况下提供了连续性。目前这种方法只被安卓系统支持(如Google Play Instant),它是你想要求用户从应用中移动以获得所需功能的选项。网络上的超链接系统是无缝的,点击一个链接几乎可以立即到达目的地(尽管有很多事情发生在幕后)。延迟深层链接为应用程序提供了同样的功能,点击一个链接可以下载应用程序,并以正确的页面启动它,使应用程序安装上的所有任务尽可能地无缝。

你可以考虑使用即时链接,如果。

  • 你需要用户使用应用程序而不是网站,即使他们来自浏览器(除了极少数磁盘空间不足或为节省带宽而关闭此功能的情况)。
  • 你的关键页面在你的应用程序中总是最新的。
  • 好的,总是使用它们。由于谷歌为即时应用程序抛出了额外的SEO优势,没有理由不为拥有通用链接的应用程序启用"即时 "应用程序。

现在我们对每个术语的含义有了一个总结,让我们看看如何在具体平台上创建这些。

设置应用程序的超链接

MacOS和iOS

自定义URI

在MacOS和iOS中注册一个自定义URI是非常容易的。在Xcode中,进入项目的Info.plist文件,选择URL类型选项。在文件中创建一个类型为URL Schemes的项目,在这里你可以添加所有你想支持的URL方案。

注意:Xcode在URL Types中填写的默认URL Identifier是可选的。

image.png

Xcode中的URL方案

<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>css-tricks</string>
    </array>
  </dict>
</array>

对于MacOS,你将收到对AppDelegate的调用,在这里你可以覆盖该函数。

func application(_ application: NSApplication, open urls: [URL]) {
  // Select the first URL in the list of URL to open
  let url = urls[0]; 
  // Log the entire URL
  NSLog("%@", url.absoluteString)
}
-(void)application:(NSApplication *)application openURLs:(NSArray<NSURL *> *)urls {
  NSLog(@"%@", urls[0].absoluteString);
}

在iOS中,在AppDelegate中接收相同调用的函数是。

func application(_ app: UIApplication, open url: URL, options: [UIApplicationOpenURLOptionsKey : Any] = [:]) -> Bool {
  NSLog("%@", url.absoluteString)
  return true
}
-(BOOL)application:(UIApplication *)app openURL:(NSURL *)url options: (NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
  NSLog(@"%@", url.absoluteString);
  return true;
}

在所有这些情况下,URL类型包含通常的URL部分,如路径、查询和搜索参数。

通用链接

在MacOS中不支持通用链接。要在iOS上获得通用链接,你需要在苹果开发者计划中注册,或者成为苹果开发者企业计划成员。iOS上的通用链接是更广泛的关联域概念的一部分,其中网站的秘密,如存储的凭证,可以从应用程序中访问,苹果不允许普通的Xcode用户涉足通用链接(如果你不小心为你的App ID启用功能,但没有把这个放在权利中,准备得到一个验证错误。ERROR ITMS-90046: "无效的代码签名授权")。)

小知识! 通用链接是一个新的概念,许多Mac和Windows桌面应用程序是用自己的网络堆栈构建的,不使用应用程序商店,而且可能是几年前发布的。因此,操作系统不具备强制所有应用程序遵循通用链接概念并打开应用程序所需的控制能力。苹果选择在MacOS中还没有实施通用链接,而在Windows中,它们只在微软Edge浏览器和其他UWP应用程序(使用相同的技术)中工作。

要在iOS上注册通用链接,你需要做以下事情。

  1. 在苹果开发者网站上启用App ID,以获得关联域的功能。
  2. 将关联域添加到权利文件中。
  3. 将apple-app-site-association文件添加到网域,为应用程序提供所有权验证。
  4. 添加代码以处理对通用链接的点击。

步骤1和2可以在Xcode的Capabilities选项卡中一起执行,如果你已经登录并选择了正确的配置文件(这是来自苹果开发者或企业账户)。Xcode UI提供了一个指示,表明这两个项目已经完成。

image.png

Xcode中Capabilities部分的相关域

在上面的图片中,步骤2已经成功完成,而步骤1还在等待。你可以点击感叹号来找到这个问题。重要的是在域名前加上applinks。(这表明你需要应用链接功能;共享凭证也是如此)。这表明应用链接功能已被启用。

上述步骤也可以单独完成。

对于步骤1,在开发者网站上的App ID部分启用关联域(如图片底部所示)。

image.png

苹果开发者网站启用关联域

对于步骤2,将以下内容添加到entitlements文件中。

image.png

Entitlements plist

<key>com.apple.developer.associated-domains</key>
<array>
  <string>applinks:css-tricks.com</string>
</array>

现在,对于第3步,从你的网站根部托管一个关联文件apple-app-site-association,如css-tricks.com/apple-app-s… ,mime类型为application/json,包含以下JSON数据。

{
  "applinks": {
    "apps": [],
    "details": {
      "ABCDEFGHIJ.com.ccs-tricks.mobile": {
        "paths": [
          "*"
        ]
      }
    }
  }
}

上述片段授予ID为ABCDEFGHIJ.com.ccs-tricks.mobile的应用程序,并提供对css-tricks.com 域上所有请求的访问。请注意,这适用于https,但不支持http。你也可以为此使用一个替代位置,如css-tricks.com/.well-known…

小知识! 通用链接并不保证应用被打开。如果用户在iOS中从标题回到网站,操作系统决定从此默认网站,直到用户决定从Safari中再次点击标题来使用应用程序。

对于步骤4,在应用程序中添加以下代码。

func application(_ application: UIApplication, continue userActivity: NSUserActivity, restorationHandler: @escaping ([Any]?) -> Void) -> Bool {
  if userActivity.activityType == NSUserActivityTypeBrowsingWeb {
    let url = userActivity.webpageURL!
    print(url.absoluteString)
  }
  return true
}
-(BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray * _Nullable))restorationHandler {
  if(userActivity.activityType == NSUserActivityTypeBrowsingWeb) {
    NSLog(@"%@", userActivity.webpageURL.absoluteString);
  }
  return true;
}

iOS上的智能应用横幅要简单得多,可以通过head部分的一个简单的meta HTML标签来添加,比如这样。

<meta name="apple-itunes-app" content="app-id=123456789, app-argument=https://css-tricks.com/linkto/this/article, affiliate-data=optionalAffiliateData">

它们调用的方法与我们前面讲到的自定义URI相同。

Windows (传统)

在传统的Windows平台上(Win32/.NET),自定义URI(称为自定义可插拔协议处理程序)是唯一支持的功能。在Windows中添加自定义URI需要在HKEY_CLASSES_ROOT中添加一个注册表项。下面的内容将在点击css-tricks://<text>的链接时以给出的绝对路径打开应用程序。由于使用命令行,这总是打开一个新的应用程序的实例,而不是将URL发送到现有的运行中的应用程序。

image.png

提供应用程序名称的注册表条目

image.png

打开命令的注册表条目

Windows Registry Editor Version 5.00

[HKEY_CLASSES_ROOT\css-tricks]
"URL Protocol"=""
@="CSS Tricks (Application name)"

[HKEY_CLASSES_ROOT\css-tricks\shell]

[HKEY_CLASSES_ROOT\css-tricks\shell\open]

[HKEY_CLASSES_ROOT\css-tricks\shell\open\command]
@=""C:\\Windows\\notepad.exe" "%1""

以上启动记事本,其命令行参数与所提供的URL相对应。请注意,记事本不支持自定义URI,不知道该如何处理这个URL。

这种行为类似于在控制台中传递,应用程序需要确保正确区分参数是普通CLI还是自定义URI,如图所示。

namespace ConsoleApplication1 {
  class Program {
    static void Main(string[] args) {
      if (args.Length > 0 && args[0].IndexOf("css-tricks:") == 0) {
        Console.Write(args[0]);
      }
    }
  }
}
int main(int argc, char*argv[]) {
  if (argc > 1) { // argv[0] is the file name.
    std::string word(argv[1]);
    if (word.compare(0, 11, "css-tricks:") == 0) {
      std::cout<<word;
    }
  }
  return 0;
}

通用Windows平台(UWP)

在通用Windows平台上,你可以使用包清单来注册自定义URI和通用链接(称为App URI处理程序)。

自定义URI

在package.appxmanifest中添加一个协议声明。

image.png

package.appxmanifest 中的协议声明

同样可以在代码中实现。

<Extensions>
  <uap:Extension Category="windows.protocol">
    <uap:Protocol Name="css-tricks" DesiredView="default">
      <uap:DisplayName>CSS Tricks</uap:DisplayName>
    </uap:Protocol>
  </uap:Extension>
</Extensions>

...现在可以在应用程序中处理这个问题。

protected override void OnActivated(IActivatedEventArgs args) {
  base.OnActivated(args);
  if (args.Kind == ActivationKind.Protocol) {
    var e = args as ProtocolActivatedEventArgs;
    System.Diagnostics.Debug.WriteLine(e.Uri.AbsoluteUri);
  }
}
// In App.xaml.h
virtual void OnActivated(Windows::ApplicationModel::Activation::IActivatedEventArgs^ e) override;

// In App.xaml.cpp
void App::OnActivated(Windows::ApplicationModel::Activation::IActivatedEventArgs ^ e) {
  if (e->Kind == Windows::ApplicationModel::Activation::ActivationKind::Protocol) {
    auto args = (ProtocolActivatedEventArgs^)e;
    auto url = args->Uri->AbsoluteUri;
  }
}

通用链接 (App URI)

App URIs仅在Microsoft Edge浏览器中支持。它们在Internet Explorer、Chrome或Firefox中不起作用。App URI也有一个类似于自定义URI的包条目。它在Visual Studio Code 2017的UI中不可用。package.appxmanifest条目几乎是一样的。

<Extensions>
  <uap3:Extension Category="windows.appUriHandler">
    <uap3:AppUriHandler>
      <uap3:Host Name="css-tricks.com" />
    </uap3:AppUriHandler>
  </uap3:Extension>
</Extensions>

如果uap3不可用,它可以被添加到也定义了uap的Package标签中。

xmlns:uap3="http://schemas.microsoft.com/appx/manifest/uap/windows10/3"

App URI是Windows的一个相对较新的功能,许多UWP项目将旧版本的windows作为最低版本。你可能需要提高这个版本,以支持这个功能。

就像iOS一样,网站需要验证域名的所有权才能发挥作用。这可以通过在你的网站根部托管一个mime类型为application/json的文件来完成,如css-tricks.com/windows-app…css-tricks.com/.well-known… over https,内容为。

{
  "packageFamilyName": "YourPackageFamilyNameHere",
  "paths": ["*"],
  "excludePaths": ["/none/*", "/robot.txt"]
}

要获得软件包家族名称,请在Powershell中运行以下程序并搜索你的软件包路径。

Get-AppxPackage

处理App URIs需要与Windows上的自定义URI相同的代码。根据设计,你所需要做的就是看到所提供的URI中的协议字段,并编写相应的逻辑。

就像iOS一样,Windows用户可以选择禁用打开应用程序。Windows提供了注册表设置来强制打开应用程序(用于测试),也提供了一个验证器工具(位于%windir%\system32\AppHostRegistrationVerifier.exe)来验证上述设置是否正确。

Android

自定义URI

Android从一开始就支持自定义URI。这可以通过代码来完成。在AndroidManifest.xml中添加。

<activity android:name=".CustomUriActivity">
  <intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="css-tricks" />
  </intent-filter>
</activity>

类别DEFAULT是为了确保不需要用户操作来启用它。BROWSABLE确保自定义URI在浏览器中工作。

然后可以在创建时在CustomUriActivity.java中处理。

public class CustomUriActivity extends AppCompatActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Intent intent = getIntent();
    if (Intent.ACTION_VIEW.equals(intent.getAction())) {
      Uri uri = intent.getData();
    }
  }
} 

通用链接

Android中的通用链接与App URI非常相似。Android Studio提供了一个GUI工具来创建它。转到工具>应用链接助手。这将提供创建应用链接所需的三个任务。

image.png

安卓中的应用链接助手

对于步骤1,进入URL映射编辑器,点击+按钮,打开URL映射对话框。

image.png

URL映射对话框

一旦你点击确定,它将显示在AndroidManifest.xml中可以替代使用的代码。

<activity android:name=".CustomUriActivity">
  <intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="http" android:host="css-tricks.com"/>
  </intent-filter>
</activity>

注意:这与自定义URI的情况完全相同。在步骤2中,选择你指定的活动,它将添加代码来加载动作。该代码也与上面用于自定义URI的代码完全相同。

在第3步,它将生成JSON文件,需要以application/json mime的形式添加到网站上,网址是css-tricks.com/.well-known…

[{
  "relation": ["delegate_permission/common.handle_all_urls"],
  "target": {
    "namespace": "css_tricks",
    "package_name": "com.css-tricks.android",
    "sha256_cert_fingerprints":
    ["17:CC:87:9C:C8:39:B1:89:48:E8:2E:9E:6F:FC:7D:03:69:4D:05:90:2A:84:B8:AE:5D:6B:30:97:F8:1C:2B:BF"]
  }
}]

Android Studio自动生成了验证应用程序身份的指纹。这个身份对于应用程序的调试版本和发布版本是不同的。

即时链接

安卓上的即时应用程序需要对我们之前涉及的App链接做一些小改动。要启用即时应用程序,请修改上面声明的意图,使其看起来像这样。

<activity android:name=".CustomUriActivity">
  <intent-filter android:autoVerify="true">
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="http" android:host="css-tricks.com"/>
    <data android:scheme="https"/>
  </intent-filter>
</activity>

这允许http和https URL与应用程序相关联,而autoVerify告诉Android(Google Play)商店自动验证清单项目。即时应用程序是Play商店/谷歌浏览器的一项功能。为了支持这个功能,应用程序上的变化是最小的。

Electron

Electron应用程序是传统的MacOS和Windows应用程序,采用chromium运行时间。这些平台只支持自定义URI,可以在不触及编译代码的情况下启用。

对于MacOS,按照MacOS部分的描述编辑info.plist。应用程序对象接收事件的方式为。

// In main.js
require('electron').app.on('open-url', (event, url) => {
  console.log(url);
});

对于Windows,添加Windows部分定义的注册表项。应用程序将收到process.argv中的自定义URL。

// In main.js
console.log(process.argv[2])

在electron中,你可以加载可以打开URL的外部网页。如果希望只在内部处理这些URL,那可以通过electron的API注册。

require('electron').protocol.registerHttpProtocol('css-tricks', (req, cb) => {
  console.log(req.url)
});

Web

绕了一个大圈子,网站也可以注册自定义URI(比如通过网站处理mailto: 链接)。请注意,这些只影响其他网站中提供的链接,与其他应用程序中的链接没有关系。该API的限制性很强,只能用于选定的链接类型:web+<此处插入任何内容>。浏览器允许预先定义的顶级协议列表进行注册。

  • Chrome: mailto, mms, nntp, rtsp, webcal
  • 火狐:bitcoin、geo、im、irc、iris、magnet、mailto、ms、news、sip、sms、smite、ssh、tel、urn、webcal、wti、xmpp

要注册一个协议,你需要提供与注册该协议的网站相同的域名(即css-tricks.com ,只能注册css-tricks.com,不能注册https://css-tricks… )。

if (navigator.registerProtocolHandler) {
  navigator.registerProtocolHandler("web+csstricks", "https://css-ticks.com/?s=%s", "CSS Tricks custom URI");
}

自定义URI不被搜索引擎收录,因此,除了处理像mailto、webcal等已经在网络上多处出现的链接外,这些URI并没有什么用。

总结

为本地应用程序添加超链接是一种简单而有效的方式,可以在应用程序未安装的情况下,以优雅的方式让用户在不同的应用程序之间无缝移动。有了这些链接,应用程序可以在互联网上提供路径,这可以成为一种有效的推广机制。链接还为网站提供了一种提供数据的方式,并在一个特定的页面上启动应用程序,而没有困扰可下载文件或命令行脚本的安全顾虑,允许有效的教程和错误报告。路由和URL提供了万维网的核心功能,如导航、返回按钮、书签和搜索。应用程序中的超链接将这些从(几乎)30年的万维网中学到的东西带到了本地应用程序中。


www.deepl.com 翻译