JavaScript编写浏览器脚本

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.youkuaiyun.com/lys1695227550/article/details/78076780

JavaScript之浏览器脚本

前言：

       现在这个时代，是看剧的时代，但是现在的视频网站对用户都有vip的要求。对于我个人来讲，不是经常看剧，所以我没有一个视频网站的vip，但是难免一两次需要vip，所以打算写一个JavaScript脚本，实现免费直接观看vip视频。（本着学习js的心态）

提醒：

       如果你爱看剧，喜欢看剧，请支持正版！!

在浏览器上安装：暴力猴插件，或者油猴插件

在暴力猴上编辑脚本

// ==UserScript==
// @icon         http://www.kutx.cn/xiaotupian/icons/png/200811/20081114122646255.png
// @name     VIP视频解析工具
// @namespace    1695227550@qq.com
// @author   lailai
// @description 直接播放vip视频
// @match        *://*.iqiyi.com/v_*
// @match        *://*.iqiyi.com/dianying/*
// @require      http://code.jquery.com/jquery-1.8.0.min.js
// @version      1.0.0
// @grant        GM_addStyle
// ==/UserScript==

以上是一个脚本需要的 ，在此对几个api解释

@icon 图标，可显示

@name 脚本名称

@namespace 命名空间（学过编程都应该了解）

@author       作者

@description 描述

@match                （我也不懂是不是正则，在这的意思是爱奇艺的播放网址）

@version       版本

@grant         GM_addStyle  

将在脚本运行前即决定脚本将是否在安全沙盒中运行、将要用到哪些API

（这个的介绍，可参考：http://g.mozest.com/thread-42139-1-1）

原理部分:

其实就是使用某个网址的的解析接口，我使用过好多的插件，脚本，其实都是使用这个方式（印象中，有一个网址被限制提供视频解析的服务）

       在此我举一个例子，某部vip视频的网址为http://www.iqiyi.com/v_19rr7plelw.html#vfrm=19-9-0-1

只需要将解析网址的后面的参数url添加http://www.82190555.com/index/iqiyi.php?url=http://www.iqiyi.com/v_19rr7plelw.html

这样就可以实现免vip观看（画质一般，没有强迫症的话还是可以接受的）

地址：

目前亲测两个站点：

[javascript]  view plain  copy

1. {"name":"无名小站","url":"http://www.wmxz.wang/video.php?url=","title":"www.wmxz.wang"},  
2. {"name":"迷失之梦","url":"http://mt2t.com/yun?url=","title":"mt2t.com"}  

思路部分：

      我们可以通过获取现在使用的视频播放器标识，判断是哪个网址。接着对页面进行分析，选择合适的位置（用于添加我们设计的一些可视化的标记，作为用户操作区），关键是，使用浏览器的开发者模式，对web页面进行分析，获得Element节点。设计界面，只需要懂得一些html，css就可。最后就是将设计的操作区，绑定之前选择的节点上以及一些js事件的设计（主要是点击）。

下面贴上，一段代码， 用于观看爱奇艺vip视频

（这是学习过程中的一个demo，参考一个不知道多久以前下载的js脚本，好像能够兼容多个站点）

[javascript]  view plain  copy

1. // ==UserScript==  
2. // @icon         http://www.kutx.cn/xiaotupian/icons/png/200811/20081114122646255.png  
3. // @name             VIP视频解析工具  
4. // @namespace    1695227550@qq.com  
5. // @author         lailai  
6. // @description  直接播放vip视频  
7. // @match        *://*.iqiyi.com/v_*  
8. // @match        *://*.iqiyi.com/dianying/*  
9. // @require      http://code.jquery.com/jquery-1.8.0.min.js  
10. // @version      1.0.0  
11. // @grant        GM_addStyle  
12. // ==/UserScript==  
13.   
14. (function() {  
15.     'use strict';  
16.     //样式添加  
17.     GM_addStyle('#jxPanel{position:absolute;z-index:9999;text-align:center;border-radius:5px;background-color:#A94442;}' +  
18.                 '.toggleClass_opacity{opacity:0;}' +  
19.                 '#jxPanel>ul>li:not(:last-child){border-bottom:1px solid #bdbcbc;}' +   
20.                 '#jxPanel>ul>li{line-height:25px;list-style:none;font-size: 24px;}' +  
21.                 '#jxPanel>ul>li>a{color:black;}');   
22.   
23.     var InterfaceJSON=[  
24.         {"name":"无名小站","url":"http://www.wmxz.wang/video.php?url=","title":"www.wmxz.wang"},  
25.         {"name":"迷失之梦","url":"http://mt2t.com/yun?url=","title":"mt2t.com"}  
26.     ];  
27.   
28.       
29.     var currentSite = null;  
30.     var videoSite = window.location.href;  
31.   var reAqy = /iqiyi/i;  
32.     
33.   var vipBtn = '<div id="ul_div" style="display:inline-block;vertical-align: middle;">';  
34.     vipBtn += '<a href="javascript:void(0);" id="btn_vip" style="cursor:pointer;text-decoration:none;color:red;padding:0 5px;border:1px solid red;">vip在线解析</a>';  
35.     vipBtn += '<div>';  
36.   vipBtn += '</div>';  
37.     var jxPanel = '<div id="jxPanel" class="toggleClass_opacity"> <ul>';  
38.     $.each(InterfaceJSON,function(index,value){  
39.         jxPanel += '<li><a class="jx_" title="'+ value.title +'" data-jx-site="' + value.url + '" href="javascript:void(0);">' + value.name + '</a></li>';  
40.     });  
41.     jxPanel += '</ul></div>';  
42.     vipBtn += jxPanel;  
43.     vipBtn += "</div>"  
44.      
45.     // 爱奇艺  
46.     if(reAqy.test(videoSite)){  
47.         currentSite = "iqiyi";  
48.         var iqiyiTitle = $('#widget-videotitle');  
49.         iqiyiTitle.parent('.mod-play-tit').append(vipBtn);  
50.             $("#ul_div").css("margin-top","-10px");  
51.         $('#btn_vip').css({'font-size':'20px','display':'inline-block','height':'24px','line-height':'24px','margin':'0 5px'});  
52.     }  
53.          
54.     $("#jxPanel").css("width",$("#btn_vip").parent().width());  
55.       
56.     //展开解析地址列表  
57.     $("#btn_vip").click(function(){  
58.         $("#jxPanel").toggleClass("toggleClass_opacity");  
59.     });  
60.     //解析地址列表单击事件  
61.     $("#jxPanel").on("click","a.jx_",function(){  
62.         var decode_url = $(this).attr("data-jx-site");  
63.         videoSite = window.location.href; //获取最新地址  
64.         window.open((decode_url + videoSite));        
65.     });  
66. })();  

对于有html，css，js基础的朋友，理解这些代码很是简单，（没有这些基础的话，解释也看不懂），所以我在此不解释。

重要的事说三遍：

如果你喜欢看剧，请支持正版！

如果你喜欢看剧，请支持正版！

如果你喜欢看剧，请支持正版！