首页 > 其他分享 >【谷歌插件开发】获取当前网站COOKIE并上报HTTP-API

【谷歌插件开发】获取当前网站COOKIE并上报HTTP-API

时间:2023-04-25 18:35:21浏览次数:40  
标签:username 插件 HTTP hostnm ajax API cookie var password

一 背景

由于本人每天需要登录网站查看数据并分析统计汇总,而每次机械式地搜索和简单计算,十分繁琐。我们可以写个定时任务,每天根据cookie获取网站数据并遍历统计。

脚本得以成功执行的关键是需要获取到COOKIE

故,写了个谷歌插件用来上报COOKIE

二 代码总目录

三 上代码

  • manifest.json
    {
      "manifest_version": 3,
      "name": "Get Cookie",
      "description": "get cookie",
      "version": "1.0.0.1",
      "action": {
        "default_popup": "index.html",
        "default_icon": "images/icon.png"
      },
      "host_permissions": [
    	  "http://*/*",
    	  "https://*/*"
      ],
      "permissions": [
    	  "cookies",
    	  "tabs"
      ]
    
    }
  • index.html
    <html>
    	<head>
    		<meta http-equiv="content-type" content="text/html;charset=utf-8">
    		<link rel="stylesheet" type="text/css" href="mystyle.css">
    	</head>
    	<body>
    		<div id="container">
    			
    			
    			 <div class="sub">
    			    <div class="card">
    					<form action="#">
    						<textarea id="cookie" required readonly name="cookie" value="" placeholder="cookie"></textarea> <br>
    						<br>
    						<textarea id="hostnm" required readonly name="hostnm" value="" placeholder="host name"></textarea> <br>
    						<br>
    						<input id="username" type="text" required name="username" value="" class="username" style="height:30px;font-size: 15px;line-height:30px;" placeholder="请输入投放账户ID" autocomplete="on"> <br>
    						<br>
    						<input id="password" type="password" required name="password" value="" class="password"style="height:30px;font-size: 15px;line-height:30px;"placeholder="请输入密码"><br>
    						<br>
    						<label>环境:</label>
    						<input type="radio" name="env" value="2" checked /> 正式
    						<input type="radio" name="env" value="1" /> 测试
    						<br><br>
    						<input type="button" id="btn" style="background-color: #b3d4fc;width: 60%;height: 30px" value="验证上传">
    					</form>
    			    </div>
    			  </div> 
    		</div>
    		<script src="script.js"></script>
    	</body>
    </html>
  • mystyle.css
    #container {
      width: 250px;
      word-break: break-all;
    }
    .login{
      margin: 0 auto;
      position: relative;
      top: 100px;
      height: 500px;
      width: 400px;
      border-color: aqua;
    }
    .card{
      width: 75%;
      margin: auto;
    }
    

     

  • script.js
    const $container = document.getElementById('container')
    document.addEventListener('DOMContentLoaded', () => {
    	chrome.tabs.query({ 'active': true, 'windowId': chrome.windows.WINDOW_ID_CURRENT },
    		function (tabs) {
    			var url = new URL(tabs[0].url)
    			document.getElementById("hostnm").value = url.host
    			var hostarr = url.host.split('.')
    			hostarr.shift()
    			var curhost = hostarr.join(".");
    			console.log(curhost)
    			
    			chrome.cookies.getAll({
    				domain: curhost
    			}, (cookies) => {
    				console.dir(cookies);
    				cookies.map((c) => {
    					document.getElementById("cookie").value += c.name + "=" + c.value+"; "
    				})
    			})
    			
    			var btn=document.getElementById("btn");
    			btn.onclick=function () {
    				var username=document.getElementById("username").value;//获取用户名input的value
    				var password=document.getElementById("password").value;
    				var cookie=document.getElementById("cookie").value;
    				var hostnm=document.getElementById("hostnm").value;
    				var env = 2;
    				var obj = document.getElementsByName("env")
    				for (var i = 0; i < obj.length; i++) {
    					if (obj[i].checked) {
    						env = obj[i].value;                   
    					}
    				}
    				console.log("env: " + env)
    				console.log("username: " + username)
    				console.log("password: " + password)
    				console.log("cookie: " + cookie)
    				console.log("hostnm: " + hostnm)
    				if(username == undefined || username.trim() == ''){
    					alert("请输入 投放账户ID")
    					return false;
    				}
    				if(password == undefined || password.trim() == ''){
    					alert("请输入 密码")
    					return false;
    				}
    				if(cookie == undefined || cookie.trim() == ''){
    					alert("获取COOKIE失败")
    					return false;
    				}
    				if(hostnm == undefined || hostnm.trim() == ''){
    					alert("获取域名失败")
    					return false;
    				}
    				if(hostnm.trim().indexOf('你想抓去的页面域名') == -1){
    					alert("非需要抓取页面")
    					return false;
    				}
    				username = username.trim();
    				password = password.trim();
    				cookie = cookie.trim();
    				hostnm = hostnm.trim();
    				var data= {
    					'username':username,'password':password,'env':env,'cookie':cookie,'hostnm':hostnm
    				}
    				console.log(data)
    				var stringData=JSON.stringify(data);
    				var querydData = Object.keys(data).map(key => key + '=' + data[key]).join('&');
    				var ajax=null;
    				if(window.XMLHttpRequest) {
    					ajax=new XMLHttpRequest();
    				}else {
    					ajax=new ActiveXObject("Microsoft.XMLHTTP");
    				}
    				var posturl = "http://测试域名/api/upcookie";
    				if(env == 2){
    					posturl = "https://正式域名/api/upcookie"
    				}
    			    ajax.open("POST",posturl,true);
    				// ajax.open("GET",posturl+'?'+querydData,true);
    				ajax.onreadystatechange=function () {
    					if(ajax.readyState==4){
    						if(ajax.status==200){
    							var demo=ajax.responseText;
    							var demojson = JSON.parse(demo); 
    							if(demojson.success){
    								alert("上传成功")
    							}else{
    								alert(demojson.msg)
    							}
    						}else{
    							alert("服务器繁忙,请稍后重试")
    						}
    					};
    				}
    				ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    				ajax.send(querydData);
    			}
    		}
    	);
    })

