基于Chrome浏览器插件实现SAE自动登录

不知道各位大神在用sae开发项目是不是有这样的困扰，sae是没有记住密码功能的，每次系统都需要调用新浪登录的api来进行登录，ae这样做可能是出于安全考虑吧，其实对于我自己的pc机开发来讲，有个自动登录的功能可能更方便一些，于是，自己就写了一个Chrome的插件来实现sae的自动登录，也算是写一个chrome插件的入门教程吧。因为学会这个，写个什么屏蔽乱码七糟广告的插件也不是什么难事了。
首先呢，我们需要三个文件和一个logo文件，这里我的logo采用的是sae的logo，三个文件分别是，
jquery.js：这个我不多说，大家都知道。

manifest.json：这个是一个控制文件，它起着整合各个文件的作用，我们看一下它的代码。

{"name": "微博登陆","version": "1.2","description": "新浪sae登陆自动填写密码 更新日期：2014-01-17","icons" : {            "48": "logo.png"},"content_scripts": [{"matches": ["https://api.weibo.com/*"],"js": ["jquery.js","login.js"],"all_frames":true}],"permissions": ["tabs","contentSettings","https://api.weibo.com/*"],"manifest_version": 2
}

这是一个json文件，我们可以通过icons属性来指定图片，这里logon,png即是sae的logo，放在和 manifest.json文件同级目录下。content_scripts下的matches属性来指定控制哪个页面，我们要控制的当然是微博登陆api的界面，url为 https://api.weibo.com/oauth2/authorize?client_id=2857799177&redirect_uri=http%3A%2F%2Fsae.sina.com.cn%2Fssl%2F%3Fm%3Dsso%26a%3Dweibo_callback%26sccb%3Dhttp%253A%252F%252Fsae.sina.com.cn%252F&response_type=code&forcelogin=true ，当然，好长的链接，但有点web基础的就可以看出，前面的 https://api.weibo.com/ 是不会变的，而后面的是会变动的，所以这个地址我们就用 https://api.weibo.com/ *来代替。content_scripts下的js属性用来引用js文件，jquery我们不说了，说一下第二个js文件login.js。

$(document).ready(function(){$("#userId").val("saymagic@163.com");$("#passwd").val("************");$("[name='authZForm']").submit();
});

代码很简单，首先先看一下登陆的界面吧，

我们要做的，无外乎这些，首先让我们的插件自动填写账号的文本框，接着填写密码的文本框，最后通过javascript的submit函数提交表单，这样，如果我们的用户名和密码填写正确，name提交后的事情就会由微博的api自动执行，它就会帮我们重新连接回sae，这个时候就会变成已登录状态，所以，说了这些，上面的login.js的三行代码大家就应该瞬间明白了，我是通过按下F12键来找到登陆框、密码框和form表单的name和id，so，$("#userId").val("saymagic@163.com");这句用来填写账号，$("#passwd").val("************");这句用来填写密码，
$("[name='authZForm']").submit();这句用来提交表单。怎么样，应该很容易理解吧，

好的，一个小型的jquery插件基本完成，最后呢，我们就要把我们做好的插件放到Chrome里，找到Chrome的设置->扩展程序，你将看到如下界面：

接着点击加载正在开发的扩展程序按钮，会弹出文件选择框，你只需要把我们刚才做好的包含三个文件+一张图片的文件夹选中即可。
测试一下，相信你会成功的。把我的代码给大家共享一下吧。

基于Chrome浏览器插件实现SAE自动登录相关推荐

Chrome浏览器插件Postman用法简介-Http请求模拟工具
在我们平时开发中,特别是需要与接口打交道时,无论是写接口还是用接口,拿到接口后肯定都得提前测试一下,这样的话就非常需要有一个比较给力的Http请求模拟工具,现在流行的这种工具也挺多的,像火狐浏览器插件 ...
使用chrome浏览器插件postman模拟post、get请求
使用chrome浏览器插件postman模拟post.get请求 postman为chrome浏览器的一个插件,用来模拟post请求,get请求等.可以在chrome浏览器里安装插件(前提是你得访问了 ...
10 款值得珍藏的 Chrome 浏览器插件
作者 | 沉默王二责编 | 郭芮 Firebug 的年代,我是火狐(Mozilla Firefox)浏览器的死忠:但后来不知道为什么,该插件停止了开发,导致我不得不寻求一个新的网页开发工具.那段时间 ...
2021年10款优质Chrome浏览器插件推荐
Chrome插件像一个个小帮手,帮我们提升效率,完成一些有价值的事情.其实有很多这样的优质实用插件,很多人并不知道它们的存在,下面就特意为大家整理10款非常有用的插件. 1.哔哩哔哩助手:B站扩展程序 ...
【Word页面编辑---Chrome 浏览器插件】
** Word页面编辑-Chrome 浏览器插件 ** 前言目前基于Web页面的富文本编辑器有Ueditor.CKEditor等前端编辑器:这些编辑器具有小巧灵活,使用方便的特点.但是这种前端编辑器 ...
吐血推荐 5 个 Chrome 浏览器插件，文末有从别人的电脑移植插件的方法
最近又发现一些好用的 Chrome 插件,上次的分享得到大家的热捧,在这里--推荐 5 款超好用的 Chrome 浏览器插件,这次也给大家分享五个,喜欢就点个赞,也欢迎大家留言推荐一些给我,谢谢. s ...
FiddlerScript 注入cooke实现自动登录,Fiddler实现免登陆,浏览器通代理实现自动登录
一,问题描述最近看到一个用易语言写的软件,点击运行,会自动将电脑的代理修改为:http=127.0.0.1:xxx;https=127.0.0.1:xxx ,使用chrome浏览器或火狐浏览器配置这 ...
Chrome浏览器插件安装一览表
Chrome浏览器插件安装一览表微软的IE浏览器存在众所周知的效率问题,不再使用:Firefox自动更新会多一个版本(我有点强迫症,看不惯这一点):那就是用同样大名鼎鼎的Google推出的Chrom ...
Postman基于Chrome扩展插件安装
Postman 是一个很强大的 API调试.Http请求的工具. 该方式是基于 Chrome 浏览器的扩展插件来进行的安装,并非单独应用程序. 1.插件安装包下载地址: 链接:下载链接 ...

基于Chrome浏览器插件实现SAE自动登录

基于Chrome浏览器插件实现SAE自动登录相关推荐

最新文章

热门文章