自定义上传 Token,保护您的上传权限不被他人使用。
v1.5.0
`;
document.body.appendChild(modal);
// 绑定事件
// 关闭按钮
modal
.querySelector(".ns-settings-close")
.addEventListener("click", () => {
this.hideSettingsModal();
});
// 取消按钮
modal.querySelector(".ns-cancel-btn").addEventListener("click", () => {
this.hideSettingsModal();
});
// 保存按钮
modal.querySelector(".ns-save-btn").addEventListener("click", () => {
this.saveTokenSettings();
});
// 随机按钮事件
modal.querySelectorAll(".ns-random-btn").forEach((button) => {
button.addEventListener("click", (e) => {
const target = e.target.dataset.target;
const randomToken = this.generateRandomToken();
if (target === "primary") {
modal.querySelector("#ns-primary-token").value = randomToken;
} else if (target === "backup") {
modal.querySelector("#ns-backup-token").value = randomToken;
}
});
});
// 点击模态框背景关闭
modal.addEventListener("click", (e) => {
if (e.target === modal) {
this.hideSettingsModal();
}
});
}
/**
* 显示设置对话框
*/
showSettingsModal() {
const modal = document.querySelector(".ns-settings-modal");
if (modal) {
// 更新输入框值为当前设置
modal.querySelector("#ns-primary-token").value =
this.settings.primaryToken;
modal.querySelector("#ns-backup-token").value =
this.settings.backupToken;
modal.classList.add("visible");
// 防止背景滚动
document.body.style.overflow = "hidden";
}
}
/**
* 隐藏设置对话框
*/
hideSettingsModal() {
const modal = document.querySelector(".ns-settings-modal");
if (modal) {
modal.classList.remove("visible");
// 恢复背景滚动
document.body.style.overflow = "";
}
}
/**
* 保存 Token 设置
*/
saveTokenSettings() {
const primaryTokenInput = document.querySelector("#ns-primary-token");
const backupTokenInput = document.querySelector("#ns-backup-token");
if (!primaryTokenInput.value.trim()) {
this.showNotification("主要 Token 不能为空", "error");
return;
}
if (!backupTokenInput.value.trim()) {
this.showNotification("备用 Token 不能为空", "error");
return;
}
// 更新设置
this.settings.primaryToken = primaryTokenInput.value.trim();
this.settings.backupToken = backupTokenInput.value.trim();
// 保存到本地存储
this.saveSettings();
// 隐藏设置面板
this.hideSettingsModal();
// 显示成功通知
this.showNotification("设置已保存", "success");
}
/**
* 添加上传按钮和设置按钮到工具栏
*/
addButtons() {
// 如果按钮已存在,不重复添加
if (document.querySelector(`.${CONFIG.UI.BUTTON_CLASS}`)) {
return;
}
// 查找工具栏和图片按钮
const toolbar = document.querySelector(CONFIG.SELECTORS.TOOLBAR);
const picButton = toolbar?.querySelector(CONFIG.SELECTORS.PIC_BUTTON);
if (!toolbar || !picButton) return;
// 创建上传按钮
const uploadButton = document.createElement("span");
uploadButton.className = `toolbar-item i-icon ${CONFIG.UI.BUTTON_CLASS}`;
uploadButton.title = `上传图片 (最大${CONFIG.UPLOAD.MAX_SIZE}MB,超限自动压缩,支持多图同时上传)`;
uploadButton.innerHTML = this.getUploadButtonSVG();
// 添加按钮点击事件
uploadButton.addEventListener("click", () =>
this.handleUploadClick(uploadButton),
);
// 创建设置按钮
const settingsButton = document.createElement("span");
settingsButton.className = `toolbar-item i-icon ${CONFIG.UI.SETTINGS_BUTTON_CLASS}`;
settingsButton.title = `图片上传设置`;
settingsButton.innerHTML = this.getSettingsButtonSVG();
// 添加设置按钮点击事件
settingsButton.addEventListener("click", () => this.showSettingsModal());
// 将按钮添加到工具栏
picButton.parentNode.insertBefore(uploadButton, picButton.nextSibling);
picButton.parentNode.insertBefore(
settingsButton,
uploadButton.nextSibling,
);
}
/**
* 获取上传按钮的SVG内容
*/
getUploadButtonSVG() {
return `