protocol-proxy 2.0.3 → 2.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "protocol-proxy",
-  "version": "2.0.3",
+  "version": "2.0.7",
   "description": "OpenAI / Anthropic 协议转换透明代理",
   "main": "server.js",
   "bin": {

package/public/app.js

@@ -40,7 +40,6 @@ function initProviderDropdown() {
   const dropdown = document.getElementById('provider-dropdown');
   const addNameInput = document.getElementById('provider-add-name');
   const addUrlInput = document.getElementById('provider-add-url');
-  const addKeyInput = document.getElementById('provider-add-key');
   const addBtn = document.getElementById('provider-add-btn');
 
   trigger.addEventListener('click', (e) => {
@@ -50,7 +49,6 @@ function initProviderDropdown() {
       editingProviderId = null;
       addNameInput.value = '';
       addUrlInput.value = '';
-      addKeyInput.value = '';
       addUrlInput.disabled = false;
       addBtn.textContent = '添加';
       renderProviderOptions();
@@ -67,7 +65,6 @@ function initProviderDropdown() {
   addBtn.addEventListener('click', async () => {
     const name = addNameInput.value.trim();
     const url = addUrlInput.value.trim();
-    const apiKey = addKeyInput.value.trim();
     if (!name || !url) {
       showToast('请填写供应商名称和地址', true);
       return;
@@ -79,14 +76,14 @@ function initProviderDropdown() {
         res = await fetch(`/api/providers/${editingProviderId}`, {
           method: 'PUT',
           headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ name, apiKey }),
+          body: JSON.stringify({ name }),
         });
       } else {
         // 新增模式
         res = await fetch('/api/providers', {
           method: 'POST',
           headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ name, url, apiKey }),
+          body: JSON.stringify({ name, url }),
         });
       }
       if (!res.ok) {
@@ -129,7 +126,7 @@ function renderProviderOptions() {
       <span class="model-option-name">${escapeHtml(p.name)}</span>
       ${p.name !== p.url ? `<span style="color:#64748b;font-size:12px;margin-left:4px">${escapeHtml(p.url)}</span>` : ''}
       <span style="margin-left:auto;display:flex;gap:4px">
-        <button type="button" class="model-option-delete" data-edit-id="${escapeHtml(p.id)}" title="编辑此供应商" style="color:#60a5fa">&times;</button>
+        <button type="button" class="model-option-delete" data-edit-id="${escapeHtml(p.id)}" title="编辑此供应商" style="color:#60a5fa;font-size:14px">&#9998;</button>
         <button type="button" class="model-option-delete" data-delete-id="${escapeHtml(p.id)}" title="删除此供应商">&times;</button>
       </span>
     </div>
@@ -202,8 +199,18 @@ function selectProvider(id) {
   document.getElementById('provider-dropdown-value').textContent = provider
     ? (provider.name !== provider.url ? `${provider.name} - ${provider.url}` : provider.url)
     : '选择供应商...';
-  renderModelOptions();
+  // 切换供应商后模型自动选为该供应商模型列表的第一个
+  const models = provider?.models || [];
+  selectModel(models[0] || '');
   updateModelAddState();
+  // 加载供应商的 API Key
+  if (id) {
+    fetch(`/api/providers/${id}`).then(r => r.json()).then(p => {
+      document.getElementById('target-key').value = p.apiKey || '';
+    }).catch(() => {});
+  } else {
+    document.getElementById('target-key').value = '';
+  }
 }
 
 // ==================== Model 下拉框 ====================
@@ -493,6 +500,12 @@ function openModal(id = null) {
     document.getElementById('auth-token-group').style.display = p.requireAuth ? 'block' : 'none';
     selectProvider(p.providerId || '');
     selectModel(p.defaultModel || '');
+    // 加载供应商的 API Key
+    if (p.providerId) {
+      fetch(`/api/providers/${p.providerId}`).then(r => r.json()).then(provider => {
+        document.getElementById('target-key').value = provider.apiKey || '';
+      }).catch(() => {});
+    }
   } else {
     document.getElementById('proxy-id').value = '';
     document.getElementById('auth-token-group').style.display = 'none';
@@ -528,13 +541,32 @@ async function handleSubmit(e) {
     return;
   }
 
+  const apiKey = document.getElementById('target-key').value.trim();
+  const protocol = document.getElementById('target-protocol').value;
+  const defaultModel = document.getElementById('target-model').value.trim() || '';
+
+  // 同步更新供应商配置
+  const providerUpdates = {};
+  if (apiKey) providerUpdates.apiKey = apiKey;
+  if (protocol) providerUpdates.protocol = protocol;
+  if (Object.keys(providerUpdates).length > 0) {
+    try {
+      await fetch(`/api/providers/${providerId}`, {
+        method: 'PUT',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(providerUpdates),
+      });
+      await loadProviders();
+    } catch {}
+  }
+
   const payload = {
     name: document.getElementById('proxy-name').value.trim(),
     port,
     requireAuth: document.getElementById('proxy-auth').value === 'true',
     authToken: document.getElementById('proxy-auth-token').value.trim() || null,
     providerId,
-    defaultModel: document.getElementById('target-model').value.trim() || '',
+    defaultModel,
   };
 
   try {

package/public/index.html

@@ -85,7 +85,6 @@
                       <div class="model-add-section">
                         <input type="text" class="model-add-input" id="provider-add-name" placeholder="供应商名称">
                         <input type="url" class="model-add-input" id="provider-add-url" placeholder="https://api.example.com">
-                        <input type="password" class="model-add-input" id="provider-add-key" placeholder="API Key">
                         <button type="button" class="btn btn-primary btn-sm" id="provider-add-btn">添加</button>
                       </div>
                     </div>
@@ -93,7 +92,10 @@
                 </div>
                 <div class="form-group">
                   <label>协议</label>
-                  <input type="text" id="target-protocol" readonly placeholder="自动识别" style="background:#1e293b;color:#94a3b8;cursor:not-allowed">
+                  <select id="target-protocol">
+                    <option value="openai">OpenAI</option>
+                    <option value="anthropic">Anthropic</option>
+                  </select>
                 </div>
               </div>
               <div class="form-row">