油猴自动登录脚本：实现Kubernetes Dashboard的自动化登录

油猴自动登录脚本：实现Kubernetes Dashboard的自动化登录

引用

CSDN

1.

https://blog.csdn.net/keinz/article/details/138574381

Kubernetes Dashboard每次登录都需要手动输入token，这不仅繁琐而且容易出错。本文将介绍如何使用油猴脚本实现自动登录，包括自动点击、输入token和提交表单等具体操作。

基础知识

在开始之前，需要了解一些基础知识：

• 油猴开发指南：提供油猴脚本开发的相关指导和API说明。
• MDN：Mozilla开发者网络，提供丰富的Web开发资源和文档。

实现过程

最开始的想法

最初的设想是通过脚本实现以下功能：

1. 自动点击，切换到token选项
2. 自动输入token
3. 自动点击提交按钮

遇到的问题

在实现过程中遇到了两个主要问题：

1. 无法选中token选项

尝试通过设置radio的checked属性来选中token选项，但未能成功。

var s = document.querySelector('#mat-radio-3');
s.checked = true;
// 不知道哪有问题，后续再看吧

2. token值无法正确传递

虽然能够设置token输入框的值，但在提交时接口无法正确接收token值。

var token = document.querySelector('#token');
token.value = "this is token";

经过查找资料发现，这是因为元素存在数据校验或规则校验，需要触发规格校验使其正常检测。

最终解决方案

采用监听选择的方式，当检测到点击事件时，自动填充token并提交表单。

function modifyText() {
  sleep(1000).then(() => {
    const change = new Event("change");
    var token = document.querySelector('#token');
    token.value = "this is token";
    token.dispatchEvent(change);
    document.querySelector('[type="submit"]').click();
  });
}

const el = document.querySelector('#mat-radio-3');
el.addEventListener("click", modifyText, false);

总结

作为后端开发者，对前端JavaScript的使用还不够熟练，一些看似简单的问题也需要查阅大量资料才能解决。通过这个实践，不仅实现了自动登录的功能，也加深了对前端开发的理解。