四 效果演示

 

 

五 补充说明

  • 需要填写用户名密码的意义在于服务安全,防止拓展被乱用,我可以在api的后台随时配置随时删除。当然你使用jwt或更高级的更好。
  • cookie是有几级域名限制的,我们经常涉及到sso的场景,一般用类似于baidu.com来抓去baidu的cookie,而非fanyi.baidu.com。

标签:username,插件,HTTP,hostnm,ajax,API,cookie,var,password
From: https://www.cnblogs.com/bushuwei/p/17353501.html

相关文章

  • API 自动化测试难点分享
    笔者是API管理工具的项目参与者之一,在日常工作中会经常遇到API自动化测试难点,我决定总结分享给大家: API自动化测试的难点包括:接口的参数组合较多,需要覆盖各种可能的情况。接口的状态和数据关联较多,需要验证返回结果是否符合预期。接口的并发访问和性能测试较为复杂,需......
  • C# abp框架Http辅助类
    一、定义接口为什么要定义接口而不直接使用静态类,因为接口可以注入缓存对象,这样就能从缓存中读取指定的请求头usingSystem;usingSystem.Collections.Generic;usingSystem.Net.Http;usingSystem.Text;usingSystem.Threading.Tasks;usingVolo.Abp.Application.Service......
  • C++语言亚马逊国际获取AMAZON商品详情 API接口
    跨境电子商务是一种全新的互联网电商模式,运用电子化方式促成线上跨境交易,利用跨境物流运送商品,有利于打破传统的贸易格局,成为新的经济增长点。对我国来说,跨境电商平台正用一种全新的力量改变我国产业链的结构,并有利于增加贸易机会,拓展我国外贸在国际市场的广度与深度,赢得广阔的海......
  • API网关:开源Apinto网关-上游服务篇(二)
    功能介绍服务发现是一种分布式系统中的关键技术,它能够帮助应用程序动态地发现和访问依赖的服务实例,解决了服务实例分布在不同节点上的问题。通过服务发现,应用程序可以快速找到需要调用的服务实例的位置和元数据信息,并实现负载均衡和故障恢复等功能,从而提高分布式系统的可用性和性能......
  • API网关:开源Apinto网关-上游服务篇(二)
    功能介绍服务发现是一种分布式系统中的关键技术,它能够帮助应用程序动态地发现和访问依赖的服务实例,解决了服务实例分布在不同节点上的问题。通过服务发现,应用程序可以快速找到需要调用的服务实例的位置和元数据信息,并实现负载均衡和故障恢复等功能,从而提高分布式系统的可用性和......
  • API网关:开源Apinto网关-上游服务篇(一)
    背景介绍Apinto是一款高性能、可扩展、易维护的API网关。Apinto网关基于GO语言模块化开发,5分钟极速部署,配置简单、易于维护,支持集群与动态扩容,企业级开箱即用。Apinto除了提供丰富的网关插件外,还将提供监控告警、用户角色等企业插件,同时支持自定义网关插件和可扩展企业......
  • java通过url得到文件对象(支持http和https)
    文字标题:java通过url得到文件对象(支持http和https)作者:锅巴1.场景:通过一个url地址来得到一个文件,此方式就是通过一个url将文件下载到本地的临时文件,直接上代码/***远程读取文件**@paramnetUrl*@return*/publicstaticFilegetNet......
  • Google浏览器 查看http版本是1.1还是2.0
    1、打开网页2、F12进入开发者模式3、找到请求4、找到请求头5、找到ResPonseHeather点击Viewparsed......
  • vscode插件
    自用vscode插件1.EditorConfigforVSCodeeditorconfig用来定义编辑器的编码格式规范,编辑器的行为会与.editorconfig文件中定义的一致,并且其优先级比编辑器自身的设置要高。简单说明:在项目根目录下创建.editorconfi文件,然后设置好内容,则其他人更新后同步到本地,你们......
  • Java代码虾皮item_search-根据关键词获取商品列表 API 接口(title商品标题、pic_url宝
     Shopee是东南亚最大的电商平台之一。Shopee拥有商品种类,包括电子消费品、家居、美容保健、母婴、服饰及健身器材等。做好shopee店铺需要注意以下几点:1.选择优质的产品2.每日上新产品3.营销策略4.引流策略5.发货的地点Java代码操作示例importjava.io.BufferedReader;impo......