前端如何实现一个网站的桌面快捷方式-Toy模板网

这篇具有很好参考价值的文章主要介绍了前端如何实现一个网站的桌面快捷方式。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

题记：我们工作中常常需要在我们的网站首页实现一个桌面快捷方式，那么我们怎么做呢？

图片展示：

前端如何实现一个网站的桌面快捷方式,element-ui,不常用功能,前端,javascript,开发语言

代码实现：

第一步：获取路径与标题名；

sName: document.title,
sUrl: window.location.href

第二步：判断是否为IE浏览器；

    isIE() {
      if (!!window.ActiveXObject || "ActiveXObject" in window) {
        // this.$message({
        //     message: '是IE浏览器',
        //     type: 'warning'
        //   })
        return true;
      } else {
        // alert("不是IE浏览器");
        this.$message({
            message: '如需生成桌面快捷方式，请在IE浏览器中打开！',
            type: 'warning'
          })
        return false;
      }
    },

注释：使用ActivexObject 区分IE浏览器与非IE浏览器

IE支持ActiveObject控件，而chrome系列不支持

第三步：调接口

toDesktop() {
      var result = this.isIE();
      if (!result) {
        //不是IE浏览器
        //获得按钮元素
        var toDesktopButtonNode = document.getElementById("toDesktopButton");
        //隐藏按钮
        // toDesktopButtonNode.style.display = "none";
        return false
      }
      let sUrl = this.sUrl
      let sName = this.sName
      console.log('result', sUrl, sName)
        try {
          var WshShell = new ActiveXObject("WScript.Shell");
          // CreateShortcut 方法创建 WshShortcut 对象并将其返回。如果快捷方式标题以 .url 结尾，就会创建 WshURLShortcut 对象。
          // SpecialFolders 使用 WshSpecialFolders 对象提供对 Windows shell 文件夹的访问，如桌面文件夹，开始菜单文件夹和个人文档文件夹。
          // 返回完整的Windows桌面文件夹路径，
          var oUrlLink = WshShell.CreateShortcut(WshShell
              .SpecialFolders("Desktop")
              + "\\" + sName + ".url");
          oUrlLink.TargetPath = sUrl;
          oUrlLink.Save();//保存一个快捷方式，该快捷方式指向 FullName 属性指定的位置。
          this.$notify({
            type: 'success',
            message: '成功创建桌面快捷方式!'
          })
        } catch (e) {
          this.$message({
              message: '当前IE安全级别不允许操作或您的浏览器不支持此功能！',
              type: 'warning'
            })
        }
    },

备注：借助于createShortcut（）方法是一个关键。

喜欢就点个赞吧！！！文章来源地址https://www.toymoban.com/news/detail-621429.html

到了这里，关于前端如何实现一个网站的桌面快捷方式的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！