add HOST_URL and MILVUS_URL

README.md

@@ -4,23 +4,23 @@ Milvus insight provides an intuitive and efficient GUI for Milvus, allowing you
 
 <img src="./.github/images/screenshot.png" alt="Miluvs insight" />
 
-
-## ⭐️ Install 
+## ⭐️ Install
 
 Start Docker container and map the url to the container:
 
 ```code
-docker run -p 8000:3000 -e HOST_URL=http://127.0.0.1:8000 -e MILVUS_URL=http://127.0.0.1:19530 milvusdb/milvus-insight:latest
+docker run -p 8000:3000 -e HOST_URL=http://127.0.0.1:8000 -e MILVUS_URL=127.0.0.1:19530 milvusdb/milvus-insight:latest
 ```
 
-| Parameters | Default | required |  description |
-| :-----| :---- | :----: | :----: |
-| HOST_URL | http://127.0.0.1:8000 | true | Docker host url
-| MILVUS_URL | http://127.0.0.1:19530 | false | Milvus server url|
+| Parameters | Default               | required |    description    |
+| :--------- | :-------------------- | :------: | :---------------: |
+| HOST_URL   | http://127.0.0.1:8000 |   true   |  Docker host url  |
+| MILVUS_URL | 127.0.0.1:19530       |  false   | Milvus server url |
 
 Once you start the docker, open the browser, type `http://127.0.0.1:3000`, you can view the milvus insight.
 
 ## ✨ Building and Running Milvus insight, and/or Contributing Code
+
 You might want to build Milvus-insight locally to contribute some code, test out the latest features, or try
 out an open PR:
 
@@ -38,23 +38,24 @@ out an open PR:
 3. `$ yarn install` to install dependencies
 4. Create a branch for your PR
 
-
 ## 📖 Documentation
+
 TBD
 
 ## Community
-👉 Join the Milvus community on [Slack](https://join.slack.com/t/milvusio/shared_invite/zt-e0u4qu3k-bI2GDNys3ZqX1YCJ9OM~GQ) to share your suggestions, advice, and questions with our engineering team. 
+
+👉 Join the Milvus community on [Slack](https://join.slack.com/t/milvusio/shared_invite/zt-e0u4qu3k-bI2GDNys3ZqX1YCJ9OM~GQ) to share your suggestions, advice, and questions with our engineering team.
 
 <a href="https://join.slack.com/t/milvusio/shared_invite/zt-e0u4qu3k-bI2GDNys3ZqX1YCJ9OM~GQ">
     <img src="https://zillizstorage.blob.core.windows.net/zilliz-assets/zilliz-assets/assets/readme_slack_4a07c4c92f.png" alt="Miluvs Slack Channel"  height="150" width="500">
 </a>
 
 ### ❓ Questions? Problems?
+
 - If you've found a bug or want to request a feature, please create a [GitHub Issue](https://github.com/milvus-io/milvus-insight/issues/new/choose).
   Please check to make sure someone else hasn't already created an issue for the same topic.
 - Need help using Milvus insight? Ask away on our [Milvus insight Discuss Forum](https://github.com/milvus-io/milvus-insight/discussions) and a fellow community member or
-Milvus engineer will be glad to help you out.
-
+  Milvus engineer will be glad to help you out.
 
 [milvus-doc]: https://milvus.io/docs/home
-[Nestjs]: https://docs.nestjs.com/
+[nestjs]: https://docs.nestjs.com/

client/public/.env

@@ -1,2 +1,2 @@
-URL=http://
-API_URL=http://127.0.0.1:3000
+MILVUS_URL=127.0.0.1:19530
+HOST_URL=http://127.0.0.1:3000

client/public/env-config.js

@@ -1,4 +1,4 @@
 window._env_ = {
-  URL: 'http://',
-  API_URL: 'http://127.0.0.1:3000',
+  MILVUS_URL: '127.0.0.1:19530',
+  HOST_URL: 'http://127.0.0.1:3000',
 };

client/src/context/Auth.tsx

@@ -19,6 +19,9 @@ export const AuthProvider = (props: { children: React.ReactNode }) => {
   useEffect(() => {
     const check = async () => {
       const milvusAddress = window.localStorage.getItem(MILVUS_ADDRESS) || '';
+      if (!milvusAddress) {
+        return;
+      }
       try {
         const res = await MilvusHttp.check(milvusAddress);
         setAddress(res.connected ? milvusAddress : '');

client/src/http/Axios.ts

@@ -5,10 +5,7 @@ console.log(process.env.NODE_ENV, 'api:', process.env.REACT_APP_BASE_URL);
 console.log('docker env', (window as any)._env_);
 
 export const url =
-  ((window as any)._env_ &&
-    (window as any)._env_.API_URL !== null &&
-    (window as any)._env_.API_URL !== 'null' &&
-    (window as any)._env_.API_URL) ||
+  ((window as any)._env_ && (window as any)._env_.HOST_URL) ||
   process.env.REACT_APP_BASE_URL;
 
 const axiosInstance = axios.create({

client/src/pages/connect/Connect.tsx

@@ -4,7 +4,7 @@ import { ITextfieldConfig } from '../../components/customInput/Types';
 import icons from '../../components/icons/Icons';
 import ConnectContainer from './ConnectContainer';
 import CustomInput from '../../components/customInput/CustomInput';
-import { useContext, useMemo, useState } from 'react';
+import { useContext, useEffect, useMemo, useState } from 'react';
 import { formatForm } from '../../utils/Form';
 import { useFormValidation } from '../../hooks/Form';
 import CustomButton from '../../components/customButton/CustomButton';
@@ -42,6 +42,8 @@ const useStyles = makeStyles((theme: Theme) => ({
     margin: theme.spacing(3, 0, 0.5),
   },
 }));
+const MILVUS_URL =
+  ((window as any)._env_ && (window as any)._env_.MILVUS_URL) || '';
 
 const Connect = () => {
   const history = useHistory();
@@ -55,7 +57,7 @@ const Connect = () => {
   const { t: successTrans } = useTranslation('success');
 
   const [form, setForm] = useState({
-    address: '',
+    address: MILVUS_URL,
   });
   const checkedForm = useMemo(() => {
     const { address } = form;
@@ -91,6 +93,7 @@ const Connect = () => {
         errorText: warningTrans('required', { name: milvusTrans.address }),
       },
     ],
+    defaultValue: form.address,
   };
 
   return (
@@ -110,7 +113,7 @@ const Connect = () => {
         />
         <CustomButton
           variant="contained"
-          disabled={disabled}
+          disabled={form.address ? false : disabled}
           onClick={handleConnect}
         >
           {btnTrans('connect')}

server/src/milvus/milvus.service.ts

@@ -7,8 +7,6 @@ export class MilvusService {
 
   constructor() {
     this.milvusAddress = '';
-    // todo: this is easy for test. need delete it before publish
-    // this.milvusClient = new MilvusNode('127.0.0.1:19530');
   }
 
   get milvusAddressGetter() {
@@ -20,8 +18,9 @@ export class MilvusService {
   }
 
   async connectMilvus(address: string) {
+    const milvusAddress = address.replace(/(http|https):\/\//, '');
     try {
-      this.milvusClient = new MilvusNode(address);
+      this.milvusClient = new MilvusNode(milvusAddress);
       await this.milvusClient.hasCollection({
         collection_name: 'not_exist',
       });