关于chrome插件开发（三）

时间：2020-12-11 17:48:49

   在开发chrome插件开发的时候难免遇到获取浏览器地址栏url，进行相关操作。JavaScript有一些获取url的函数，但是对于插件来说，直接应用这些函数并不能实现url的获取。

一、在讲获取url之前，首先得了解url的组成：

  • scheme:通信协议，常用的http,ftp,maito等。
  • host:主机，服务器(计算机)域名系统 (DNS) 主机名或 IP 地址。
  • port:端口号，整数，可选，省略时使用方案的默认端口，如http的默认端口为80。
  • path:路径，由零或多个"/"符号隔开的字符串，一般用来表示主机上的一个目录或文件地址。
  • query:查询，可选，用于给动态网页（如使用CGI、ISAPI、PHP/JSP/ASP/ASP.NET等技术制作的网页）传递参数，可有多个参数，用"&"符号隔开，每个参数的名和值用"="符号隔开。
  • fragment：信息片段

 

二、直接利用JavaScript获取url
 

 

 

 1.获取整个url：window.location.href
 

 2.获取url协议：window.location.protocol



 3.获取url主机：window.location.host
 

 4.获取url端口：window.location.port
 

 5.获取url路径：window.location.pathname
 

 6.获取url查询或参数部分（链接中“？”号后面的部分）：window.location.search
 

 7.获取url信息片段：window.location.hash
 

三、在chrome插件中获取url
 

    1、通过webNavigation获取url，并通过判断跳转链接
 

 
 
chrome.webNavigation.onBeforeNavigate.addListener(function(details){
			var geturl = details.url;};
这样geturl即是当前页面的url，如果要在本页面通过某种限定条件跳转到另一个页面： 

 

 
 
chrome.webNavigation.onBeforeNavigate.addListener(function(details){
			var geturl = details.url;
	        if (//你要设置的条件){
                                var newurl=“你要跳转的链接” 
				chrome.tabs.update(details.tabId,{url:newurl});	
            }
});

 
 



 

 
 
 注：上面的代码可以实现在当前网页直接跳转，因为在chrome的background。js里面，window.location.href(url)，是不管用的，通常只能通过window.open来在新的tab中打开网页。 



 

2、通过chrome.tabs.onUpdated.addListener获取url，并通过判断屏蔽访问并重定向链接
 


  这个函数同样可以在chrome的英文开发文档里找到，具体解释参看开发文档 

 


  例子： 
 
chrome.tabs.onUpdated.addListener(function(tabId,changeInfo,tab){
    var geturl = tab.url;
    var re=/select|update|delete|truncate|join|union|exec|insert|drop|count|'|"|;|>|</i;
    if(re.test(geturl)){
        alert("请勿输入非法字符");
    }
});
这个函数会执行好几次，原因是 
 tabs.onUpdated有两个状态，一个是loading，一个是complete。所以，处理这个事件时，应该要判断下状态（if（changeinfo.status ==“loading”）） 

 

 
 重定向： 

 

 
  
 
chrome.tabs.onUpdated.addListener(function(tabId,changeInfo,tab){
            var geturl = tab.url;
	        if (changeInfo.status == "loading" && “你自己的条件”)){
	//调用向安全网址重定向的函数			
				chrome.webRequest.onBeforeRequest.addListener(
                    function(details){
                        return {
							redirectUrl:details.url.replace(geturl,“你要重定向的网址”)
						       };
                    },  
                    {
                         urls:[
                          //适用的网站:到时候要修改
                            "<all_urls>"
                              ]
                    },
                    [
                      "blocking"
                    ]
                )
				
            }
});

但是这个方法在第一次执行的时候，是可以正确执行的，但到第二次就会出错，显示“网址已经重定向到xxxx网址，不能再定向到XXX（此处为第二次输入的网址）”。后面再研究研究这个错误，看怎么解决 
 






 
 


 

 
 


标签：
相关文章