diff --git a/web/package-lock.json b/web/package-lock.json
index 138721501f..2fbf19e4fa 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -16,7 +16,7 @@
         "@segment/analytics-next": "^1.45.0",
         "@sentry/tracing": "^7.17.4",
         "@sentry/vue": "^7.17.4",
-        "aws-amplify": "*",
+        "aws-amplify": "latest",
         "js-cookie": "^3.0.1",
         "jwt-decode": "^3.1.2",
         "lodash-es": "^4.17.21",
diff --git a/web/package.json b/web/package.json
index 3f8c90f5d5..83d83af7c8 100644
--- a/web/package.json
+++ b/web/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "zinc-oxide-web",
-  "version": "0.0.0",
+  "name": "zinc-observe-web",
+  "version": "0.1.0",
   "license": "Apache-2.0",
   "private": true,
   "scripts": {
@@ -24,7 +24,7 @@
     "@segment/analytics-next": "^1.45.0",
     "@sentry/tracing": "^7.17.4",
     "@sentry/vue": "^7.17.4",
-    "aws-amplify": "latest",
+    "aws-amplify": "4.3.43",
     "js-cookie": "^3.0.1",
     "jwt-decode": "^3.1.2",
     "lodash-es": "^4.17.21",
diff --git a/web/src/components/ingestion/Curl.vue b/web/src/components/ingestion/Curl.vue
index 959ba47700..621a7637e2 100644
--- a/web/src/components/ingestion/Curl.vue
+++ b/web/src/components/ingestion/Curl.vue
@@ -29,10 +29,8 @@
       </div>
     </div>
     <pre ref="content">
-  curl -u {{ currUserEmail }}:{{ store.state.organizationPasscode }} -k {{
-        config.zincENLIngestion
-      }}/api/{{ currOrgIdentifier }}/default/_json -d [JSON-DATA]</pre
-    >
+curl -u {{ currUserEmail }}:{{ store.state.organizationPasscode }} -k {{ endpoint.url }}/api/{{ currOrgIdentifier }}/default/_json -d [JSON-DATA]
+    </pre>
   </div>
 </template>
 
@@ -53,11 +51,22 @@ export default defineComponent({
   },
   setup() {
     const store = useStore();
+    const endpoint = ref(""); 
+ 
+    const url = new URL(store.state.API_ENDPOINT); 
+    endpoint.value = {
+      url: store.state.API_ENDPOINT,
+      host: url.hostname,
+      port: url.port,
+      protocol: url.protocol.replace(":", ""),
+      tls: url.protocol === "https:" ? "On" : "Off",
+    };
 
     const content = ref(null);
     return {
       store,
       config,
+      endpoint,
       content,
     };
   },
diff --git a/web/src/components/ingestion/FluentBit.vue b/web/src/components/ingestion/FluentBit.vue
index a5abb67b3c..6a084051f2 100644
--- a/web/src/components/ingestion/FluentBit.vue
+++ b/web/src/components/ingestion/FluentBit.vue
@@ -33,15 +33,14 @@
   Name http
   Match *
   Path /api/{{ currOrgIdentifier }}/default/_json
-  Host {{ config.zincENLIngestion }}
-  index default
-  Port 443
-  tls On
-  Suppress_Type_Name On
-  Generate_ID On
+  Host {{ endpoint.host }}
+  Port {{ endpoint.port }}
+  tls {{ endpoint.tls }}
+  Format json
+  Json_date_key    _timestamp
+  Json_date_format iso8601
   HTTP_User {{ currUserEmail }}
-  HTTP_Passwd {{ store.state.organizationPasscode }}</pre
-    >
+  HTTP_Passwd {{ store.state.organizationPasscode }}</pre>
   </div>
 </template>
 
@@ -62,11 +61,22 @@ export default defineComponent({
   },
   setup() {
     const store = useStore();
+    const endpoint = ref(""); 
+ 
+    const url = new URL(store.state.API_ENDPOINT); 
+    endpoint.value = {
+      url: store.state.API_ENDPOINT,
+      host: url.hostname,
+      port: url.port,
+      protocol: url.protocol.replace(":", ""),
+      tls: url.protocol === "https:" ? "On" : "Off",
+    };
 
     const fluentbitContent = ref(null);
     return {
       store,
       config,
+      endpoint,
       fluentbitContent,
     };
   },
diff --git a/web/src/components/ingestion/Fluentd.vue b/web/src/components/ingestion/Fluentd.vue
index ea914cf23f..8a04dc8576 100644
--- a/web/src/components/ingestion/Fluentd.vue
+++ b/web/src/components/ingestion/Fluentd.vue
@@ -36,19 +36,16 @@
 &lt;/source&gt;
 
 &lt;match **&gt;
-  @type copy
-  &lt;store&gt;
-    @type http
-    host {{ config.zincENLIngestion }}
-    port 443
-    scheme https
-    path /api/{{ currOrgIdentifier }}/default/_json
-    user {{ currUserEmail }}
+  @type http
+  endpoint {{ endpoint.url }}/api/{{ currOrgIdentifier }}/default/_json
+  content_type json
+  json_array true
+  &lt;auth&gt;
+    method basic
+    username {{ currUserEmail }}
     password {{ store.state.organizationPasscode }}
-    index_name default
-  &lt;/store&gt;
-&lt;/match&gt;</pre
-    >
+  &lt;/auth&gt;
+&lt;/match&gt;</pre>
   </div>
 </template>
 
@@ -69,11 +66,22 @@ export default defineComponent({
   },
   setup() {
     const store = useStore();
+    const endpoint = ref(""); 
+ 
+    const url = new URL(store.state.API_ENDPOINT); 
+    endpoint.value = {
+      url: store.state.API_ENDPOINT,
+      host: url.hostname,
+      port: url.port,
+      protocol: url.protocol.replace(":", ""),
+      tls: url.protocol === "https:" ? "On" : "Off",
+    };
 
     const fluentdContent = ref(null);
     return {
       store,
       config,
+      endpoint,
       fluentdContent,
     };
   },
diff --git a/web/src/components/ingestion/Vector.vue b/web/src/components/ingestion/Vector.vue
index a54567ba44..c809c14d47 100644
--- a/web/src/components/ingestion/Vector.vue
+++ b/web/src/components/ingestion/Vector.vue
@@ -32,15 +32,14 @@
 [sinks.zinc]
 type = "http"
 inputs = [ source or transform id ]
-endpoint = "{{ config.zincENLEndPoint }}/api/{{ currOrgIdentifier }}/"
-mode = "bulk"
+endpoint = "{{ endpoint.url }}/api/{{ currOrgIdentifier }}/default/_json"
 auth.strategy = "basic"
 auth.user = "{{ currUserEmail }}"
 auth.password = "{{ store.state.organizationPasscode }}"
-bulk.index = "default"
 compression = "none"
-healthcheck.enabled = false</pre
-    >
+encoding.codec = "json"
+encoding.timestamp_format = "rfc3339"
+healthcheck.enabled = false</pre>
   </div>
 </template>
 
@@ -61,11 +60,22 @@ export default defineComponent({
   },
   setup() {
     const store = useStore();
+    const endpoint = ref(""); 
+ 
+    const url = new URL(store.state.API_ENDPOINT); 
+    endpoint.value = {
+      url: store.state.API_ENDPOINT,
+      host: url.hostname,
+      port: url.port,
+      protocol: url.protocol.replace(":", ""),
+      tls: url.protocol === "https:" ? "On" : "Off",
+    };
 
     const vectorContent = ref(null);
     return {
       store,
       config,
+      endpoint,
       vectorContent,
     };
   },
diff --git a/web/src/layouts/MainLayout.vue b/web/src/layouts/MainLayout.vue
index a578f4e5be..d6de424c7a 100644
--- a/web/src/layouts/MainLayout.vue
+++ b/web/src/layouts/MainLayout.vue
@@ -38,14 +38,14 @@
 
         <q-toolbar-title></q-toolbar-title>
         <q-btn
-          class="q-ml-xs text-bold no-border"
+          class="q-ml-xs no-border"
           size="13px"
           no-caps
           :label="t(`menu.openapi`)"
           @click="navigateToOpenAPI(zoBackendUrl)"
         />
         <q-btn
-          class="q-ml-xs text-bold no-border"
+          class="q-ml-xs no-border"
           size="13px"
           no-caps
           :label="t(`menu.docs`)"
diff --git a/web/src/locales/languages/zh.json b/web/src/locales/languages/zh.json
index 07f613ddc4..3adf562ddb 100644
--- a/web/src/locales/languages/zh.json
+++ b/web/src/locales/languages/zh.json
@@ -277,7 +277,7 @@
     "rtAlert": "实时警报",
     "noData": "没有数据",
     "findIngestion": "了解如何采集日志 >>",
-    "ingestionMsg": "看来你没有向选定的组织发生任何数据，有多种方式可以采集数据，比如 fluentbit。",
+    "ingestionMsg": "看来你没有向选定的组织发送任何数据，有多种方式可以采集数据，比如 fluentbit。",
     "inestedInSearch": "尝试搜索日志",
     "searchInDemoOrg": "你可以通过切换到演示组织来探索搜索功能，要切换到演示组织，请使用顶部的组织下拉列表选择 “演示组织”。我们一直在向演示组织发生演示数据。"
   }
diff --git a/web/src/plugins/logs/Index.vue b/web/src/plugins/logs/Index.vue
index a8ce2d60d6..bab0d012f3 100644
--- a/web/src/plugins/logs/Index.vue
+++ b/web/src/plugins/logs/Index.vue
@@ -409,7 +409,7 @@ export default defineComponent({
       }
     }
 
-    function buildZincENLSearch() {
+    function buildSearch() {
       try {
         let query = searchObj.data.editorValue;
 
@@ -609,7 +609,7 @@ export default defineComponent({
         }
         dismiss = Notify();
 
-        const queryReq = buildZincENLSearch();
+        const queryReq = buildSearch();
 
         searchService
           .search({
diff --git a/web/src/services/organizations.ts b/web/src/services/organizations.ts
index 0570cca2e8..d49b8f7f98 100644
--- a/web/src/services/organizations.ts
+++ b/web/src/services/organizations.ts
@@ -44,37 +44,37 @@ const organizations = {
     return http().post("/api/organizations", data);
   },
   add_members: (data: any, orgIdentifier: string) => {
-    return http().post(`api/organizations/${orgIdentifier}/members`, data);
+    return http().post(`/api/organizations/${orgIdentifier}/members`, data);
   },
   process_subscription: (s: string) => {
-    return http().get(`api/organizations/member_subscription/${s}`);
+    return http().get(`/api/organizations/member_subscription/${s}`);
   },
   get_associated_members: (orgIdentifier: string) => {
-    return http().get(`api/organizations/associated_members/${orgIdentifier}`);
+    return http().get(`/api/organizations/associated_members/${orgIdentifier}`);
   },
   update_member_role: (data: any, orgIdentifier: string) => {
     if (config.isZincObserveCloud === "true") {
-      return http().put(`api/organizations/${orgIdentifier}/member`, data);
+      return http().put(`/api/organizations/${orgIdentifier}/member`, data);
     } else {
-      return http().patch(`api/${orgIdentifier}/users/${encodeURIComponent(data.email)}`, { role: data.role });
+      return http().patch(`/api/${orgIdentifier}/users/${encodeURIComponent(data.email)}`, { role: data.role });
     }
   },
   verify_identifier: (name: string) => {
-    return http().get(`api/organizations/verify_identifier/${name}`);
+    return http().get(`/api/organizations/verify_identifier/${name}`);
   },
   get_organization_passcode: (orgIdentifier: string) => {
     if (config.isZincObserveCloud === "true") {
       return http().get(`/api/organizations/passcode/${orgIdentifier}`);
     }
     else {
-      return http().get(`api/${orgIdentifier}/organizations/passcode`);
+      return http().get(`/api/${orgIdentifier}/organizations/passcode`);
     }
   },
   update_organization_passcode: (orgIdentifier: string) => {
     if (config.isZincObserveCloud === "true") {
-      return http().put(`api/organizations/passcode/${orgIdentifier}`, {});
+      return http().put(`/api/organizations/passcode/${orgIdentifier}`, {});
     } else {
-      return http().put(`api/${orgIdentifier}/organizations/passcode`, {});
+      return http().put(`/api/${orgIdentifier}/organizations/passcode`, {});
     }
   },
   get_organization_summary: (orgIdentifier: string) => {
diff --git a/web/src/stores/index.ts b/web/src/stores/index.ts
index 70e982034a..0be2e29266 100644
--- a/web/src/stores/index.ts
+++ b/web/src/stores/index.ts
@@ -17,7 +17,7 @@ import { useLocalOrganization, useLocalCurrentUser } from "../utils/zincutils";
 
 export default createStore({
   state: {
-    API_ENDPOINT: import.meta.env.VITE_ZINCOBSERVE_ENDPOINT,
+    API_ENDPOINT: import.meta.env.VITE_ZINCOBSERVE_ENDPOINT || (window.location.origin != "http://localhost:8081" ? window.location.origin : "http://localhost:5080"),
     userInfo: {},
     loggedIn: false,
     loadingState: true,
diff --git a/web/vite.config.ts b/web/vite.config.ts
index 2b1acd081d..811a3f9c8e 100644
--- a/web/vite.config.ts
+++ b/web/vite.config.ts
@@ -39,9 +39,9 @@ export default defineConfig({
     // testNamePattern: "DateTime",
     // ...
   },
-  // server: {
-  //   port: 8081,
-  // },
+  server: {
+    port: 8081,
+  },
   base: "/",
   plugins: [
     vue({