diff --git a/src/components/cards/Card.ts b/src/components/cards/Card.ts
index a3dc981..b2b931f 100644
--- a/src/components/cards/Card.ts
+++ b/src/components/cards/Card.ts
@@ -1,5 +1,7 @@
 // import axios from "axios";
 
+import FetchWrapper from "../utils/FetchWapper";
+
 export const schema = [
   { name: 'title', label: '标题', type: 'input' },
   { name: 'body', label: '内容', type: 'input' },
@@ -18,7 +20,34 @@ export type cardType = {
   btnHref?: string | null
 };
 
-function getData() {
+export function getDatas(url: string, cards: cardType[]) {
+  console.log(url);
+  FetchWrapper.fetch(url, { timeout: 3000 })
+    .then(response => {
+      if (!response.ok) {
+        // throw new Error(`HTTP error! status: ${response.status}`);
+        return null;
+      }
+      console.log(response);
+      return response.json();
+    }).then(jsonData => {
+      console.log('JSON Data:', jsonData);
+      if (!jsonData) {
+        return null;
+      }
+      cards.length = 0;
+      jsonData.datas.forEach((i: cardType) => {
+        const item = { ...jsonData.default_item, ...i }
+        cards.push({
+          title: item.title,
+          body: item.intro,
+          jumpHerf: item.url
+        })
+      })
+    })
+    .catch(error => {
+      console.error('Error fetching data:', error);
+    });
 }
 
 function setData() {
diff --git a/src/components/utils/IFrame.vue b/src/components/utils/IFrame.vue
index 1c3671f..99fdf19 100644
--- a/src/components/utils/IFrame.vue
+++ b/src/components/utils/IFrame.vue
@@ -1,6 +1,6 @@
 <template>
     <div ref="outerContainer" @wheel.stop="handleWheel">
-        <iframe ref="frameRef" :src="frameUrl" :style="frameStyle"/>
+        <iframe ref="frameRef" :src="frameUrl" :srcdoc="frameDoc" :style="frameStyle"/>
     </div>
 </template>
 
@@ -8,9 +8,13 @@
 import { computed, ref } from 'vue';
 
 const props = defineProps({
-    'frameUrl': {
+    frameUrl: {
         type: String,
-        required: true
+        default: undefined
+    },
+    frameDoc: {
+        type: String,
+        default: undefined
     },
     height: {
         type: String,
diff --git a/src/assets/config.json b/src/config/config.json
similarity index 51%
rename from src/assets/config.json
rename to src/config/config.json
index 3257e8b..c7ca0df 100644
--- a/src/assets/config.json
+++ b/src/config/config.json
@@ -1,13 +1,14 @@
 {
     "file_api": {
+        "root_url": "/api/files",
         "cards": {
             "type": "json",
-            "base_url": "/api/files/cards",
-            "home_json": "index-content.json"
+            "url": "cards",
+            "home": "index-content"
         },
         "notes": {
             "type": "html",
-            "base_url": "/api/files/notes"
+            "url": "notes"
         }
     }
 }
\ No newline at end of file
diff --git a/src/pages/CardShower.vue b/src/pages/CardShower.vue
index a03dcdc..5e7e679 100644
--- a/src/pages/CardShower.vue
+++ b/src/pages/CardShower.vue
@@ -16,35 +16,25 @@ import Footer from "@/components/Footer.vue"
 // import axios, { AxiosError } from "axios"
 import router from "@/router"
 import FetchWrapper from "@/components/utils/FetchWapper";
-import type { cardType } from "@/components/cards/Card";
+import { getDatas, type cardType } from "@/components/cards/Card";
 import CardsManager from "@/components/cards/CardsManager.vue";
 
-import { file_api } from '@/assets/config.json'
+import { file_api } from '@/config/config.json';
 
 const props = defineProps(['user_name', 'pages_name', 'token'])
 
 let isShowEdit = ref(false)
 let TOKEN = ref("")
 
+const cardUrl = (
+  `${file_api.root_url}/` +
+  `${file_api.cards.url}/` +
+  `${props.pages_name}?` +
+  `type=${file_api.cards.type}`
+);
+
 onMounted(() => {
-  FetchWrapper.fetch(`${file_api.cards.base_url}/${props.pages_name}.json`, { timeout: 3000 })
-    .then(response => {
-      if (!response.ok) {
-        throw new Error(`HTTP error! status: ${response.status}`);
-      }
-      return response.json();
-    }).then(body => {
-      console.log(body)
-      body.datas.forEach((i:any) => {
-        const item = {...body.default_item, ...i}
-        cardsData.value.push({
-          title: item.title,
-          body: item.intro,
-          jumpHerf: item.url
-        })
-      })
-      console.log(cardsData.value)
-    })
+  getDatas(cardUrl, cardsData.value);
 });
 
 let cardsData = ref<cardType[]>([])
diff --git a/src/pages/Home.vue b/src/pages/Home.vue
index c3c2054..62d47a2 100644
--- a/src/pages/Home.vue
+++ b/src/pages/Home.vue
@@ -32,13 +32,12 @@ import { onMounted, ref, watch } from "vue"
 import Navbar from "@/components/Navbar.vue"
 import Hero from "@/components/Hero.vue"
 import Footer from "@/components/Footer.vue"
-import { type cardType } from "@/components/cards/Card"
+import { type cardType, getDatas } from "@/components/cards/Card"
 import CardsManager from "@/components/cards/CardsManager.vue"
-import FetchWrapper from "@/components/utils/FetchWapper"
 import { useRouter } from "vue-router"
 import Alert from "@/components/utils/Alert.vue"
 
-import { file_api } from "@/assets/config.json"
+import { file_api } from "@/config/config.json"
 
 const router = useRouter()
 
@@ -55,29 +54,15 @@ function checkHandle() {
   return false
 }
 
-const cardUrl = `${file_api.cards.base_url}/${file_api.cards.home_json}`
+const cardUrl = (
+  `${file_api.root_url}/` +
+  `${file_api.cards.url}/` +
+  `${file_api.cards.home}?` +
+  `type=${file_api.cards.type}`
+);
+
 onMounted(() => {
-  FetchWrapper.fetch(cardUrl, { timeout: 3000 })
-    .then(response => {
-      if (!response.ok) {
-        // throw new Error(`HTTP error! status: ${response.status}`);
-        return;
-      }
-      return response.json();
-    }).then(body => {
-      if (!body.datas) {
-        return;
-      }
-      cards.value.length = 0;
-      body.datas.forEach((i: cardType) => {
-        const item = {...body.default_item, ...i}
-        cards.value.push({
-          title: item.title,
-          body: item.intro,
-          jumpHerf: item.url
-        })
-      })
-    })
+  getDatas(cardUrl, cards.value)
 });
 
 let cards = ref<cardType[]>([
@@ -93,7 +78,7 @@ let cards = ref<cardType[]>([
   {
     title: "404",
     body: "note",
-    jumpHerf: '/note/Style Guide for C.html',
+    jumpHerf: '/note/Style Guide for C',
     imgSrc: null,
     imgAlt: null,
     btnText: null,
diff --git a/src/pages/NoteShower.vue b/src/pages/NoteShower.vue
index 20fa79c..49d715b 100644
--- a/src/pages/NoteShower.vue
+++ b/src/pages/NoteShower.vue
@@ -1,7 +1,7 @@
 <template>
     <Navbar/>
     <!-- <Alert/> -->
-    <IFrame :frameUrl="noteUrl"/>
+    <IFrame :frameUrl="noteUrl" :frameDoc="noteDoc"/>
 </template>
 
 <script setup lang='ts'>
@@ -9,9 +9,37 @@ import { computed, onMounted, ref, watch } from "vue"
 import IFrame from '@/components/utils/IFrame.vue'
 import Navbar from "@/components/Navbar.vue";
 import Alert from '@/components/utils/Alert.vue'
-const props = defineProps(['note_url', 'token'])
+import FetchWrapper from "@/components/utils/FetchWapper";
+
+import { file_api } from '@/config/config.json';
+
+const props = defineProps(['note_name', 'token'])
 let isShow = ref(true)
-const noteUrl = ref('/files/notes/' + props.note_url ?? '')
+const noteUrl = ref()
+const noteDoc = ref()
+
+
+onMounted(() => {
+  FetchWrapper.fetch(`${file_api.root_url}/${file_api.notes.url}/${props.note_name}?type=${file_api.notes.type}`,
+        {
+            timeout: 3000,
+            headers: {
+                'Content-Type': 'text/html',
+            },
+        })
+    .then(response => {
+      if (!response.ok) {
+        // throw new Error(`HTTP error! status: ${response.status}`);
+        // noteUrl.value = '/.notes/' + props.note_name + '.html';
+        return null;
+      }
+      return response.text();
+    })
+    .then(htmlText => {
+      noteUrl.value = null;
+      noteDoc.value = htmlText;
+    })
+});
 
 let msg = ref('msg')
 let btnTxt = ref('btnTxt')
diff --git a/src/router/index.ts b/src/router/index.ts
index b6d5f1f..d98c4af 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -31,7 +31,7 @@ const router = createRouter({
     },
     {
       name: "noteShower",
-      path: "/note/:note_url/:token?",
+      path: "/note/:note_name/:token?",
       component: () => import("@/pages/NoteShower.vue"),
       props(route) {
         return {