• BOM系列之Navigator对象


    目录


    1、Navigator是什么

    navigator 对象包含有关浏览器的信息,它有很多属性,我们最常用的是 userAgent,该属性可以返回由客户机发送服务器的 user-agent 头部的值。

    2、属性

    2.1、buildID

    2.1.1、概述

    返回所使用浏览器的构建标识符。现代浏览器中,这个属性返回一个固定的时间戳作为私有的计量方法,比如 Firefox 64 及以后的版本返回 20181001000000。

    2.1.2、语法

    buildID = navigator.buildID;
    
    • 1

    2.1.3、返回值

    一个字符串,用来表示当前应用的构建标识。构建 ID 的格式为:YYYYMMDDHHMMSS。

    2.2、clipboard

    2.2.1、概述

    剪贴板 Clipboard API 为 Navigator 接口添加了只读属性 clipboard,该属性返回一个可以读写剪切板内容的 Clipboard 对象。 在 Web 应用中,剪切板 API 可用于实现剪切、复制、粘贴的功能。

    只有在用户事先授予网站或应用对剪切板的访问许可之后,才能使用异步剪切板读写方法。许可操作必须通过取得权限 Permissions API 的 “clipboard-read” 和/或 “clipboard-write” 项获得。

    2.2.2、语法

    theClipboard = navigator.clipboard;
    
    • 1

    2.2.3、返回值

    用于访问系统剪切板的 Clipboard 对象。

    2.3、contacts

    2.3.1、概述

    Navigator 的contacts只读属性返回 ContactsManager,它允许用户从他们的contact列表中选择条目,并与网站和应用程序共享所选条目的有限详细信息。

    2.3.2、返回值

    一个ContactsManager对象。两个连续的调用返回相同的对象。

    2.4、cookieEnabled

    2.4.1、概述

    navigator.cookieEnabled 返回一个布尔值,来表示当前页面是否启用了 cookie。本属性为只读属性。

    2.4.2、语法

    let cookieEnabled = navigator.cookieEnabled;
    
    • 1

    2.4.3、返回值

    cookieEnabled 是个布尔值: true 或 false。

    2.5、geolocation

    2.5.1、概述

    Navigator.geolocation 只读属性返回一个 Geolocation 对象,通过这个对象可以访问到设备的位置信息。使网站或应用可以根据用户的位置提供个性化结果。

    2.5.2、语法

    geo = navigator.geolocation
    
    • 1

    2.6、hardwareConcurrency

    2.6.1、概述

    navigator.hardwareConcurrency只读属性返回计算机上可运行的逻辑处理器数。

    2.6.2、返回值

    一个介于1和用户代理可能可用的逻辑处理器数量之间的数字。

    2.7、language

    2.7.1、概述

    Navigator.language 为只读属性,返回一个表示用户偏好语言(通常是浏览器界面语言)的字符串。

    2.7.2、语法

    const lang = navigator.language
    
    • 1

    2.7.3、返回值

    一个 DOMString。lang存储了一个在 BCP 47 中定义的语言版本。一些有效的语言版本代码示例包括: “en”、“en-US”、“fr”、“fr-FR”、“es-ES” 等。

    请注意,在 iOS 10.2 之前的 Safari 中,返回的语言版本代码是小写的: “en-us”、“fr-fr” 等。

    2.8、maxTouchPoints

    2.8.1、概述

    返回当前设备能够支持的最大同时触摸的点数。

    2.8.2、语法

    touchPoints = navigator.maxTouchPoints;
    
    • 1

    2.9、mediaDevices

    2.9.1、概述

    mediaDevices 是 Navigator 只读属性,返回一个 MediaDevices 对象,该对象可提供对相机和麦克风等媒体输入设备的连接访问,也包括屏幕共享。

    2.9.2、语法

    var mediaDevices = navigator.mediaDevices;
    
    • 1

    2.9.3、返回值

    MediaDevices 是一个单例对象。通常,您只需直接使用此对象的成员,例如通过调用navigator.mediaDevices.getUserMedia()。

    2.10、mediaSession

    2.10.1、概述

    只读Navigator属性mediaSession返回一个mediaSession对象,该对象可用于与浏览器共享元数据以及文档正在处理的媒体当前播放状态的其他信息。

    该信息反过来可以与设备和/或操作系统共享,以使设备的标准媒体控制用户体验描述和控制媒体的回放。

    此外,MediaSession接口提供了setActionHandler()方法,该方法允许您在用户使用设备控件时接收事件,比如屏幕上或物理上的播放、暂停、查找和其他类似的控件。例如,一个互联网电台应用程序,可以使用setActionHandler()来让键盘上或用户设备上的其他地方的媒体控制被用来控制应用程序的媒体播放。

    2.10.2、返回值

    当前文档可以使用一个MediaSession对象来共享它正在播放的媒体及其当前播放状态的信息。这些信息可以包括典型的元数据,如正在播放的歌曲的标题、艺术家和专辑名,以及可能包含专辑封面、艺术家照片等内容的一个或多个图像。

    2.11、onLine

    2.11.1、概述

    返回浏览器的在线状态。该属性返回一个布尔值,true表示在线,false表示离线。每当浏览器连接网络的能力发生变化时,该属性就发送更新。当用户跟踪链接或脚本请求远程页面时,就会发生更新。例如,当用户在失去互联网连接后不久点击链接时,该属性应该返回false。

    浏览器实现此属性的方式不同。

    在Chrome和Safari中,如果浏览器不能连接到局域网(LAN)或路由器,它就是离线的;所有其他条件返回true。因此,当它返回一个假值时,您可以假设浏览器是离线的,但您不能假设一个真值一定意味着浏览器可以访问internet。您可能会得到误报,例如在计算机运行一个虚拟化软件的情况下,该软件具有始终“连接”的虚拟以太网适配器。因此,如果您真的想确定浏览器的在线状态,那么应该开发其他检查方法。

    在Firefox和Internet Explorer浏览器中,将浏览器切换到脱机模式会发送一个false值。在Firefox 41之前,所有其他条件都返回一个真值;在Windows上对Nightly 68的实际行为测试表明,它只会像Chrome和Safari一样寻找局域网连接,从而给出误报。

    您可以通过监听在线online和offline事件来查看网络状态的变化

    2.11.2、返回值

    一个boolean值

    2.12、pdfViewerEnabled

    2.12.1、概述

    Navigator的pdfViewerEnabled属性指示浏览器在导航到PDF文件时是否支持内联显示。

    如果不支持内联查看,则下载PDF,然后可能由一些外部应用程序处理。

    2.12.2、返回值

    如果浏览器可以在导航到文件时内联显示PDF文件(使用内部查看器或PDF查看器扩展名),则为true;否则为false。

    2.13、platform

    2.13.1、概述

    Navigator接口的platform只读属性返回一个字符串,标识用户浏览器运行的平台。

    2.13.2、返回值

    一个字符串,标识用户浏览器运行的平台:例如:“MacIntel”, “Win32”, “Linux x86_64”, “Linux x86_64”。

    2.14、serial

    2.14.1、概述

    Navigator接口的serial只读属性返回一个serial对象,该对象表示Web serial API的入口点。

    获取时,将始终返回Serial对象的相同实例。

    2.14.2、返回值

    一个serial对象

    2.15、serviceWorker

    2.15.1、概述

    Navigator.serviceWorker 只读属性,返回 关联文件 的 ServiceWorkerContainer 对象,它提供对ServiceWorker 的注册,删除,升级和通信的访问。

    2.15.2、语法

    let workerContainerInstance = navigator.serviceWorker;
    
    • 1

    2.15.3、返回值

    ServiceWorkerContainer

    2.16、storage

    2.16.1、概述

    Navigator.storage 只读属性返回一个单独的StorageManager对象,该对象用于访问当前站点或应用程序的整体存储能力。返回的对象允许您检查和配置数据存储的持久性,并了解您的浏览器大约还有多少空间可供本地存储使用。

    2.16.2、返回值

    一个StorageManager对象,您可以使用它来维护存储数据的持久性,以及大致确定有多少空间可供存储数据。

    2.17、userAgent

    2.17.1、概述

    Navigator.userAgent只读属性返回当前浏览器的用户代理字符串。

    基于检测用户代理字符串的浏览器识别是不可靠的,不建议使用,因为用户代理字符串是用户可配置的。例如:

    • 在Firefox中,你可以在about:config中更改首选项general.useragent.override。一些Firefox扩展可以做到这一点;但是,这只改变了navigator.userAgent返回的HTTP头。可能还有其他方法利用JavaScript代码来标识浏览器。
    • Opera 6+允许用户通过菜单设置浏览器标识字符串。
    • Microsoft Internet Explorer使用Windows注册表。
    • Safari和iCab允许用户通过菜单将浏览器用户代理字符串更改为预定义的Internet Explorer或Netscape字符串。

    2.17.2、返回值

    指定浏览器在HTTP报头中提供的完整用户代理字符串,并在响应Navigator对象上的此方法和其他相关方法时提供此字符串。

    用户代理字符串建立在一个正式的结构上,该结构可以分解为几个信息片段。这些信息的每一部分都来自其他导航器属性,这些属性也可以由用户设置。基于gecko的浏览器遵循以下通用结构:

    userAgent = appCodeName/appVersion number (Platform; Security; OS-or-CPU;
    Localization; rv: revision-version-number) product/productSub
    Application-Name Application-Name-version
    
    • 1
    • 2
    • 3

    2.18、userAgentData

    2.18.1、概述

    Navigator的userAgentData只读属性返回一个NavigatorUAData对象,该对象可用于访问User-Agent客户端提示API。

    2.18.2、返回值

    一个NavigatorUAData对象

    2.19、vendor

    2.19.1、概述

    返回当前所使用浏览器的浏览器供应商的名称。

    2.19.2、语法

    venString = window.navigator.vendor
    
    • 1

    2.19.3、返回值

    venString 浏览器供应商。

    2.20、vendorSub

    2.20.1、概述

    vendorSub navigator.vendor 的值的一部分,表示浏览器供应商的版本号。

    2.20.2、语法

    venSub = window.navigator.vendorSub
    
    • 1

    2.20.3、返回值

    venSub是个字符串。

    2.21、windowControlsOverlay

    2.21.1、概述

    Navigator 的windowControlsOverlay属性返回windowControlsOverlay界面,它在使用窗口控件叠加API的桌面渐进式Web应用程序中暴露标题栏几何形状的信息。

    安装在桌面操作系统上的渐进式Web应用程序可以通过使用display_override Web应用程序manifest成员中的Window - Controls - Overlay值来选择窗口控制叠加特性。

    这样做会隐藏默认的窗口标题栏,并让应用程序访问应用程序窗口的整个区域。

    2.21.2、返回值

    windowControlsOverlay

    2.22、xr

    2.22.1、概述

    Navigator提供的只读xr属性返回一个XRSystem对象,该对象可用于访问WebXR设备API。

    2.22.2、返回值

    XRSystem对象,用于在当前上下文中与WebXR设备API进行接口。这可以用于向用户呈现增强和/或虚拟现实图像。

    3、方法

    3.1、clearAppBadge()

    3.1.1、概述

    Navigator的clearAppBadge()方法通过将当前应用程序图标上的标识设置为空来清除标识。取值为“nothing”表示当前未设置任何标识,标识状态为清除。

    3.1.2、语法

    clearAppBadge()
    
    • 1

    3.1.3、返回值

    用undefined来解析的Promise。

    3.1.4、异常

    • NotSupportedError

    DOMException
    如果Navigator没有可执行此操作的文档,则抛出。

    3.2、getBattery()

    3.2.1、概述

    getBattery() 方法提供了系统的电量信息,返回一个 battery 的 promise 对象,然后 resolve 后得到BatteryManager对象,它提供了一些新的事件,以及方法供您监控电池的状态。这个方法实现了 Battery Status API(查看更多细节以及使用方法和实例代码)

    3.2.2、语法

    navigator.getBattery().then(funcRef);
    
    • 1

    funcRef 是navigator.getBattery 返回的 battery promise 对象被 resolve 后执行的函数,即回调函数。

    3.3、javaEnabled()

    3.3.1、概述

    这个方法总是返回false。

    3.3.2、语法

    javaEnabled()
    
    • 1

    3.3.3、返回值

    布尔值false。

    3.4、msLaunchUri()

    3.4.1、概述

    msLaunchUri()方法是Navigator接口的微软扩展,它启动处理给定协议的服务或应用程序,如电子邮件客户端。统一资源标识符(URI)包含默认服务或应用的协议,例如mailto://test@contoso.com

    这种专有方法只适用于Internet Explorer和Microsoft Edge 18及更低版本。

    3.4.2、语法

    msLaunchUri(uri)
    msLaunchUri(uri, successCallback)
    msLaunchUri(uri, successCallback, noHandlerCallback)
    
    • 1
    • 2
    • 3

    3.4.3、参数

    • uri
      指定URL的字符串,其中包含要显示的文档或资源的协议。
    • successCallback
      可选
      一个匹配MSLaunchUriCallback签名的函数,如果协议处理程序存在,将执行该函数。
    • noHandlerCallback
      可选
      如果协议处理程序不存在,将执行与MSLaunchUriCallback匹配的函数。

    3.4.4、返回值

    None (undefined)

    3.5、registerProtocolHandler()

    3.5.1、概述

    Navigator 的方法 registerProtocolHandler() 让 web 站点为自身注册用于打开或处理特定 URL 方案(又名协议)的能力。

    3.5.2、语法

    navigator.registerProtocolHandler(scheme, url, title);
    
    • 1

    3.5.3、返回值

    • scheme
      一个包含站点希望处理的协议的字符串。例如,你可以通过传入 “sms” 来注册处理 SMS 文本信息链接。

    • url
      处理器的 URL,string 类型。这个字符串应该包含一个"%s"的占位符,其会被将要受理的文档的 escaped 链接所替换。这个链接(译者按:指将要受理的文档的 escaped 链接,也就是替换占位符的字符串)可能是一个真实的 URL,或者是一个电话号码,邮件地址之类的。

    • title
      过时的
      一个用户可理解的处理器标题。标题会展示给用户,例如弹出对话框“允许这个站点处理 [scheme] 链接吗?”或者在浏览器设置中列出注册的处理器时。

    3.5.4、异常

    指定了一个非法的协议标记,例如一个浏览器自身的标记(https:, about: 等)。
    处理器 URL 的 origin 与调用这个 API 的页面的 origin 不匹配。
    浏览器要求这个函数由安全的上下文调用。
    浏览器要求处理器的 URL 使用 HTTPS 协议。

    • SecurityError

    用户代理阻止了处理器的注册。这可能是由于:

    • SyntaxError

    在指定的协议处理地址的字符串中缺失了 %s 占位符。

    3.5.5、允许的协议标记

    出于安全考虑,registerProtocolHandler() 严格限制了允许注册的协议标记。以 web+ 作为前缀的方式可以注册一个自定义的标记协议,至少要有 5 个字符的长度 (包括 web+ 前缀),而且只能使用小写的 ASCII 字母作为名称。例如 web+burger ,如下面的示例所示。

    除此之外,还可以使用下文所列的白名单中的协议标记:

    • bitcoin
    • geo
    • im
    • irc
    • ircs
    • magnet
    • mailto
    • mms
    • news
    • nntp
    • openpgp4fpr
    • sip
    • sms
    • smsto
    • ssh
    • tel
    • urn
    • webcal
    • wtai
    • xmpp

    3.6、requestMediaKeySystemAccess()

    3.6.1、概述

    requestmediakeysystemaccess()方法返回一个Promise,该Promise提供一个MediaKeySystemAccess对象,该对象可用于访问特定的媒体密钥系统,该对象又可用于创建用于解密媒体流的密钥。这种方法是加密媒体扩展API的一部分,它为web带来了对加密媒体和drm保护视频的支持。

    此方法可能具有用户可见的效果,例如请求访问一个或多个系统资源的权限。在决定何时调用requestMediaKeySystemAccess()时考虑这一点;您不希望这些请求发生在不方便的时间。作为一般规则,只有在需要通过调用返回的MediaKeySystemAccess对象的createMediaKeys()方法来创建和使用mediakeys对象时,才应该调用此函数。

    3.6.2、语法

    requestMediaKeySystemAccess(keySystem, supportedConfigurations)
    
    • 1

    3.6.3、参数

    • keySystem
      标识密钥系统的字符串。例如com.example.somesystem或org.w3.clearkey。
    • supportedConfigurations
      一个符合MediaKeySystemAccess.getConfiguration返回的对象的非空数组。将使用具有满意配置的第一个元素。

    3.6.4、返回值

    Promise,在解析时,将MediaKeySystemAccess对象交付给您的履行处理程序函数。fulfillment处理程序只接收一个参数作为输入:

    • mediaKeySystemAccess
      一个MediaKeySystemAccess对象,表示由keySystem和supportedConfigurations描述的媒体密钥系统配置

    3.6.5、异常

    如果发生错误,返回的Promise将被拒绝,并包含一个DOMException,它的名称表示发生了何种错误。

    • NotSupportedError DOMException
      平台或浏览器不支持指定的keySystem,或者不满足supportedConfigurations指定的配置(例如,如果contentType中指定的编解码器都不可用)。

    • TypeError
      keySystem是一个空字符串,或者supportedConfigurations数组是空的。

    3.7、requestMIDIAccess()

    3.7.1、概述

    Navigator的requestmidaccess()方法返回一个Promise,表示访问用户系统上MIDI设备的请求。该方法是Web MIDI API的一部分,它提供了一种访问、枚举和操作MIDI设备的方法。

    这种方法可能提示用户访问其系统可用的MIDI设备,或者它可能使用先前建立的偏好来授予或拒绝访问。如果授予了权限,则Promise解析并返回一个midaccess对象。

    3.7.2、语法

    requestMIDIAccess()
    requestMIDIAccess(MIDIOptions)
    
    • 1
    • 2

    3.7.3、参数

    • MIDIOptions
      可选
      一个对象,表示要传递给方法的选项。这些选项有:
      • sysex
        一个布尔值,如果设置为true,则允许发送和接收系统独占(sysex)消息。默认值为false。
      • software
        一个布尔值,如果设置为true,则允许系统使用任何安装的软件合成器。默认值为false。

    3.7.4、返回值

    使用midaccess对象解析的Promise。

    3.7.5、异常

    • AbortError DOMException
      如果文档或页面因用户导航而关闭。
    • InvalidStateError DOMException
      如果底层系统引发任何错误。
    • NotSupportedError DOMException
      系统不支持的特性或选项。
    • SecurityError DOMException
      如果用户或系统拒绝应用程序创建带有请求选项的midaccess对象,或者文档不允许使用该特性(例如,iframe没有正确的Permission Policy,或者用户之前拒绝了对该特性的权限访问)。

    3.8、sendBeacon()

    3.8.1、概述

    navigator.sendBeacon() 方法可用于通过 HTTP POST 将少量数据 异步 传输到 Web 服务器。

    它主要用于将统计数据发送到 Web 服务器,同时避免了用传统技术(如:XMLHttpRequest)发送分析数据的一些问题。

    3.8.2、语法

    navigator.sendBeacon(url);
    navigator.sendBeacon(url, data);
    
    • 1
    • 2

    3.8.3、参数

    • url
      url 参数表明 data 将要被发送到的网络地址。

    • data 可选
      data 参数是将要发送的 ArrayBuffer、ArrayBufferView、Blob、DOMString、FormData 或 URLSearchParams 类型的数据。

    3.8.4、返回值

    当用户代理成功把数据加入传输队列时,sendBeacon() 方法将会返回 true,否则返回 false。

    3.9、setAppBadge()

    3.9.1、概述

    Navigator的setAppBadge()方法在与此应用程序相关联的图标上设置徽章。如果向该方法传递一个值,则将其设置为徽章的值。否则,徽章将显示为一个点,或平台定义的其他指示器。

    3.9.2、语法

    setAppBadge()
    setAppBadge(contents)
    
    • 1
    • 2

    3.9.3、参数

    • contents 可选
      一个将被用作徽章值的数字。如果内容为0,则徽章将设置为零,表示清除了徽章。

    3.9.4、返回值

    用undefined来解析的Promise。

    3.9.5、异常

    • NotSupportedError DOMException
      Navigator没有可执行此操作的文档。

    3.10、vibrate()

    3.10.1、概述

    Navigator.vibrate() 方法使设备(有震动硬件)产生有频率的震动。若设备不支持震动,该方法将无效。若某震动方式已经在进行中(当该方法调用时),则前一个震动方式停止,新的取而代之。

    该方法若因为提供无效的参数使得无法使设备震动,它将返回 false,否则返回 true。若振动方案导致长时间的震动,它会被截断:最大震动时长取决于每个浏览器的具体实现。

    3.10.2、语法

    var successBool = window.navigator.vibrate(pattern);
    
    • 1

    3.10.3、参数

    • pattern

    提供一个震动、暂停间隔的模式。每一个值表示交替震动或者暂停的毫秒数。你可以提供一个单个的值(震动一次的毫秒数)或者一个包含整数的数组来交替的震动、暂停、震动。
    传递一个 0、一个空数组或者一个元素全部为 0 的数组会结束当前正在运行中的震动模式。

    4、下面前端代码可以判断用户那个终端打开页面,实现跳转

    if (navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)) {
    	window.location.href = ""; //手机
    } else {
    	window.location.href = ""; //电脑
    }
    
    • 1
    • 2
    • 3
    • 4
    • 5

    后记

    如果你感觉文章不咋地//(ㄒoㄒ)//,就在评论处留言,作者继续改进;o_O???
    如果你觉得该文章有一点点用处,可以给作者点个赞;\\*^o^*//
    如果你想要和作者一起进步,可以微信扫描二维码,关注前端老L~~~///(^v^)\\\~~~
    谢谢各位读者们啦(^_^)∠※!!!

    在这里插入图片描述

  • 相关阅读:
    1990-2021年全国各省外商直接投资水平
    代码随想录算法训练营第四十六天 | 518. 零钱兑换 II、377. 组合总和 Ⅳ
    集群配置步骤_java培训
    2023中国(深圳)国际激光及焊接展览会
    毫秒级!千万人脸库快速比对,上亿商品图片检索,背后的极速检索用了什么神器?
    python打包exe含有subprocess时无效的解决方法
    三步写出一篇思路清晰的技术文章
    A7.2022年全国数学建模竞赛A题-波浪能最大输出功率设计-赛题分析与讨论
    【Matlab 六自由度机器人】Fixed Angles(固定角度) 和 Euler Angles(欧拉角) 之间的区别
    文心一言 VS 讯飞星火 VS chatgpt (102)-- 算法导论9.3 8题
  • 原文地址:https://blog.csdn.net/weixin_62277266/article/details/126064851