fix: Dealing with API interface issues (#7295)

Author: lan-yonghui

backend/middleware/session.go

@@ -65,7 +65,7 @@ func SessionAuth() gin.HandlerFunc {
 
 func isValid1PanelToken(panelToken string, panelTimestamp string) bool {
 	system1PanelToken := global.CONF.System.ApiKey
-	if GenerateMD5("1panel"+panelToken+panelTimestamp) == GenerateMD5("1panel"+system1PanelToken+panelTimestamp) {
+	if panelToken == GenerateMD5("1panel"+system1PanelToken+panelTimestamp) {
 		return true
 	}
 	return false

frontend/src/lang/modules/en.ts

@@ -1410,8 +1410,8 @@ const message = {
         apiInterfaceHelper: 'Allow third-party applications to access the API.',
         apiInterfaceAlert1: `Don't enable it in production environments because it may increase server security risks.`,
         apiInterfaceAlert2: `Don't use third-party applications to call the API to prevent potential security threats.`,
-        apiInterfaceAlert3: 'API document:',
-        apiInterfaceAlert4: 'Usage document:',
+        apiInterfaceAlert3: 'API Docs',
+        apiInterfaceAlert4: 'Usage Docs',
         apiKey: 'Interface key',
         apiKeyHelper: 'API key is used for third-party applications to access the API.',
         ipWhiteList: 'IP whitelist',

frontend/src/lang/modules/tw.ts

@@ -1331,8 +1331,8 @@ const message = {
         apiInterfaceHelper: '提供面板支持 API 接口訪問',
         apiInterfaceAlert1: '請不要在生產環境開啟，這可能新增服務器安全風險',
         apiInterfaceAlert2: '請不要使用協力廠商應用調用面板 API，以防止潜在的安全威脅。',
-        apiInterfaceAlert3: 'API 接口檔案：',
-        apiInterfaceAlert4: '使用檔案：',
+        apiInterfaceAlert3: 'API 接口檔案',
+        apiInterfaceAlert4: '使用檔案',
         apiKey: '接口密钥',
         apiKeyHelper: '接口密钥用於外部應用訪問 API 接口',
         ipWhiteList: 'IP白名單',

frontend/src/lang/modules/zh.ts

@@ -1333,8 +1333,8 @@ const message = {
         apiInterfaceHelper: '提供面板支持 API 接口访问',
         apiInterfaceAlert1: '请不要在生产环境开启，这可能增加服务器安全风险',
         apiInterfaceAlert2: '请不要使用第三方应用调用面板 API，以防止潜在的安全威胁。',
-        apiInterfaceAlert3: 'API 接口文档:',
-        apiInterfaceAlert4: '使用文档:',
+        apiInterfaceAlert3: 'API 接口文档',
+        apiInterfaceAlert4: '使用文档',
         apiKey: '接口密钥',
         apiKeyHelper: '接口密钥用于外部应用访问 API 接口',
         ipWhiteList: 'IP 白名单',

frontend/src/views/setting/panel/api-interface/index.vue

@@ -21,15 +21,13 @@
                             <el-text type="danger">{{ $t('setting.apiInterfaceAlert2') }}</el-text>
                         </li>
                         <li>
-                            {{ $t('setting.apiInterfaceAlert3') }}
-                            <el-link :href="apiURL" type="success" target="_blank" class="mb-0.5 ml-0.5">
-                                {{ apiURL }}
+                            <el-link :href="apiURL" type="warning" target="_blank" class="mb-0.5 ml-0.5">
+                                {{ $t('setting.apiInterfaceAlert3') }}
                             </el-link>
                         </li>
                         <li>
-                            {{ $t('setting.apiInterfaceAlert4') }}
-                            <el-link :href="panelURL" type="success" target="_blank" class="mb-0.5 ml-0.5">
-                                {{ panelURL }}
+                            <el-link :href="panelURL" type="warning" target="_blank" class="mb-0.5 ml-0.5">
+                                {{ $t('setting.apiInterfaceAlert4') }}
                             </el-link>
                         </li>
                     </ul>
@@ -73,7 +71,7 @@
             <template #footer>
                 <span class="dialog-footer">
                     <el-button @click="handleClose">{{ $t('commons.button.cancel') }}</el-button>
-                    <el-button :disabled="loading" type="primary" @click="onBind(formRef)">
+                    <el-button :disabled="loading" type="primary" @click="onSave(formRef)">
                         {{ $t('commons.button.confirm') }}
                     </el-button>
                 </span>
@@ -97,7 +95,7 @@ const formRef = ref();
 const apiURL = `${window.location.protocol}//${window.location.hostname}${
     window.location.port ? `:${window.location.port}` : ''
 }/1panel/swagger/index.html`;
-const panelURL = `https://1panel.cn/docs`;
+const panelURL = `https://1panel.cn/docs/dev_manual/api_manual/`;
 
 const form = reactive({
     apiKey: '',
@@ -171,7 +169,7 @@ const resetApiKey = async () => {
         });
 };
 
-const onBind = async (formEl: FormInstance | undefined) => {
+const onSave = async (formEl: FormInstance | undefined) => {
     if (!formEl) return;
     formEl.validate(async (valid) => {
         if (!valid) return;

frontend/src/views/setting/panel/index.vue

@@ -196,7 +196,7 @@
 <script lang="ts" setup>
 import { ref, reactive, onMounted, computed } from 'vue';
 import { ElForm, ElMessageBox } from 'element-plus';
-import { getSettingInfo, updateSetting, getSystemAvailable } from '@/api/modules/setting';
+import { getSettingInfo, updateSetting, getSystemAvailable, updateApiConfig } from '@/api/modules/setting';
 import { GlobalStore } from '@/store';
 import { useI18n } from 'vue-i18n';
 import { useTheme } from '@/hooks/use-theme';
@@ -391,19 +391,11 @@ const onChangeProxy = () => {
 
 const onChangeApiInterfaceStatus = async () => {
     if (form.apiInterfaceStatus === 'enable') {
-        loading.value = true;
-        await updateSetting({ key: 'ApiInterfaceStatus', value: form.apiInterfaceStatus })
-            .then(() => {
-                loading.value = false;
-                apiInterfaceRef.value.acceptParams({
-                    apiInterfaceStatus: form.apiInterfaceStatus,
-                    apiKey: form.apiKey,
-                    ipWhiteList: form.ipWhiteList,
-                });
-            })
-            .catch(() => {
-                loading.value = false;
-            });
+        apiInterfaceRef.value.acceptParams({
+            apiInterfaceStatus: form.apiInterfaceStatus,
+            apiKey: form.apiKey,
+            ipWhiteList: form.ipWhiteList,
+        });
         return;
     }
     ElMessageBox.confirm(i18n.t('setting.apiInterfaceClose'), i18n.t('setting.apiInterface'), {
@@ -413,7 +405,12 @@ const onChangeApiInterfaceStatus = async () => {
         .then(async () => {
             loading.value = true;
             form.apiInterfaceStatus = 'disable';
-            await updateSetting({ key: 'ApiInterfaceStatus', value: 'disable' })
+            let param = {
+                apiKey: form.apiKey,
+                ipWhiteList: form.ipWhiteList,
+                apiInterfaceStatus: form.apiInterfaceStatus,
+            };
+            await updateApiConfig(param)
                 .then(() => {
                     loading.value = false;
                     search();