☰

AI Image Description Generator

使用AI生成网页图片描述

  1. // ==UserScript==
  2. // @name         AI Image Description Generator
  3. // @namespace    http://tampermonkey.net/
  4. // @version      4.2
  5. // @description  使用AI生成网页图片描述
  6. // @author       AlphaCat
  7. // @match        *://*/*
  8. // @grant        GM_xmlhttpRequest
  9. // @grant        GM_addStyle
  10. // @grant        GM_setValue
  11. // @grant        GM_getValue
  12. // @grant        GM_registerMenuCommand
  13. // @grant        GM_setClipboard
  14. // @license      MIT
  15. // ==/UserScript==
  16.  
  17. (function() {
  18.     'use strict';
  19.  
  20.     // 全局变量
  21.     let isSelectionMode = false;
  22.     
  23.     // 定义支持的视觉模型列表
  24.     const supportedVLModels = [
  25.         'Qwen/Qwen2-VL-72B-Instruct',
  26.         'Pro/Qwen/Qwen2-VL-7B-Instruct',
  27.         'OpenGVLab/InternVL2-Llama3-76B',
  28.         'OpenGVLab/InternVL2-26B',
  29.         'Pro/OpenGVLab/InternVL2-8B',
  30.         'deepseek-ai/deepseek-vl2'
  31.     ];
  32.  
  33.     // 定义GLM-4V系列模型
  34.     const glm4vModels = [
  35.         'glm-4v',
  36.         'glm-4v-flash'
  37.     ];
  38.  
  39.     // 添加样式
  40.     GM_addStyle(`
  41.         .ai-config-modal {
  42.             position: fixed;
  43.             top: 50%;
  44.             left: 50%;
  45.             transform: translate(-50%, -50%);
  46.             background: white;
  47.             padding: 20px;
  48.             border-radius: 8px;
  49.             box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  50.             z-index: 10000;
  51.             min-width: 500px;
  52.             height: auto;
  53.         }
  54.         .ai-config-modal h3 {
  55.             margin: 0 0 15px 0;
  56.             font-size: 14px;
  57.             font-weight: bold;
  58.             color: #333;
  59.         }
  60.         .ai-config-modal label {
  61.             display: inline-block;
  62.             font-size: 12px;
  63.             font-weight: bold;
  64.             color: #333;
  65.             margin: 0;
  66.             line-height: normal;
  67.             height: auto;
  68.         }
  69.         .ai-config-modal .input-wrapper {
  70.             position: relative;
  71.             display: flex;
  72.             align-items: center;
  73.         }
  74.         .ai-config-modal input {
  75.             display: block;
  76.             width: 100%;
  77.             padding: 2px 24px 2px 2px;
  78.             margin: 2px;
  79.             border: 1px solid #ddd;
  80.             border-radius: 4px;
  81.             font-size: 13px;
  82.             line-height: normal;
  83.             height: auto;
  84.             box-sizing: border-box;
  85.         }
  86.         .ai-config-modal .input-icon {
  87.             position: absolute;
  88.             right: 4px;
  89.             width: 16px;
  90.             height: 16px;
  91.             cursor: pointer;
  92.             display: flex;
  93.             align-items: center;
  94.             justify-content: center;
  95.             color: #666;
  96.             font-size: 12px;
  97.             user-select: none;
  98.         }
  99.         .ai-config-modal .clear-icon {
  100.             right: 24px;
  101.         }
  102.         .ai-config-modal .toggle-password {
  103.             right: 4px;
  104.         }
  105.         .ai-config-modal .input-icon:hover {
  106.             color: #333;
  107.         }
  108.         .ai-config-modal .input-group {
  109.             margin-bottom: 12px;
  110.             height: auto;
  111.             display: flex;
  112.             flex-direction: column;
  113.         }
  114.         .ai-config-modal .button-row {
  115.             display: flex;
  116.             gap: 10px;
  117.             align-items: center;
  118.             margin-top: 5px;
  119.         }
  120.         .ai-config-modal .check-button {
  121.             padding: 4px 8px;
  122.             border: none;
  123.             border-radius: 4px;
  124.             background: #007bff;
  125.             color: white;
  126.             cursor: pointer;
  127.             font-size: 12px;
  128.         }
  129.         .ai-config-modal .check-button:hover {
  130.             background: #0056b3;
  131.         }
  132.         .ai-config-modal .check-button:disabled {
  133.             background: #cccccc;
  134.             cursor: not-allowed;
  135.         }
  136.         .ai-config-modal select {
  137.             width: 100%;
  138.             padding: 4px;
  139.             border: 1px solid #ddd;
  140.             border-radius: 4px;
  141.             font-size: 13px;
  142.             margin-top: 2px;
  143.         }
  144.         .ai-config-modal .status-text {
  145.             font-size: 12px;
  146.             margin-left: 10px;
  147.         }
  148.         .ai-config-modal .status-success {
  149.             color: #28a745;
  150.         }
  151.         .ai-config-modal .status-error {
  152.             color: #dc3545;
  153.         }
  154.         .ai-config-modal button {
  155.             margin: 10px 5px;
  156.             padding: 8px 15px;
  157.             border: none;
  158.             border-radius: 4px;
  159.             cursor: pointer;
  160.             font-size: 14px;
  161.         }
  162.         .ai-config-modal button#ai-save-config {
  163.             background: #4CAF50;
  164.             color: white;
  165.         }
  166.         .ai-config-modal button#ai-cancel-config {
  167.             background: #dc3545;
  168.             color: white;
  169.         }
  170.         .ai-config-modal button:hover {
  171.             opacity: 0.9;
  172.         }
  173.         .ai-floating-btn {
  174.             position: fixed;
  175.             width: 32px;
  176.             height: 32px;
  177.             background: #4CAF50;
  178.             color: white;
  179.             border-radius: 50%;
  180.             cursor: move;
  181.             z-index: 9999;
  182.             box-shadow: 0 2px 5px rgba(0,0,0,0.2);
  183.             display: flex;
  184.             align-items: center;
  185.             justify-content: center;
  186.             user-select: none;
  187.             transition: background-color 0.3s;
  188.         }
  189.         .ai-floating-btn:hover {
  190.             background: #45a049;
  191.         }
  192.         .ai-floating-btn svg {
  193.             width: 20px;
  194.             height: 20px;
  195.             fill: white;
  196.         }
  197.         .ai-menu {
  198.             position: absolute;
  199.             background: white;
  200.             border-radius: 5px;
  201.             box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  202.             padding: 8px;
  203.             z-index: 10000;
  204.             display: flex;
  205.             gap: 8px;
  206.         }
  207.         .ai-menu-item {
  208.             width: 32px;
  209.             height: 32px;
  210.             padding: 6px;
  211.             cursor: pointer;
  212.             border-radius: 50%;
  213.             display: flex;
  214.             align-items: center;
  215.             justify-content: center;
  216.             transition: background-color 0.3s;
  217.         }
  218.         .ai-menu-item:hover {
  219.             background: #f5f5f5;
  220.         }
  221.         .ai-menu-item svg {
  222.             width: 20px;
  223.             height: 20px;
  224.             fill: #666;
  225.         }
  226.         .ai-menu-item:hover svg {
  227.             fill: #4CAF50;
  228.         }
  229.         .ai-image-options {
  230.             display: flex;
  231.             flex-direction: column;
  232.             gap: 10px;
  233.             margin: 15px 0;
  234.         }
  235.         .ai-image-options button {
  236.             padding: 8px 15px;
  237.             border: none;
  238.             border-radius: 4px;
  239.             background: #4CAF50;
  240.             color: white;
  241.             cursor: pointer;
  242.             transition: background-color 0.3s;
  243.             font-size: 14px;
  244.         }
  245.         .ai-image-options button:hover {
  246.             background: #45a049;
  247.         }
  248.         #ai-cancel {
  249.             background: #dc3545;
  250.             color: white;
  251.         }
  252.         #ai-cancel:hover {
  253.             opacity: 0.9;
  254.         }
  255.         .ai-toast {
  256.             position: fixed;
  257.             top: 20px;
  258.             left: 50%;
  259.             transform: translateX(-50%);
  260.             padding: 10px 20px;
  261.             background: rgba(0, 0, 0, 0.8);
  262.             color: white;
  263.             border-radius: 4px;
  264.             font-size: 14px;
  265.             z-index: 10000;
  266.             animation: fadeInOut 3s ease;
  267.             pointer-events: none;
  268.             white-space: pre-line;
  269.             text-align: center;
  270.             max-width: 80%;
  271.             box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  272.         }
  273.         @keyframes fadeInOut {
  274.             0% { opacity: 0; transform: translate(-50%, 10px); }
  275.             10% { opacity: 1; transform: translate(-50%, 0); }
  276.             90% { opacity: 1; transform: translate(-50%, 0); }
  277.             100% { opacity: 0; transform: translate(-50%, -10px); }
  278.         }
  279.         .ai-config-modal .button-group {
  280.             display: flex;
  281.             justify-content: flex-end;
  282.             gap: 10px;
  283.             margin-top: 20px;
  284.         }
  285.         .ai-config-modal .button-group button {
  286.             padding: 6px 16px;
  287.             border: none;
  288.             border-radius: 4px;
  289.             cursor: pointer;
  290.             font-size: 14px;
  291.             transition: background-color 0.2s;
  292.         }
  293.         .ai-config-modal .save-button {
  294.             background: #007bff;
  295.             color: white;
  296.         }
  297.         .ai-config-modal .save-button:hover {
  298.             background: #0056b3;
  299.         }
  300.         .ai-config-modal .save-button:disabled {
  301.             background: #cccccc;
  302.             cursor: not-allowed;
  303.         }
  304.         .ai-config-modal .cancel-button {
  305.             background: #f8f9fa;
  306.             color: #333;
  307.         }
  308.         .ai-config-modal .cancel-button:hover {
  309.             background: #e2e6ea;
  310.         }
  311.         .ai-selecting-image {
  312.             cursor: crosshair !important;
  313.         }
  314.         .ai-selecting-image * {
  315.             cursor: crosshair !important;
  316.         }
  317.         .ai-image-description {
  318.             position: fixed;
  319.             background: rgba(0, 0, 0, 0.8);
  320.             color: white;
  321.             padding: 8px 12px;
  322.             border-radius: 4px;
  323.             font-size: 14px;
  324.             line-height: 1.4;
  325.             max-width: 300px;
  326.             text-align: center;
  327.             word-wrap: break-word;
  328.             z-index: 10000;
  329.             pointer-events: none;
  330.             animation: fadeIn 0.3s ease;
  331.             box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  332.         }
  333.         @keyframes fadeIn {
  334.             from { opacity: 0; }
  335.             to { opacity: 1; }
  336.         }
  337.         .ai-modal-overlay {
  338.             position: fixed;
  339.             top: 0;
  340.             left: 0;
  341.             width: 100%;
  342.             height: 100%;
  343.             background: rgba(0, 0, 0, 0.5);
  344.             display: flex;
  345.             justify-content: center;
  346.             align-items: center;
  347.             z-index: 9999;
  348.         }
  349.         .ai-result-modal {
  350.             position: fixed;
  351.             top: 50%;
  352.             left: 50%;
  353.             transform: translate(-50%, -50%);
  354.             background: white;
  355.             padding: 20px;
  356.             border-radius: 8px;
  357.             box-shadow: 0 2px 10px rgba(0,0,0,0.1);
  358.             z-index: 1000000;
  359.             max-width: 80%;
  360.             max-height: 80vh;
  361.             overflow-y: auto;
  362.         }
  363.         .ai-result-modal .result-content {
  364.             position: relative;
  365.         }
  366.         .ai-result-modal .description-code {
  367.             background: #1e1e1e;
  368.             color: #ffffff;
  369.             padding: 6px;
  370.             border-radius: 4px;
  371.             margin: 5px 0;
  372.             cursor: pointer;
  373.             white-space: pre-line;
  374.             word-wrap: break-word;
  375.             font-family: monospace;
  376.             border: 1px solid #333;
  377.             position: relative;
  378.             max-height: 500px;
  379.             overflow-y: auto;
  380.             font-size: 12px;
  381.             line-height: 1.2;
  382.         }
  383.         .ai-result-modal .description-code * {
  384.             color: #ffffff !important;
  385.             background: transparent !important;
  386.         }
  387.         .ai-result-modal .description-code code {
  388.             display: block;
  389.             width: 100%;
  390.             white-space: pre-line;
  391.             line-height: 1.2;
  392.         }
  393.         .ai-result-modal .description-code:hover {
  394.             background: #2d2d2d;
  395.         }
  396.         .ai-result-modal .copy-hint {
  397.             font-size: 12px;
  398.             color: #666;
  399.             text-align: center;
  400.             margin-top: 5px;
  401.         }
  402.         .ai-result-modal .close-button {
  403.             position: absolute;
  404.             top: -10px;
  405.             right: -10px;
  406.             width: 24px;
  407.             height: 24px;
  408.             border-radius: 50%;
  409.             background: #ff4444;
  410.             color: white;
  411.             border: none;
  412.             cursor: pointer;
  413.             display: flex;
  414.             align-items: center;
  415.             justify-content: center;
  416.             font-size: 16px;
  417.             line-height: 1;
  418.             padding: 0;
  419.         }
  420.         .ai-result-modal .close-button:hover {
  421.             background: #ff6666;
  422.         }
  423.         .ai-result-modal .balance-info {
  424.             font-size: 9px;
  425.             color: #666;
  426.             text-align: right;
  427.             margin-top: 3px;
  428.             padding-top: 3px;
  429.             border-top: 1px solid #eee;
  430.         }
  431.         /* 移动端样式优化 */
  432.         @media (max-width: 768px) {
  433.             .ai-floating-btn {
  434.                 width: 40px;
  435.                 height: 40px;
  436.                 touch-action: none; /* 防止触屏滚动 */
  437.             }
  438.             
  439.             .ai-floating-btn svg {
  440.                 width: 24px;
  441.                 height: 24px;
  442.             }
  443.             
  444.             .ai-config-modal {
  445.                 width: 90%;
  446.                 min-width: auto;
  447.                 max-width: 400px;
  448.                 padding: 15px;
  449.                 margin: 10px;
  450.                 box-sizing: border-box;
  451.             }
  452.             
  453.             .ai-config-modal .button-group {
  454.                 margin-top: 15px;
  455.                 flex-direction: row;
  456.                 justify-content: space-between;
  457.                 gap: 10px;
  458.             }
  459.  
  460.             .ai-config-modal .button-group button {
  461.                 flex: 1;
  462.                 min-height: 44px; /* 增加按钮高度，更容易点击 */
  463.                 font-size: 16px;
  464.                 padding: 10px;
  465.                 margin: 0;
  466.             }
  467.             
  468.             .ai-result-modal {
  469.                 width: 95%;
  470.                 min-width: auto;
  471.                 max-width: 90%;
  472.                 margin: 10px;
  473.                 padding: 15px;
  474.             }
  475.  
  476.             .ai-modal-overlay {
  477.                 padding: 10px;
  478.                 box-sizing: border-box;
  479.             }
  480.  
  481.             /* 确保模态框内的所有可点击元素都有足够的点击区域 */
  482.             .ai-config-modal button,
  483.             .ai-config-modal .input-icon,
  484.             .ai-config-modal select,
  485.             .ai-config-modal input {
  486.                 min-height: 44px;
  487.                 padding: 10px;
  488.                 font-size: 16px;
  489.             }
  490.  
  491.             .ai-config-modal textarea {
  492.                 min-height: 100px;
  493.                 font-size: 16px;
  494.                 padding: 10px;
  495.             }
  496.  
  497.             .ai-config-modal .input-icon {
  498.                 width: 44px;
  499.                 height: 44px;
  500.                 font-size: 20px;
  501.             }
  502.  
  503.             /* 修复移动端的滚动问题 */
  504.             .ai-config-modal {
  505.                 max-height: 90vh;
  506.                 overflow-y: auto;
  507.                 -webkit-overflow-scrolling: touch;
  508.             }
  509.         }
  510.     `);
  511.  
  512.     // 密码显示切换功能
  513.     function togglePassword(element) {
  514.         const input = element.parentElement.querySelector('input');
  515.         if (input.type === 'password') {
  516.             input.type = 'text';
  517.             element.textContent = '👁️🗨️';
  518.         } else {
  519.             input.type = 'password';
  520.             element.textContent = '👁️';
  521.         }
  522.     }
  523.  
  524.     // 检查API配置并获取可用模型
  525.     async function checkApiAndGetModels(apiEndpoint, apiKey) {
  526.         try {
  527.             const response = await fetch(`${apiEndpoint}/v1/models`, {
  528.                 method: 'GET',
  529.                 headers: {
  530.                     'Authorization': `Bearer ${apiKey}`,
  531.                     'Content-Type': 'application/json'
  532.                 }
  533.             });
  534.  
  535.             if (!response.ok) {
  536.                 throw new Error(`HTTP error! status: ${response.status}`);
  537.             }
  538.  
  539.             const result = await response.json();
  540.             if (result.data && Array.isArray(result.data)) {
  541.                 // 过滤出多模态模型
  542.                 const multimodalModels = result.data
  543.                     .filter(model => model.id.includes('vision') || model.id.includes('gpt-4-v'))
  544.                     .map(model => ({
  545.                         id: model.id,
  546.                         name: model.id
  547.                     }));
  548.                 return multimodalModels;
  549.             } else {
  550.                 throw new Error('Invalid response format');
  551.             }
  552.         } catch (error) {
  553.             console.error('Error fetching models:', error);
  554.             throw error;
  555.         }
  556.     }
  557.  
  558.     // 检查API配置
  559.     async function checkApiConfig() {
  560.         const apiEndpoint = GM_getValue('apiEndpoint', '').trim();
  561.         const apiKey = GM_getValue('apiKey', '').trim();
  562.         const selectedModel = GM_getValue('selectedModel', '').trim();
  563.  
  564.         if (!apiEndpoint || !apiKey || !selectedModel) {
  565.             alert('请先配置API Endpoint、API Key和模型');
  566.             showConfigModal();
  567.             return false;
  568.         }
  569.  
  570.         try {
  571.             // 如果是智谱AI的endpoint,跳过API检查
  572.             if(apiEndpoint.includes('bigmodel.cn')) {
  573.                 return true;
  574.             }
  575.  
  576.             // 其他endpoint进行API检查
  577.             const models = await checkApiAndGetModels(apiEndpoint, apiKey);
  578.             if (models.length === 0) {
  579.                 alert('无法获取可用模型列表，请检查API配置是否正确');
  580.                 return false;
  581.             }
  582.             return true;
  583.         } catch (error) {
  584.             console.error('Error checking API config:', error);
  585.             alert('API配置验证失败，请检查配置是否正确');
  586.             return false;
  587.         }
  588.     }
  589.  
  590.     // 获取图片的Base64内容
  591.     async function getImageBase64(imageUrl) {
  592.         console.log('[Debug] Starting image to Base64 conversion for:', imageUrl);
  593.         
  594.         // 尝试HTTP URL换为HTTPS
  595.         if (imageUrl.startsWith('http:')) {
  596.             imageUrl = imageUrl.replace('http:', 'https:');
  597.             console.log('[Debug] Converted to HTTPS URL:', imageUrl);
  598.         }
  599.  
  600.         // 获取图片的多种方法
  601.         async function tryFetchImage(method) {
  602.             return new Promise((resolve, reject) => {
  603.                 switch(method) {
  604.                     case 'direct':
  605.                         // 直接请求
  606.                         GM_xmlhttpRequest({
  607.                             method: 'GET',
  608.                             url: imageUrl,
  609.                             responseType: 'blob',
  610.                             headers: {
  611.                                 'Accept': 'image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8',
  612.                                 'Accept-Language': 'zh-CN,zh;q=0.9,en;q=0.8',
  613.                                 'Cache-Control': 'no-cache',
  614.                                 'Pragma': 'no-cache',
  615.                                 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36'
  616.                             },
  617.                             anonymous: true,
  618.                             onload: response => resolve(response),
  619.                             onerror: error => reject(error)
  620.                         });
  621.                         break;
  622.  
  623.                     case 'withReferer':
  624.                         // 带原始Referer的请求
  625.                         GM_xmlhttpRequest({
  626.                             method: 'GET',
  627.                             url: imageUrl,
  628.                             responseType: 'blob',
  629.                             headers: {
  630.                                 'Accept': 'image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8',
  631.                                 'Accept-Language': 'zh-CN,zh;q=0.9,en;q=0.8',
  632.                                 'Cache-Control': 'no-cache',
  633.                                 'Pragma': 'no-cache',
  634.                                 'Referer': new URL(imageUrl).origin,
  635.                                 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36'
  636.                             },
  637.                             anonymous: true,
  638.                             onload: response => resolve(response),
  639.                             onerror: error => reject(error)
  640.                         });
  641.                         break;
  642.  
  643.                     case 'proxy':
  644.                         // 通过代理服务获取
  645.                         const proxyUrl = `https://images.weserv.nl/?url=${encodeURIComponent(imageUrl)}`;
  646.                         GM_xmlhttpRequest({
  647.                             method: 'GET',
  648.                             url: proxyUrl,
  649.                             responseType: 'blob',
  650.                             headers: {
  651.                                 'Accept': 'image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8',
  652.                                 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36'
  653.                             },
  654.                             anonymous: true,
  655.                             onload: response => resolve(response),
  656.                             onerror: error => reject(error)
  657.                         });
  658.                         break;
  659.  
  660.                     case 'corsProxy':
  661.                         // 通过CORS代理获取
  662.                         const corsProxyUrl = `https://corsproxy.io/?${encodeURIComponent(imageUrl)}`;
  663.                         GM_xmlhttpRequest({
  664.                             method: 'GET',
  665.                             url: corsProxyUrl,
  666.                             responseType: 'blob',
  667.                             headers: {
  668.                                 'Accept': 'image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8',
  669.                                 'Origin': window.location.origin
  670.                             },
  671.                             anonymous: true,
  672.                             onload: response => resolve(response),
  673.                             onerror: error => reject(error)
  674.                         });
  675.                         break;
  676.                 }
  677.             });
  678.         }
  679.  
  680.         // 处理响应
  681.         async function handleResponse(response) {
  682.             if (response.status === 200) {
  683.                 const blob = response.response;
  684.                 console.log('[Debug] Image blob size:', blob.size, 'bytes');
  685.                 
  686.                 return new Promise((resolve, reject) => {
  687.                     const reader = new FileReader();
  688.                     reader.onloadend = () => {
  689.                         const base64 = reader.result.split(',')[1];
  690.                         console.log('[Debug] Base64 conversion completed, length:', base64.length);
  691.                         resolve(base64);
  692.                     };
  693.                     reader.onerror = error => reject(error);
  694.                     reader.readAsDataURL(blob);
  695.                 });
  696.             }
  697.             throw new Error(`Failed with status: ${response.status}`);
  698.         }
  699.  
  700.         // 依次尝试不同的方法
  701.         const methods = ['direct', 'withReferer', 'proxy', 'corsProxy'];
  702.         for (const method of methods) {
  703.             try {
  704.                 console.log(`[Debug] Trying method: ${method}`);
  705.                 const response = await tryFetchImage(method);
  706.                 if (response.status === 200) {
  707.                     return await handleResponse(response);
  708.                 }
  709.                 console.log(`[Debug] Method ${method} failed with status:`, response.status);
  710.             } catch (error) {
  711.                 console.log(`[Debug] Method ${method} failed:`, error);
  712.             }
  713.         }
  714.  
  715.         throw new Error('All methods to fetch image failed');
  716.     }
  717.  
  718.     // 调用API获取图片描述
  719.     async function getImageDescription(imageUrl, apiEndpoint, apiKey, selectedModel) {
  720.         console.log('[Debug] Starting image description request:', {
  721.             apiEndpoint,
  722.             selectedModel,
  723.             imageUrl,
  724.             timestamp: new Date().toISOString()
  725.         });
  726.  
  727.         try {
  728.             // 获取所有API Keys
  729.             const apiKeys = apiKey.split('\n').filter(key => key.trim() !== '');
  730.             if (apiKeys.length === 0) {
  731.                 throw new Error('No valid API keys available');
  732.             }
  733.  
  734.             // 使用第一个key
  735.             const currentKey = apiKeys[0];
  736.  
  737.             const base64Image = await getImageBase64(imageUrl);
  738.             console.log('[Debug] Image converted to base64, length:', base64Image.length);
  739.  
  740.             // 退出选择图片模式
  741.             exitImageSelectionMode();
  742.             
  743.             const timeout = 30000; // 30秒超时
  744.             const controller = new AbortController();
  745.             const timeoutId = setTimeout(() => controller.abort(), timeout);
  746.             
  747.             const imageSize = base64Image.length * 0.75; // 转换为字节数
  748.             
  749.             // 获取当前余额
  750.             const userInfo = await checkUserInfo(apiEndpoint, currentKey);
  751.             const currentBalance = userInfo.totalBalance;
  752.             
  753.             // 计算每次调用的预估花费（根据图片大小和模型）
  754.             const costPerCall = calculateCost(imageSize, selectedModel);
  755.             
  756.             // 计算识别的剩余图片量
  757.             const remainingImages = Math.floor(currentBalance / costPerCall);
  758.  
  759.             // 根据不同的API构建不同的请求体和endpoint
  760.             let requestBody;
  761.             let finalEndpoint;
  762.  
  763.             if(selectedModel.startsWith('glm-')) {
  764.                 // GLM系列模型的请求格式
  765.                 requestBody = {
  766.                     model: selectedModel,
  767.                     messages: [{
  768.                         role: "user",
  769.                         content: [{
  770.                             type: "text",
  771.                             text: "请描述这张图片的主要内容。如果是人物图片,请至少用15个字描述人物。"
  772.                         }, {
  773.                             type: "image_url",
  774.                             image_url: {
  775.                                 url: `data:image/jpeg;base64,${base64Image}`
  776.                             }
  777.                         }]
  778.                     }],
  779.                     stream: true
  780.                 };
  781.                 finalEndpoint = 'https://open.bigmodel.cn/api/paas/v4/chat/completions';
  782.             } else {
  783.                 // 原有模型的请求格式
  784.                 requestBody = {
  785.                     model: selectedModel,
  786.                     messages: [{
  787.                         role: "user",
  788.                         content: [
  789.                             {
  790.                                 type: "image_url",
  791.                                 image_url: {
  792.                                     url: `data:image/jpeg;base64,${base64Image}`
  793.                                 }
  794.                             },
  795.                             {
  796.                                 type: "text",
  797.                                 text: "Describe the main content of the image. If there is a person, provide a description of the person with some beautiful words. Answer in Chinese."
  798.                             }
  799.                         ]
  800.                     }],
  801.                     stream: true
  802.                 };
  803.                 finalEndpoint = `${apiEndpoint}/chat/completions`;
  804.             }
  805.  
  806.             console.log('[Debug] API Request body:', JSON.stringify(requestBody, null, 2));
  807.  
  808.             console.log('[Debug] Sending request to:', finalEndpoint);
  809.             console.log('[Debug] Request headers:', {
  810.                 'Authorization': 'Bearer ***' + currentKey.slice(-4),
  811.                 'Content-Type': 'application/json'
  812.             });
  813.             console.log('[Debug] Request body:', requestBody);
  814.  
  815.             return new Promise((resolve, reject) => {
  816.                 GM_xmlhttpRequest({
  817.                     method: 'POST',
  818.                     url: finalEndpoint,
  819.                     headers: {
  820.                         'Authorization': `Bearer ${currentKey}`,
  821.                         'Content-Type': 'application/json'
  822.                     },
  823.                     data: JSON.stringify(requestBody),
  824.                     onload: async function(response) {
  825.                         console.log('[Debug] Response received:', {
  826.                             status: response.status,
  827.                             statusText: response.statusText,
  828.                             headers: response.responseHeaders
  829.                         });
  830.  
  831.                         if (response.status === 200) {
  832.                             try {
  833.                                 let description = '';
  834.                                 const lines = response.responseText.split('\n').filter(line => line.trim() !== '');
  835.                                 
  836.                                 for (const line of lines) {
  837.                                     if (line.startsWith('data: ')) {
  838.                                         const jsonStr = line.slice(6);
  839.                                         if (jsonStr === '[DONE]') continue;
  840.                                         
  841.                                         try {
  842.                                             const jsonData = JSON.parse(jsonStr);
  843.                                             console.log('[Debug] Parsed chunk:', jsonData);
  844.                                             
  845.                                             const content = jsonData.choices[0]?.delta?.content;
  846.                                             if (content) {
  847.                                                 description += content;
  848.                                                 console.log('[Debug] Current description:', description);
  849.                                             }
  850.                                         } catch (e) {
  851.                                             console.error('[Debug] Error parsing chunk JSON:', e);
  852.                                         }
  853.                                     }
  854.                                 }
  855.  
  856.                                 console.log('[Debug] Final description:', description);
  857.                                 removeDescriptionTooltip();
  858.                                 const balanceInfo = `剩余额度为：${currentBalance.toFixed(4)}，大约还可以识别 ${remainingImages} 张图片`;
  859.                                 showDescriptionModal(description, balanceInfo);
  860.                                 resolve(description);
  861.                             } catch (error) {
  862.                                 console.error('[Debug] Error processing response:', error);
  863.                                 reject(error);
  864.                             }
  865.                         } else {
  866.                             console.error('[Debug] Error response:', {
  867.                                 status: response.status,
  868.                                 statusText: response.statusText,
  869.                                 response: response.responseText
  870.                             });
  871.  
  872.                             // 检查是否是余额不足错误
  873.                             try {
  874.                                 const errorResponse = JSON.parse(response.responseText);
  875.                                 if (errorResponse.code === 30001 || 
  876.                                     (errorResponse.message && errorResponse.message.includes('insufficient'))) {
  877.                                     showToast('当前key余不足，正在检测其他key...');
  878.                                     // 自动运行一次key检测
  879.                                     await checkAndUpdateKeys();
  880.                                     // 重新获取更新后的key
  881.                                     const newApiKeys = GM_getValue('apiKey', '').split('\n').filter(key => key.trim() !== '');
  882.                                     if (newApiKeys.length > 0) {
  883.                                         // 使用新的key重试
  884.                                         getImageDescription(imageUrl, apiEndpoint, newApiKeys.join('\n'), selectedModel)
  885.                                             .then(resolve)
  886.                                             .catch(reject);
  887.                                         return;
  888.                                     }
  889.                                 }
  890.                             } catch (e) {
  891.                                 console.error('[Debug] Error parsing error response:', e);
  892.                             }
  893.                             
  894.                             reject(new Error(`Request failed with status ${response.status}`));
  895.                         }
  896.                     },
  897.                     onerror: function(error) {
  898.                         console.error('[Debug] Request error:', error);
  899.                         reject(error);
  900.                     },
  901.                     onprogress: function(progress) {
  902.                         // 用于处理流式响应的进度
  903.                         console.log('[Debug] Progress:', progress);
  904.                         
  905.                         try {
  906.                             const lines = progress.responseText.split('\n').filter(line => line.trim() !== '');
  907.                             let latestContent = '';
  908.                             
  909.                             for (const line of lines) {
  910.                                 if (line.startsWith('data: ')) {
  911.                                     const jsonStr = line.slice(6);
  912.                                     if (jsonStr === '[DONE]') continue;
  913.                                     
  914.                                     try {
  915.                                         const jsonData = JSON.parse(jsonStr);
  916.                                         const content = jsonData.choices[0]?.delta?.content;
  917.                                         if (content) {
  918.                                             latestContent += content;
  919.                                         }
  920.                                     } catch (e) {
  921.                                         console.error('[Debug] Error parsing progress JSON:', e);
  922.                                     }
  923.                                 }
  924.                             }
  925.                             
  926.                             if (latestContent) {
  927.                                 updateDescriptionTooltip('正在生成描述: ' + latestContent);
  928.                             }
  929.                         } catch (error) {
  930.                             console.error('[Debug] Error processing progress:', error);
  931.                         }
  932.                     }
  933.                 });
  934.             });
  935.         } catch (error) {
  936.             if (error.name === 'AbortError') {
  937.                 showToast('请求超时，请重试');
  938.             }
  939.             removeDescriptionTooltip();
  940.             console.error('[Debug] Error in getImageDescription:', {
  941.                 error,
  942.                 stack: error.stack,
  943.                 timestamp: new Date().toISOString()
  944.             });
  945.             throw error;
  946.         }
  947.     }
  948.  
  949.     // 显示描述tooltip
  950.     function showDescriptionTooltip(description) {
  951.         const tooltip = document.createElement('div');
  952.         tooltip.className = 'ai-image-description';
  953.         tooltip.textContent = description;
  954.         
  955.         // 获取视口宽度
  956.         const viewportWidth = window.innerWidth || document.documentElement.clientWidth;
  957.         
  958.         // 计算tooltip位置（水平居中，距顶部20px��
  959.         const tooltipX = Math.max(0, (viewportWidth - 300) / 2); // 300是tooltip的max-width
  960.         
  961.         tooltip.style.position = 'fixed';
  962.         tooltip.style.left = `${tooltipX}px`;
  963.         tooltip.style.top = '20px';
  964.         
  965.         document.body.appendChild(tooltip);
  966.  
  967.         // 添加动态点的动画
  968.         let dots = 1;
  969.         const updateInterval = setInterval(() => {
  970.             if (!document.body.contains(tooltip)) {
  971.                 clearInterval(updateInterval);
  972.                 return;
  973.             }
  974.             dots = dots % 6 + 1;
  975.             tooltip.textContent = '正在生成描述' + '.'.repeat(dots);
  976.         }, 500); // 每500ms更新一次
  977.  
  978.         return tooltip;
  979.     }
  980.  
  981.     // 更新描述tooltip内容
  982.     function updateDescriptionTooltip(description) {
  983.         const tooltip = document.querySelector('.ai-image-description');
  984.         if (tooltip) {
  985.             tooltip.textContent = description;
  986.         }
  987.     }
  988.  
  989.     // 移除描述tooltip
  990.     function removeDescriptionTooltip() {
  991.         const tooltip = document.querySelector('.ai-image-description');
  992.         if (tooltip) {
  993.             tooltip.remove();
  994.         }
  995.     }
  996.  
  997.     // 在全局变量部分添加日志函数
  998.     function log(message, data = null) {
  999.         const timestamp = new Date().toISOString();
  1000.         if (data) {
  1001.             console.log(`[AI Image] ${timestamp} ${message}:`, data);
  1002.         } else {
  1003.             console.log(`[AI Image] ${timestamp} ${message}`);
  1004.         }
  1005.     }
  1006.  
  1007.     // 修改 findImage 函数，增强图片元素检测能力
  1008.     function findImage(target) {
  1009.         let img = null;
  1010.         let imgSrc = null;
  1011.  
  1012.         // 检查是否为图片元素
  1013.         if (target.nodeName === 'IMG') {
  1014.             img = target;
  1015.             // 优先获取 data-src（懒加载原图）
  1016.             imgSrc = target.getAttribute('data-src') ||
  1017.                      target.getAttribute('data-original') ||
  1018.                      target.getAttribute('data-actualsrc') ||
  1019.                      target.getAttribute('data-url') ||
  1020.                      target.getAttribute('data-echo') ||
  1021.                      target.getAttribute('data-lazy-src') ||
  1022.                      target.getAttribute('data-original-src') ||
  1023.                      target.src;  // 最后才使用 src 属性
  1024.         }
  1025.         // 检查背景图
  1026.         else if (target.style && target.style.backgroundImage) {
  1027.             let bgImg = target.style.backgroundImage.match(/url\(['"]?([^'"]+)['"]?\)/);
  1028.             if (bgImg) {
  1029.                 imgSrc = bgImg[1];
  1030.                 img = target;
  1031.             }
  1032.         }
  1033.         // 检查父元素的背景图
  1034.         else {
  1035.             let parent = target.parentElement;
  1036.             if (parent && parent.style && parent.style.backgroundImage) {
  1037.                 let bgImg = parent.style.backgroundImage.match(/url\(['"]?([^'"]+)['"]?\)/);
  1038.                 if (bgImg) {
  1039.                     imgSrc = bgImg[1];
  1040.                     img = parent;
  1041.                 }
  1042.             }
  1043.         }
  1044.  
  1045.         // 检查常见的图片容器
  1046.         if (!img) {
  1047.             // 检查父元素是否为图片容器
  1048.             let imgWrapper = target.closest('[class*="img"],[class*="photo"],[class*="image"],[class*="thumb"],[class*="avatar"],[class*="masonry"]');
  1049.             if (imgWrapper) {
  1050.                 // 在容器中查找图片元素
  1051.                 let possibleImg = imgWrapper.querySelector('img');
  1052.                 if (possibleImg) {
  1053.                     img = possibleImg;
  1054.                     // 同样优先获取懒加载原图
  1055.                     imgSrc = possibleImg.getAttribute('data-src') ||
  1056.                             possibleImg.getAttribute('data-original') ||
  1057.                             possibleImg.getAttribute('data-actualsrc') ||
  1058.                             possibleImg.getAttribute('data-url') ||
  1059.                             possibleImg.getAttribute('data-echo') ||
  1060.                             possibleImg.getAttribute('data-lazy-src') ||
  1061.                             possibleImg.getAttribute('data-original-src') ||
  1062.                             possibleImg.src;
  1063.                 } else {
  1064.                     // 检查容器的背景图
  1065.                     let bgImg = getComputedStyle(imgWrapper).backgroundImage.match(/url\(['"]?([^'"]+)['"]?\)/);
  1066.                     if (bgImg) {
  1067.                         imgSrc = bgImg[1];
  1068.                         img = imgWrapper;
  1069.                     }
  1070.                 }
  1071.             }
  1072.         }
  1073.  
  1074.         // 检查特殊情况：某些网站使用自定义属性存储真实图片地址
  1075.         if (img && !imgSrc) {
  1076.             // 获取元素的所有属性
  1077.             const attrs = img.attributes;
  1078.             for (let i = 0; i < attrs.length; i++) {
  1079.                 const attr = attrs[i];
  1080.                 // 检查属性名中是否包含关键字
  1081.                 if (attr.name.toLowerCase().includes('src') ||
  1082.                     attr.name.toLowerCase().includes('url') ||
  1083.                     attr.name.toLowerCase().includes('img') ||
  1084.                     attr.name.toLowerCase().includes('thumb') ||
  1085.                     attr.name.toLowerCase().includes('original') ||
  1086.                     attr.name.toLowerCase().includes('data')) {
  1087.                     const value = attr.value;
  1088.                     if (value && /^https?:\/\//.test(value)) {
  1089.                         imgSrc = value;
  1090.                         break;
  1091.                     }
  1092.                 }
  1093.             }
  1094.         }
  1095.  
  1096.         // 检查父级链接
  1097.         if (img && !imgSrc) {
  1098.             let parentLink = img.closest('a');
  1099.             if (parentLink && parentLink.href) {
  1100.                 if (/\.(jpe?g|png|webp|gif)$/i.test(parentLink.href)) {
  1101.                     imgSrc = parentLink.href;
  1102.                 }
  1103.             }
  1104.         }
  1105.  
  1106.         // 如果找到了图片但没有找到有效的 URL，记录日志
  1107.         if (img && !imgSrc) {
  1108.             log('找到图片元素但未找到有效的图片URL', {
  1109.                 element: img,
  1110.                 attributes: Array.from(img.attributes).map(attr => `${attr.name}="${attr.value}"`).join(', ')
  1111.             });
  1112.         }
  1113.  
  1114.         return { img, imgSrc };
  1115.     }
  1116.  
  1117.     // 修改点击处理函数
  1118.     function clickHandler(e) {
  1119.         if (!isSelectionMode) return;
  1120.  
  1121.         const { img, imgSrc } = findImage(e.target);
  1122.  
  1123.         if (!img || !imgSrc) return;
  1124.  
  1125.         e.preventDefault();
  1126.         e.stopPropagation();
  1127.  
  1128.         // 检查图片是否有效
  1129.         if (img instanceof HTMLImageElement) {
  1130.             if (!img.complete || !img.naturalWidth) {
  1131.                 showToast('图片未加载完成或无效');
  1132.                 return;
  1133.             }
  1134.             if (img.naturalWidth < 10 || img.naturalHeight < 10) {
  1135.                 showToast('图片太小，无法处理');
  1136.                 return;
  1137.             }
  1138.         }
  1139.  
  1140.         // 开始处理图片
  1141.         getImageDescription(imgSrc);
  1142.     }
  1143.  
  1144.     // 进入图片选择模式
  1145.     function enterImageSelectionMode() {
  1146.         console.log('[Debug] Entering image selection mode');
  1147.         if(isSelectionMode) return; // 防止重复进入选择模式
  1148.         
  1149.         isSelectionMode = true;
  1150.  
  1151.         // 隐藏悬浮按钮
  1152.         const floatingBtn = document.querySelector('.ai-floating-btn');
  1153.         if(floatingBtn) {
  1154.             floatingBtn.style.display = 'none';
  1155.         }
  1156.  
  1157.         // 创建遮罩层
  1158.         const overlay = document.createElement('div');
  1159.         overlay.className = 'ai-selection-overlay';
  1160.         document.body.appendChild(overlay);
  1161.         
  1162.         // 添加选择状态的类名
  1163.         document.body.classList.add('ai-selecting-image');
  1164.  
  1165.         // 创建点击事件处理函数
  1166.         const clickHandler = async function(e) {
  1167.             if (!isSelectionMode) return;
  1168.  
  1169.             if (e.target.tagName === 'IMG') {
  1170.                 console.log('[Debug] Image clicked:', e.target.src);
  1171.                 e.preventDefault();
  1172.                 e.stopPropagation();
  1173.                 
  1174.                 // 获取配置
  1175.                 const endpoint = GM_getValue('apiEndpoint', '');
  1176.                 const apiKey = GM_getValue('apiKey', '');
  1177.                 const selectedModel = GM_getValue('selectedModel', '');
  1178.  
  1179.                 console.log('[Debug] Current configuration:', {
  1180.                     endpoint,
  1181.                     selectedModel,
  1182.                     hasApiKey: !!apiKey
  1183.                 });
  1184.  
  1185.                 if (!endpoint || !apiKey || !selectedModel) {
  1186.                     showToast('请先配置API配置');
  1187.                     exitImageSelectionMode();
  1188.                     return;
  1189.                 }
  1190.  
  1191.                 // 显示加载中的tooltip
  1192.                 showDescriptionTooltip('正在生成描述...');
  1193.  
  1194.                 try {
  1195.                     await getImageDescription(e.target.src, endpoint, apiKey, selectedModel);
  1196.                 } catch (error) {
  1197.                     console.error('[Debug] Description generation failed:', error);
  1198.                     removeDescriptionTooltip();
  1199.                     showToast('生成描述失败: ' + error.message);
  1200.                 }
  1201.             }
  1202.         };
  1203.  
  1204.         // 添加点击事件监听器
  1205.         document.addEventListener('click', clickHandler, true);
  1206.         
  1207.         // ESC键退选择模式
  1208.         const escHandler = (e) => {
  1209.             if (e.key === 'Escape') {
  1210.                 exitImageSelectionMode();
  1211.             }
  1212.         };
  1213.         document.addEventListener('keydown', escHandler);
  1214.  
  1215.         // 保存事件理函数以便后续移除
  1216.         window._imageSelectionHandlers = {
  1217.             click: clickHandler,
  1218.             keydown: escHandler
  1219.         };
  1220.     }
  1221.  
  1222.     // 退出图片选择模式
  1223.     function exitImageSelectionMode() {
  1224.         console.log('[Debug] Exiting image selection mode');
  1225.         isSelectionMode = false;
  1226.  
  1227.         // 显示悬浮按钮
  1228.         const floatingBtn = document.querySelector('.ai-floating-btn');
  1229.         if(floatingBtn) {
  1230.             floatingBtn.style.display = 'flex';
  1231.         }
  1232.  
  1233.         // 移除遮罩层
  1234.         const overlay = document.querySelector('.ai-selection-overlay');
  1235.         if (overlay) {
  1236.             overlay.remove();
  1237.         }
  1238.  
  1239.         // 移除选择状态的类名
  1240.         document.body.classList.remove('ai-selecting-image');
  1241.  
  1242.         // 移除所有事件监听器
  1243.         if (window._imageSelectionHandlers) {
  1244.             document.removeEventListener('click', window._imageSelectionHandlers.click, true);
  1245.             document.removeEventListener('keydown', window._imageSelectionHandlers.keydown);
  1246.             window._imageSelectionHandlers = null;
  1247.         }
  1248.     }
  1249.  
  1250.     // 显示toast提示
  1251.     function showToast(message, duration = 3000) {
  1252.         const toast = document.createElement('div');
  1253.         toast.className = 'ai-toast';
  1254.         toast.textContent = message;
  1255.         document.body.appendChild(toast);
  1256.         
  1257.         setTimeout(() => {
  1258.             toast.remove();
  1259.         }, duration);
  1260.     }
  1261.  
  1262.     // 检查用户信息
  1263.     async function checkUserInfo(apiEndpoint, apiKey) {
  1264.         try {
  1265.             // 对谱AI的endpoint返回默认值
  1266.             if(apiEndpoint.includes('bigmodel.cn')) {
  1267.                 const defaultUserData = {
  1268.                     name: 'GLM User',
  1269.                     balance: 1000,  // 默认余额
  1270.                     chargeBalance: 0,
  1271.                     totalBalance: 1000
  1272.                 };
  1273.                 console.log('[Debug] Using default user data for GLM:', defaultUserData);
  1274.                 return defaultUserData;
  1275.             }
  1276.  
  1277.             // 其他endpoint使用原有逻辑
  1278.             return new Promise((resolve, reject) => {
  1279.                 console.log('[Debug] Sending user info request to:', `${apiEndpoint}/v1/user/info`);
  1280.                 GM_xmlhttpRequest({
  1281.                     method: 'GET',
  1282.                     url: `${apiEndpoint}/v1/user/info`,
  1283.                     headers: {
  1284.                         'Authorization': `Bearer ${apiKey}`,
  1285.                         'Content-Type': 'application/json'
  1286.                     },
  1287.                     onload: function(response) {
  1288.                         console.log('[Debug] User Info Raw Response:', {
  1289.                             status: response.status,
  1290.                             statusText: response.statusText,
  1291.                             responseText: response.responseText,
  1292.                             headers: response.responseHeaders
  1293.                         });
  1294.  
  1295.                         if (response.status === 200) {
  1296.                             try {
  1297.                                 const result = JSON.parse(response.responseText);
  1298.                                 console.log('[Debug] User Info Parsed Response:', result);
  1299.                                 
  1300.                                 if (result.code === 20000 && result.status && result.data) {
  1301.                                     const { name, balance, chargeBalance, totalBalance } = result.data;
  1302.                                     resolve({
  1303.                                         name,
  1304.                                         balance: parseFloat(balance),
  1305.                                         chargeBalance: parseFloat(chargeBalance),
  1306.                                         totalBalance: parseFloat(totalBalance)
  1307.                                     });
  1308.                                 } else {
  1309.                                     throw new Error(result.message || 'Invalid response format');
  1310.                                 }
  1311.                             } catch (error) {
  1312.                                 console.error('[Debug] JSON Parse Error:', error);
  1313.                                 reject(error);
  1314.                             }
  1315.                         } else {
  1316.                             console.error('[Debug] HTTP Error Response:', {
  1317.                                 status: response.status,
  1318.                                 statusText: response.statusText,
  1319.                                 response: response.responseText
  1320.                             });
  1321.                             reject(new Error(`HTTP error! status: ${response.status}`));
  1322.                         }
  1323.                     },
  1324.                     onerror: function(error) {
  1325.                         console.error('[Debug] Request Error:', error);
  1326.                         reject(error);
  1327.                     }
  1328.                 });
  1329.             });
  1330.         } catch (error) {
  1331.             console.error('[Debug] User Info Error:', error);
  1332.             throw error;
  1333.         }
  1334.     }
  1335.  
  1336.     // 获取可用模型列表
  1337.     async function getAvailableModels(apiEndpoint, apiKey) {
  1338.         console.log('[Debug] Getting available models from:', apiEndpoint);
  1339.  
  1340.         try {
  1341.             // 如果是智谱AI的endpoint,直接返回GLM模型列表
  1342.             if(apiEndpoint.includes('bigmodel.cn')) {
  1343.                 const glmModels = [
  1344.                     {
  1345.                         id: 'glm-4',
  1346.                         name: 'GLM-4'
  1347.                     },
  1348.                     {
  1349.                         id: 'glm-4v',
  1350.                         name: 'GLM-4V'
  1351.                     },
  1352.                     {
  1353.                         id: 'glm-4v-flash',
  1354.                         name: 'GLM-4V-Flash'
  1355.                     }
  1356.                 ];
  1357.                 console.log('[Debug] Available GLM models:', glmModels);
  1358.                 return glmModels;
  1359.             }
  1360.  
  1361.             // 其他endpoint使用原有逻辑
  1362.             return new Promise((resolve, reject) => {
  1363.                 console.log('[Debug] Sending models request to:', `${apiEndpoint}/v1/models`);
  1364.                 GM_xmlhttpRequest({
  1365.                     method: 'GET',
  1366.                     url: `${apiEndpoint}/v1/models`,
  1367.                     headers: {
  1368.                         'Authorization': `Bearer ${apiKey}`,
  1369.                         'Content-Type': 'application/json'
  1370.                     },
  1371.                     onload: function(response) {
  1372.                         console.log('[Debug] Models API Raw Response:', {
  1373.                             status: response.status,
  1374.                             statusText: response.statusText,
  1375.                             responseText: response.responseText,
  1376.                             headers: response.responseHeaders
  1377.                         });
  1378.  
  1379.                         if (response.status === 200) {
  1380.                             try {
  1381.                                 const result = JSON.parse(response.responseText);
  1382.                                 console.log('[Debug] Models API Parsed Response:', result);
  1383.                                 
  1384.                                 if (result.object === 'list' && Array.isArray(result.data)) {
  1385.                                     const models = result.data
  1386.                                         .filter(model => supportedVLModels.includes(model.id))
  1387.                                         .map(model => ({
  1388.                                             id: model.id,
  1389.                                             name: model.id.split('/').pop()
  1390.                                                 .replace('Qwen2-VL-', 'Qwen2-')
  1391.                                                 .replace('InternVL2-Llama3-', 'InternVL2-')
  1392.                                                 .replace('-Instruct', '')
  1393.                                         }));
  1394.                                     console.log('[Debug] Filtered and processed models:', models);
  1395.                                     resolve(models);
  1396.                                 } else {
  1397.                                     console.error('[Debug] Invalid models response format:', result);
  1398.                                     reject(new Error('Invalid models response format'));
  1399.                                 }
  1400.                             } catch (error) {
  1401.                                 console.error('[Debug] JSON Parse Error:', error);
  1402.                                 reject(error);
  1403.                             }
  1404.                         } else {
  1405.                             console.error('[Debug] HTTP Error Response:', {
  1406.                                 status: response.status,
  1407.                                 statusText: response.statusText,
  1408.                                 response: response.responseText
  1409.                             });
  1410.                             reject(new Error(`HTTP error! status: ${response.status}`));
  1411.                         }
  1412.                     },
  1413.                     onerror: function(error) {
  1414.                         console.error('[Debug] Models API Request Error:', error);
  1415.                         reject(error);
  1416.                     }
  1417.                 });
  1418.             });
  1419.         } catch (error) {
  1420.             console.error('[Debug] Models API Error:', error);
  1421.             throw error;
  1422.         }
  1423.     }
  1424.  
  1425.     // 更新模型拉菜单
  1426.     function updateModelSelect(selectElement, models) {
  1427.         if (models.length === 0) {
  1428.             selectElement.innerHTML = '<option value="">未找到可用的视觉模型</option>';
  1429.             selectElement.disabled = true;
  1430.             return;
  1431.         }
  1432.  
  1433.         selectElement.innerHTML = '<option value="">请选择视觉模型</option>' +
  1434.             models.map(model => 
  1435.                 `<option value="${model.id}" title="${model.id}">${model.name}</option>`
  1436.             ).join('');
  1437.         selectElement.disabled = false;
  1438.     }
  1439.  
  1440.     // 保存模型列表到GM存储
  1441.     function saveModelList(models) {
  1442.         GM_setValue('availableModels', models);
  1443.     }
  1444.  
  1445.     // 从GM存储获取模型列表
  1446.     function getStoredModelList() {
  1447.         return GM_getValue('availableModels', []);
  1448.     }
  1449.  
  1450.     // 创建悬浮按钮
  1451.     function createFloatingButton() {
  1452.         const btn = document.createElement('div');
  1453.         btn.className = 'ai-floating-btn';
  1454.         btn.innerHTML = `
  1455.             <svg viewBox="0 0 24 24">
  1456.                 <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm0-14c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm0 10c-2.21 0-4-1.79-4-4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3 5h2c0-2.25 3-2.5 3-5 0-2.21-1.79-4-4-4z"/>
  1457.             </svg>
  1458.         `;
  1459.  
  1460.         // 设置初始位置
  1461.         const savedPos = JSON.parse(GM_getValue('btnPosition', '{"x": 20, "y": 20}'));
  1462.         btn.style.left = (savedPos.x || 20) + 'px';
  1463.         btn.style.top = (savedPos.y || 20) + 'px';
  1464.         btn.style.right = 'auto';
  1465.         btn.style.bottom = 'auto';
  1466.  
  1467.         // 自动检测key的可用性
  1468.         setTimeout(async () => {
  1469.             await checkAndUpdateKeys();
  1470.         }, 1000);
  1471.  
  1472.         let isDragging = false;
  1473.         let hasMoved = false;
  1474.         let startX, startY;
  1475.         let initialLeft, initialTop;
  1476.         let longPressTimer;
  1477.         let touchStartTime;
  1478.  
  1479.         // 触屏事件处理
  1480.         btn.addEventListener('touchstart', function(e) {
  1481.             e.preventDefault();
  1482.             touchStartTime = Date.now();
  1483.             
  1484.             // 置长按定时器
  1485.             longPressTimer = setTimeout(() => {
  1486.                 exitImageSelectionMode();
  1487.                 createConfigUI();
  1488.             }, 500); // 500ms长按触发
  1489.  
  1490.             const touch = e.touches[0];
  1491.             startX = touch.clientX;
  1492.             startY = touch.clientY;
  1493.             const rect = btn.getBoundingClientRect();
  1494.             initialLeft = rect.left;
  1495.             initialTop = rect.top;
  1496.         });
  1497.  
  1498.         btn.addEventListener('touchmove', function(e) {
  1499.             e.preventDefault();
  1500.             clearTimeout(longPressTimer); // 移动时取消长按
  1501.  
  1502.             const touch = e.touches[0];
  1503.             const deltaX = touch.clientX - startX;
  1504.             const deltaY = touch.clientY - startY;
  1505.             
  1506.             if (Math.abs(deltaX) > 5 || Math.abs(deltaY) > 5) {
  1507.                 hasMoved = true;
  1508.             }
  1509.             
  1510.             const newLeft = Math.max(0, Math.min(window.innerWidth - btn.offsetWidth, initialLeft + deltaX));
  1511.             const newTop = Math.max(0, Math.min(window.innerHeight - btn.offsetHeight, initialTop + deltaY));
  1512.             
  1513.             btn.style.left = newLeft + 'px';
  1514.             btn.style.top = newTop + 'px';
  1515.         });
  1516.  
  1517.         btn.addEventListener('touchend', function(e) {
  1518.             e.preventDefault();
  1519.             clearTimeout(longPressTimer);
  1520.             
  1521.             const touchDuration = Date.now() - touchStartTime;
  1522.             
  1523.             if (!hasMoved && touchDuration < 500) {
  1524.                 // 短按进入图片选择模式
  1525.                 enterImageSelectionMode();
  1526.             }
  1527.             
  1528.             if (hasMoved) {
  1529.                 // 保存新位置
  1530.                 const rect = btn.getBoundingClientRect();
  1531.                 GM_setValue('btnPosition', JSON.stringify({
  1532.                     x: rect.left,
  1533.                     y: rect.top
  1534.                 }));
  1535.             }
  1536.             
  1537.             hasMoved = false;
  1538.         });
  1539.  
  1540.         // 保留原有的鼠标事件处理
  1541.         btn.addEventListener('click', function(e) {
  1542.             if (e.button === 0 && !hasMoved) { // 左键点击且没有移动
  1543.                 enterImageSelectionMode();
  1544.                 e.stopPropagation();
  1545.             }
  1546.             hasMoved = false;
  1547.         });
  1548.  
  1549.         btn.addEventListener('contextmenu', function(e) {
  1550.             e.preventDefault();
  1551.             exitImageSelectionMode();
  1552.             createConfigUI();
  1553.         });
  1554.  
  1555.         // 拖拽相关事件
  1556.         function dragStart(e) {
  1557.             if (e.target === btn || btn.contains(e.target)) {
  1558.                 isDragging = true;
  1559.                 hasMoved = false;
  1560.                 const rect = btn.getBoundingClientRect();
  1561.                 startX = e.clientX;
  1562.                 startY = e.clientY;
  1563.                 initialLeft = rect.left;
  1564.                 initialTop = rect.top;
  1565.                 e.preventDefault();
  1566.             }
  1567.         }
  1568.  
  1569.         function drag(e) {
  1570.             if (isDragging) {
  1571.                 e.preventDefault();
  1572.                 const deltaX = e.clientX - startX;
  1573.                 const deltaY = e.clientY - startY;
  1574.                 
  1575.                 if (Math.abs(deltaX) > 5 || Math.abs(deltaY) > 5) {
  1576.                     hasMoved = true;
  1577.                 }
  1578.                 
  1579.                 const newLeft = Math.max(0, Math.min(window.innerWidth - btn.offsetWidth, initialLeft + deltaX));
  1580.                 const newTop = Math.max(0, Math.min(window.innerHeight - btn.offsetHeight, initialTop + deltaY));
  1581.                 
  1582.                 btn.style.left = newLeft + 'px';
  1583.                 btn.style.top = newTop + 'px';
  1584.             }
  1585.         }
  1586.  
  1587.         function dragEnd(e) {
  1588.             if (isDragging) {
  1589.                 isDragging = false;
  1590.                 const rect = btn.getBoundingClientRect();
  1591.                 GM_setValue('btnPosition', JSON.stringify({
  1592.                     x: rect.left,
  1593.                     y: rect.top
  1594.                 }));
  1595.             }
  1596.         }
  1597.  
  1598.         btn.addEventListener('mousedown', dragStart);
  1599.         document.addEventListener('mousemove', drag);
  1600.         document.addEventListener('mouseup', dragEnd);
  1601.  
  1602.         // 将按钮添加到文档中
  1603.         document.body.appendChild(btn);
  1604.         return btn;
  1605.     }
  1606.  
  1607.     // 检查并更新key列表
  1608.     async function checkAndUpdateKeys() {
  1609.         const endpoint = GM_getValue('apiEndpoint', '');
  1610.         const apiKeys = GM_getValue('apiKey', '').split('\n').filter(key => key.trim() !== '');
  1611.         
  1612.         if (endpoint && apiKeys.length > 0) {
  1613.             const validKeys = [];
  1614.             const keyBalances = new Map();
  1615.  
  1616.             for (const apiKey of apiKeys) {
  1617.                 try {
  1618.                     const userInfo = await checkUserInfo(endpoint, apiKey);
  1619.                     if (userInfo.totalBalance > 0) {
  1620.                         validKeys.push(apiKey);
  1621.                         keyBalances.set(apiKey, userInfo.totalBalance);
  1622.                     } else {
  1623.                         showToast(`${apiKey.slice(0, 8)}...可用余额为0，被移除。`);
  1624.                     }
  1625.                 } catch (error) {
  1626.                     console.error('Key check failed:', error);
  1627.                 }
  1628.             }
  1629.  
  1630.             // 按余额从小到大排序
  1631.             validKeys.sort((a, b) => keyBalances.get(a) - keyBalances.get(b));
  1632.  
  1633.             // 更新存储的key
  1634.             if (validKeys.length > 0) {
  1635.                 GM_setValue('apiKey', validKeys.join('\n'));
  1636.                 showToast(`自动检测完成，${validKeys.length}个有效key`);
  1637.             } else {
  1638.                 showToast('没有可用的API Key，请更新配置');
  1639.             }
  1640.         }
  1641.     }
  1642.  
  1643.     // 创建配置界面
  1644.     function createConfigUI() {
  1645.         // 如果已经存在配置界面，先移除
  1646.         const existingModal = document.querySelector('.ai-modal-overlay');
  1647.         if (existingModal) {
  1648.             existingModal.remove();
  1649.         }
  1650.  
  1651.         const overlay = document.createElement('div');
  1652.         overlay.className = 'ai-modal-overlay';
  1653.         
  1654.         const modal = document.createElement('div');
  1655.         modal.className = 'ai-config-modal';
  1656.         modal.innerHTML = `
  1657.             <h3>AI图像描述配置</h3>
  1658.             <div class="input-group">
  1659.                 <label>API Endpoint:</label>
  1660.                 <div class="input-wrapper">
  1661.                     <input type="text" id="ai-endpoint" placeholder="https://api.openai.com" value="${GM_getValue('apiEndpoint', '')}">
  1662.                     <span class="input-icon clear-icon" title="清空">✕</span>
  1663.                 </div>
  1664.             </div>
  1665.             <div class="input-group">
  1666.                 <label>API Key (每行一个):</label>
  1667.                 <div class="input-wrapper">
  1668.                     <textarea id="ai-apikey" rows="5" style="width: 100%; resize: vertical;">${GM_getValue('apiKey', '')}</textarea>
  1669.                     <span class="input-icon clear-icon" title="清空">✕</span>
  1670.                 </div>
  1671.                 <div class="button-row">
  1672.                     <button class="check-button" id="check-api">检测可用性</button>
  1673.                 </div>
  1674.             </div>
  1675.             <div class="input-group">
  1676.                 <label>可用模型:</label>
  1677.                 <select id="ai-model">
  1678.                     <option value="">加载中...</option>
  1679.                 </select>
  1680.             </div>
  1681.             <div class="button-group">
  1682.                 <button type="button" class="cancel-button" id="ai-cancel-config">取消</button>
  1683.                 <button type="button" class="save-button" id="ai-save-config">保存</button>
  1684.             </div>
  1685.         `;
  1686.  
  1687.         overlay.appendChild(modal);
  1688.         document.body.appendChild(overlay);
  1689.  
  1690.         // 初始化模型下拉菜单
  1691.         const modelSelect = modal.querySelector('#ai-model');
  1692.         const storedModels = getStoredModelList();
  1693.         const selectedModel = GM_getValue('selectedModel', '');
  1694.         
  1695.         if (storedModels.length > 0) {
  1696.             updateModelSelect(modelSelect, storedModels);
  1697.             if (selectedModel) {
  1698.                 modelSelect.value = selectedModel;
  1699.             }
  1700.         } else {
  1701.             modelSelect.innerHTML = '<option value="">请先检测API可用性</option>';
  1702.             modelSelect.disabled = true;
  1703.         }
  1704.  
  1705.         // 添加清空按钮事件
  1706.         const clearButtons = modal.querySelectorAll('.clear-icon');
  1707.         clearButtons.forEach(button => {
  1708.             button.addEventListener('click', function(e) {
  1709.                 const input = this.parentElement.querySelector('input, textarea');
  1710.                 if (input) {
  1711.                     input.value = '';
  1712.                     input.focus();
  1713.                 }
  1714.             });
  1715.         });
  1716.  
  1717.         // 检测API可用性
  1718.         const checkButton = modal.querySelector('#check-api');
  1719.         if (checkButton) {
  1720.             checkButton.addEventListener('click', async function() {
  1721.                 const endpoint = modal.querySelector('#ai-endpoint')?.value?.trim() || '';
  1722.                 const apiKeys = modal.querySelector('#ai-apikey')?.value?.trim().split('\n').filter(key => key.trim() !== '') || [];
  1723.  
  1724.                 if (!endpoint || apiKeys.length === 0) {
  1725.                     showToast('请先填写API Endpoint和至少一个API Key');
  1726.                     return;
  1727.                 }
  1728.  
  1729.                 checkButton.disabled = true;
  1730.                 modelSelect.disabled = true;
  1731.                 modelSelect.innerHTML = '<option value="">检测中...</option>';
  1732.  
  1733.                 try {
  1734.                     // 检查每个key的可用性
  1735.                     const validKeys = [];
  1736.                     const keyBalances = new Map();
  1737.  
  1738.                     for (const apiKey of apiKeys) {
  1739.                         try {
  1740.                             const userInfo = await checkUserInfo(endpoint, apiKey);
  1741.                             if (userInfo.totalBalance > 0) {
  1742.                                 validKeys.push(apiKey);
  1743.                                 keyBalances.set(apiKey, userInfo.totalBalance);
  1744.                             } else {
  1745.                                 showToast(`${apiKey.slice(0, 8)}...可用余额为0，被移除。`);
  1746.                             }
  1747.                         } catch (error) {
  1748.                             console.error('Key check failed:', error);
  1749.                             showToast(`${apiKey.slice(0, 8)}...验证失败，被移除。`);
  1750.                         }
  1751.                     }
  1752.  
  1753.                     // 按余额从小到大排序
  1754.                     validKeys.sort((a, b) => keyBalances.get(a) - keyBalances.get(b));
  1755.  
  1756.                     // 更新输入框中的key
  1757.                     const apiKeyInput = modal.querySelector('#ai-apikey');
  1758.                     if (apiKeyInput) {
  1759.                         apiKeyInput.value = validKeys.join('\n');
  1760.                     }
  1761.  
  1762.                     // 获取可用模型列表（使用第一个有效的key）
  1763.                     if (validKeys.length > 0) {
  1764.                         const models = await getAvailableModels(endpoint, validKeys[0]);
  1765.                         saveModelList(models);
  1766.                         updateModelSelect(modelSelect, models);
  1767.                         showToast(`检测完成，${validKeys.length}个有效key`);
  1768.                     } else {
  1769.                         showToast('没有可用的API Key');
  1770.                         modelSelect.innerHTML = '<option value="">无可用API Key</option>';
  1771.                         modelSelect.disabled = true;
  1772.                     }
  1773.                 } catch (error) {
  1774.                     showToast('API检测失败：' + error.message);
  1775.                     modelSelect.innerHTML = '<option value="">获取模型列表失败</option>';
  1776.                     modelSelect.disabled = true;
  1777.                 } finally {
  1778.                     checkButton.disabled = false;
  1779.                 }
  1780.             });
  1781.         }
  1782.  
  1783.         // 保存配置
  1784.         const saveButton = modal.querySelector('#ai-save-config');
  1785.         if (saveButton) {
  1786.             saveButton.addEventListener('click', function(e) {
  1787.                 e.preventDefault();
  1788.                 e.stopPropagation();
  1789.                 
  1790.                 const endpoint = modal.querySelector('#ai-endpoint')?.value?.trim() || '';
  1791.                 const apiKeys = modal.querySelector('#ai-apikey')?.value?.trim() || '';
  1792.                 const selectedModel = modelSelect?.value || '';
  1793.  
  1794.                 if (!endpoint || !apiKeys) {
  1795.                     showToast('请填写API Endpoint和至少一个API Key');
  1796.                     return;
  1797.                 }
  1798.  
  1799.                 if (!selectedModel) {
  1800.                     showToast('请选择一个视觉模型');
  1801.                     return;
  1802.                 }
  1803.  
  1804.                 GM_setValue('apiEndpoint', endpoint);
  1805.                 GM_setValue('apiKey', apiKeys);
  1806.                 GM_setValue('selectedModel', selectedModel);
  1807.                 showToast('配置已保存');
  1808.                 
  1809.                 if (overlay && overlay.parentNode) {
  1810.                     overlay.parentNode.removeChild(overlay);
  1811.                 }
  1812.             });
  1813.         }
  1814.  
  1815.         // 取消配置
  1816.         const cancelButton = modal.querySelector('#ai-cancel-config');
  1817.         if (cancelButton) {
  1818.             cancelButton.addEventListener('click', function(e) {
  1819.                 e.preventDefault();
  1820.                 e.stopPropagation();
  1821.                 
  1822.                 if (overlay && overlay.parentNode) {
  1823.                     overlay.parentNode.removeChild(overlay);
  1824.                 }
  1825.             });
  1826.         }
  1827.  
  1828.         // 点击遮罩层关闭
  1829.         overlay.addEventListener('click', function(e) {
  1830.             if (e.target === overlay) {
  1831.                 if (overlay.parentNode) {
  1832.                     overlay.parentNode.removeChild(overlay);
  1833.                 }
  1834.             }
  1835.         });
  1836.  
  1837.         // 阻止模态框内的点击事件冒泡
  1838.         modal.addEventListener('click', function(e) {
  1839.             e.stopPropagation();
  1840.         });
  1841.     }
  1842.  
  1843.     // 显示图像选择面
  1844.     function showImageSelectionModal() {
  1845.         const overlay = document.createElement('div');
  1846.         overlay.className = 'ai-modal-overlay';
  1847.         
  1848.         const modal = document.createElement('div');
  1849.         modal.className = 'ai-config-modal';
  1850.         modal.innerHTML = `
  1851.             <h3>选择要识别的图像</h3>
  1852.             <div class="ai-image-options">
  1853.                 <button id="ai-all-images">识别所有图片</button>
  1854.                 <button id="ai-visible-images">仅识别可见图片</button>
  1855.             </div>
  1856.             <button id="ai-cancel">取消</button>
  1857.         `;
  1858.  
  1859.         overlay.appendChild(modal);
  1860.         document.body.appendChild(overlay);
  1861.  
  1862.         // 添加事件监听
  1863.         modal.querySelector('#ai-all-images').onclick = () => {
  1864.             if (checkApiConfig()) {
  1865.                 describeAllImages();
  1866.                 overlay.remove();
  1867.             }
  1868.         };
  1869.  
  1870.         modal.querySelector('#ai-visible-images').onclick = () => {
  1871.             if (checkApiConfig()) {
  1872.                 describeVisibleImages();
  1873.                 overlay.remove();
  1874.             }
  1875.         };
  1876.  
  1877.         modal.querySelector('#ai-cancel').onclick = () => {
  1878.             overlay.remove();
  1879.         };
  1880.  
  1881.         // 点击遮罩层关闭
  1882.         overlay.addEventListener('click', (e) => {
  1883.             if (e.target === overlay) {
  1884.                 overlay.remove();
  1885.             }
  1886.         });
  1887.     }
  1888.  
  1889.     function showDescriptionModal(description, balanceInfo) {
  1890.         // 移除已存在的结果框
  1891.         const existingModal = document.querySelector('.ai-result-modal');
  1892.         if (existingModal) {
  1893.             existingModal.remove();
  1894.         }
  1895.  
  1896.         const overlay = document.createElement('div');
  1897.         overlay.className = 'ai-modal-overlay';
  1898.         
  1899.         const modal = document.createElement('div');
  1900.         modal.className = 'ai-result-modal';
  1901.         modal.innerHTML = `
  1902.             <div class="result-content">
  1903.                 <div class="description-code">
  1904.                     <code>${description}</code>
  1905.                 </div>
  1906.                 <div class="copy-hint">点击上方文本可复制</div>
  1907.                 <button class="close-button">×</button>
  1908.                 ${balanceInfo ? `<div class="balance-info">${balanceInfo}</div>` : ''}
  1909.             </div>
  1910.         `;
  1911.  
  1912.         // 添加复制功能
  1913.         const codeBlock = modal.querySelector('.description-code');
  1914.         codeBlock.addEventListener('click', async () => {
  1915.             try {
  1916.                 await navigator.clipboard.writeText(description);
  1917.                 showToast('已复制到剪贴板');
  1918.             } catch (err) {
  1919.                 console.error('[Debug] Copy failed:', err);
  1920.                 // 如果 clipboard API 失败，使用 GM_setClipboard 作为备选
  1921.                 GM_setClipboard(description);
  1922.                 showToast('已复制到剪贴板');
  1923.             }
  1924.         });
  1925.  
  1926.         // 添加关闭功能
  1927.         const closeButton = modal.querySelector('.close-button');
  1928.         closeButton.addEventListener('click', () => {
  1929.             overlay.remove();
  1930.         });
  1931.  
  1932.         // ESC键关闭
  1933.         const escHandler = (e) => {
  1934.             if (e.key === 'Escape') {
  1935.                 overlay.remove();
  1936.                 document.removeEventListener('keydown', escHandler);
  1937.             }
  1938.         };
  1939.         document.addEventListener('keydown', escHandler);
  1940.  
  1941.         overlay.appendChild(modal);
  1942.         document.body.appendChild(overlay);
  1943.     }
  1944.  
  1945.     // 添加计算成本的函数
  1946.     function calculateCost(imageSize, modelName) {
  1947.         let baseCost;
  1948.         switch (modelName) {
  1949.             case 'glm-4v':
  1950.                 baseCost = 0.015; // GLM-4V的基础成本
  1951.                 break;
  1952.             case 'glm-4v-flash':
  1953.                 baseCost = 0.002; // GLM-4V-Flash的基础成本
  1954.                 break;
  1955.             case 'Qwen/Qwen2-VL-72B-Instruct':
  1956.                 baseCost = 0.015;
  1957.                 break;
  1958.             case 'Pro/Qwen/Qwen2-VL-7B-Instruct':
  1959.                 baseCost = 0.005;
  1960.                 break;
  1961.             case 'OpenGVLab/InternVL2-Llama3-76B':
  1962.                 baseCost = 0.015;
  1963.                 break;
  1964.             case 'OpenGVLab/InternVL2-26B':
  1965.                 baseCost = 0.008;
  1966.                 break;
  1967.             case 'Pro/OpenGVLab/InternVL2-8B':
  1968.                 baseCost = 0.003;
  1969.                 break;
  1970.             case 'deepseek-ai/deepseek-vl2':
  1971.                 baseCost = 0.012; // 设置deepseek-vl2的基础成本
  1972.                 break;
  1973.             default:
  1974.                 baseCost = 0.01;
  1975.         }
  1976.  
  1977.         // 图片大小影响因子（每MB增加一定成本）
  1978.         const imageSizeMB = imageSize / (1024 * 1024);
  1979.         const sizeMultiplier = 1 + (imageSizeMB * 0.1); // 每MB增加10%成本
  1980.  
  1981.         return baseCost * sizeMultiplier;
  1982.     }
  1983.  
  1984.     // 初始化
  1985.     function initialize() {
  1986.         // 确保DOM加载成后再创建按钮
  1987.         if (document.readyState === 'loading') {
  1988.             document.addEventListener('DOMContentLoaded', () => {
  1989.                 createFloatingButton();
  1990.             });
  1991.         } else {
  1992.             createFloatingButton();
  1993.         }
  1994.     }
  1995.  
  1996.     // 启动脚本
  1997.     initialize();
  1998. })();