微博、腾讯视频(部分)提取器-- 前端Vue.js篇

跟風遠走 提交于 2020-02-13 15:42:17

提取器主要功能是将输入的微博视频地址转换成可下载的视频地址,如下图所示

在这里插入图片描述
单击下载代码

关键代码摘录

提交单击事件代码如下

export default {
  name: "app",
  components: {},
  data() {
    return {
      url: "",  //用户输入的原始视频地址
      videoUrl: "", //解析后的视频地址
    };
  },
  methods: {
    videoSaveAsHandler: function() {
      if (!!this.url) {
      // 腾讯视频下载
        if (this.url.includes("https%3A%2F%2Fv.qq.com%2F")) {
          try {
            if (!!JSON.parse(this.url)) {
              let str = JSON.parse(this.url);
              str = str.vurl;
              str = unescape(str);
              // 目前只能解析以 https://ugccsy.qq.com 打头的视频
              if (str.startsWith("https://ugccsy.qq.com")) {
                this.videoUrl = str;
                this.url = "";
              }
            }
          } catch (error) {}
        } else {
          // 尝试解析微博视频
          this.url.startsWith("http://t.cn/") &&
            fetch("http://xiaogangnetworks.com/getVideo?videourl=" + this.url)
              .then(response => response.text())
              .then(data => {
                this.url = "";
                this.videoUrl = data;
              })
              .catch(e => console.log("Oops, error", e));
        }
      }
    }
  }
};

知识点

try catch可确保JSON.parse遇到无法解析的JSON字符时不报错,而是静默失败。
escape: [来自MDN]废弃的 escape() 方法生成新的由十六进制转义序列替换的字符串. 使用 encodeURI 或 encodeURIComponent 代替.

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!