前言
谷歌插件只要配好了manifest.json就差不多了
目录
│ 1.txt
│ index.html
│ manifest.json
│
├─images
│ cookie.png
│
├─js
│ background.js
│ index.js
│
└─lib
│ element-ui.css
│ element-ui.js
│ vue.min.js
│
└─fonts
element-icons.ttf
element-icons.woff
开始
manifest.json
{
"manifest_version": 2,
"name": "自动登录",
"version": "1.0",
"description": "自动登录",
"author": "爱看书的小猫咪",
"permissions": [
"cookies",
"tabs",
"http://*/*",
"https://*/*"
],
"icons": {
"16": "images/cookie.png",
"48": "images/cookie.png",
"128": "images/cookie.png"
},
"browser_action": {
"default_icon": "images/cookie.png",
"default_popup": "index.html"
},
"background": {
"scripts": [
"js/background.js"
]
},
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"
}
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>自动登录</title>
<!-- <link rel="stylesheet" href="css/reset.css"> -->
<link rel="stylesheet" href="lib/element-ui.css">
<style>
*{
padding: 0;
margin: 0;
}
body {
padding: 20px;
min-width: 400px;
min-height: 400px;
}
.header{
margin-bottom: 10px;
}
</style>
</head>
<body>
<div id="app">
<h1 class="header">前端自动登录</h1>
<el-card>
<div slot="header">设置当前cookie为：</div>
<el-button type="success" @click="getCookie('baidu.com')">本地环境</el-button>
<el-button type="primary" @click="getCookie('sina.com')">测试环境</el-button>
</el-card>
<el-card>
<div slot="header">按url地址设置</div>
<el-form ref="data_form" :model="dataForm" label-width="80px">
<el-form-item label="URL" prop="url" :rules="[
{ required: true, message: 'URL不能为空'},
{ type: 'string', message: 'URL须为字符串'}
]">
<el-input type="url" v-model.number="dataForm.url" autocomplete="off">
<template slot="append">
<el-button size="mini" type="primary" @click="customSet">设置</el-button>
</template>
</el-input>
</el-form-item>
</el-form>
</el-card>
</div>
<script src="lib/vue.min.js"></script>
<script src="lib/element-ui.js"></script>
<script type="text/javascript" src="js/index.js"></script>
</body>
</html>
index.js
// Copyright (c) 2021 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
new Vue({
el: '#app',
data: function () {
return {
dataForm : {
url: ''
}
}
},
methods: {
customSet() {
this.$refs['data_form'].validate((valid) => {
if (valid) {
this.getCookie(this.dataForm.url)
}
})
},
getCookie(url) {
let detail = {}
if (/^http/.test(url)) {
detail.url = url
}else{
detail.domain = url
}
chrome.cookies.getAll(detail, (cookies) => {
const loginCookies = cookies.filter(item => ['PHPSESSID'].includes(item.name))
console.log(loginCookies)
if (loginCookies.length === 2) {
this.setLoginCooke(loginCookies)
} else {
this.$message.error('当前选区的网站也没登录！');
}
})
},
async setCookie(url, name, value) {
const cookie = await chrome.cookies.set({
url: url,
name: name,
value: value
},function (cookie) {
console.log(cookie)
})
return cookie
},
setLoginCooke(loginCookies) {
chrome.windows.getCurrent((w) => {
wid = w.id;
chrome.tabs.getSelected(wid, (t) => {
if (t.url.substr(0, 7) == 'http://' || t.url.substr(0, 8) == 'https://') {
Promise.all(
loginCookies.map(cookie => this.setCookie(t.url, cookie.name, cookie.value))
).then(res => {
console.log(res)
this.$message({
type: 'success',
message: '设置成功',
duration: 500
})
})
}else{
this.$message.error('当前页面不是http(s)协议');
}
});
});
}
}
})
网友评论