diff --git a/code/api/.vscode/launch.json b/code/api/.vscode/launch.json
index a5ba887..1280783 100644
--- a/code/api/.vscode/launch.json
+++ b/code/api/.vscode/launch.json
@@ -18,7 +18,6 @@
                 "-g postgres://postgres:123@10.8.30.32:5432/iot_auth",
                 "--redisHost 10.8.30.112",
                 "--redisPort 6379",
-                "--iotVcmpApi http://127.0.0.1:4000",
             ]
         },
         {
diff --git a/code/api/app/lib/controllers/auth/app.js b/code/api/app/lib/controllers/auth/app.js
index f946640..d774678 100644
--- a/code/api/app/lib/controllers/auth/app.js
+++ b/code/api/app/lib/controllers/auth/app.js
@@ -43,7 +43,7 @@ async function apply (ctx) {
         };
     }
 }
-
+   
 async function refresh (ctx) {
     const transaction = await ctx.fs.dc.orm.transaction();
     try {
diff --git a/code/web/client/index.ejs b/code/web/client/index.ejs
index 036164a..46a6482 100644
--- a/code/web/client/index.ejs
+++ b/code/web/client/index.ejs
@@ -9,7 +9,7 @@
 </head>
 
 <body>
-    <div id='App'></div>
+    <div id='IotAuthApp'></div>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/code/web/client/index.html b/code/web/client/index.html
index 2625b5c..6da38f0 100644
--- a/code/web/client/index.html
+++ b/code/web/client/index.html
@@ -9,12 +9,12 @@
 </head>
 
 <body>
-    <div id='App'></div>
+    <div id='IotAuthApp'></div>
 
     <!-- Webpack -->
     <script type="text/javascript" src="http://localhost:5201/client/build/app.js"></script>
     <!-- Vite -->
-    <script type="module">
+    <!-- <script type="module">
         import RefreshRuntime from "http://localhost:5202/@react-refresh"
         RefreshRuntime.injectIntoGlobalHook(window)
         window.$RefreshReg$ = () => { }
@@ -22,7 +22,7 @@
         window.__vite_plugin_react_preamble_installed__ = true
         const global = window
     </script>
-    <script type="module" src="http://localhost:5202/src/index.jsx"></script>
+    <script type="module" src="http://localhost:5202/src/index.jsx"></script> -->
     <!-- Vite End -->
     <script>
         //过滤掉一些无用的警告、没有价值的报错
diff --git a/code/web/client/src/app.jsx b/code/web/client/src/app.jsx
index 5521b0c..550f842 100644
--- a/code/web/client/src/app.jsx
+++ b/code/web/client/src/app.jsx
@@ -3,6 +3,7 @@
 import React, { useEffect } from 'react';
 import Layout from './layout';
 import Auth from './sections/auth';
+import MicroApp from './sections/microApp'
 
 const App = props => {
     const { projectName } = props
@@ -14,7 +15,10 @@ const App = props => {
     return (
         <Layout
             title={projectName}
-            sections={[Auth]}
+            sections={[
+                Auth,
+                // MicroApp
+            ]}
         />
     )
 }
diff --git a/code/web/client/src/index.jsx b/code/web/client/src/index.jsx
index 9a2559a..07461c5 100644
--- a/code/web/client/src/index.jsx
+++ b/code/web/client/src/index.jsx
@@ -1,8 +1,12 @@
 'use strict';
 
+import './public-path'
 import React from 'react';
 import { render } from 'react-dom';
 import App from './app';
 import './index.less';
+import microApp from '@micro-zoe/micro-app'
 
-render((<App projectName="飞尚物联" />), document.getElementById('App'));
\ No newline at end of file
+microApp.start()
+
+render((<App projectName="飞尚物联" />), document.getElementById('IotAuthApp'));
\ No newline at end of file
diff --git a/code/web/client/src/layout/components/header/index.jsx b/code/web/client/src/layout/components/header/index.jsx
index a630086..7a07a92 100644
--- a/code/web/client/src/layout/components/header/index.jsx
+++ b/code/web/client/src/layout/components/header/index.jsx
@@ -4,82 +4,85 @@ import { connect } from "react-redux";
 import { Nav, Avatar, Dropdown } from "@douyinfe/semi-ui";
 
 const Header = (props) => {
-  const { dispatch, history, user, actions, socket } = props;
+    const { dispatch, history, user, actions, socket } = props;
 
-  return (
-    <>
-      <Nav
-        mode={"horizontal"}
-        onClick={({ itemKey }) => {
-          if (itemKey == "logout") {
-            dispatch(actions.auth.logout());
-            if (socket) {
-              socket.disconnect();
-            }
-            history.push(`/signin`);
-          }
-        }}
-        style={{
-          height: 60,
-          minWidth: 520,
-          background: "url(/assets/images/background/header.png)",
-          backgroundSize: "100% 100%",
-          color: "white",
-        }}
-        header={{
-          logo: (
-            <img
-              src="/assets/images/background/logo.png"
-              style={{ display: "inline-block", width: 280, height: 52}}
-            />
-          ),
-          text: "",
-        }}
-        footer={
-          <Nav.Sub
-            itemKey={"user"}
-            text={
-              <div
+    return (
+        <>
+            <Nav
+                mode={"horizontal"}
+                onClick={({ itemKey }) => {
+                    if (itemKey == "logout") {
+                        dispatch(actions.auth.logout());
+                        if (socket) {
+                            socket.disconnect();
+                        }
+                        history.push(`/signin`);
+                    }
+                }}
                 style={{
-                  marginLeft: 20,
-                  display: "inline-block",
-                  color: "white",
+                    height: 60,
+                    minWidth: 520,
+                    background: `url(${__webpack_public_path__}assets/images/background/header.png)`,
+                    backgroundSize: "100% 100%",
+                    color: "white",
                 }}
-              >
-                <img
-                  src="/assets/images/background/notice.png"
-                  style={{
-                    display: "inline-block",
-                    width: 18,
-                    height: 18,
-                    position: "relative",
-                    top: 6,
-                    left: -10,
-                  }}
-                />
+                header={{
+                    logo: (
+                        <img
+                            src={`/assets/images/background/logo.png`}
+                            style={{ display: "inline-block", width: 280, height: 52 }}
+                        />
+                    ),
+                    text: "",
+                }}
+                footer={
+                    <Nav.Sub
+                        itemKey={"user"}
+                        dropdownStyle={{
+                            position: 'relative'
+                        }}
+                        text={
+                            <div
+                                style={{
+                                    marginLeft: 20,
+                                    display: "inline-block",
+                                    color: "white",
+                                }}
+                            >
+                                <img
+                                    src={`/assets/images/background/notice.png`}
+                                    style={{
+                                        display: "inline-block",
+                                        width: 18,
+                                        height: 18,
+                                        position: "relative",
+                                        top: 6,
+                                        left: -10,
+                                    }}
+                                />
 
-                <Avatar size="small" color="light-blue" style={{ margin: 4 }}>
-                  <img src="/assets/images/avatar/6.png" />
-                </Avatar>
-                {user && user.namePresent}
-              </div>
-            }
-          >
-            <Nav.Item itemKey={"logout"} text={"退出"} />
-          </Nav.Sub>
-        }
-      />
-    </>
-  );
+                                <Avatar size="small" color="light-blue" style={{ margin: 4 }}>
+                                    <img src="/assets/images/avatar/6.png" />
+                                </Avatar>
+                                {user && user.namePresent}
+                            </div>
+                        }
+                    >
+                        <Nav.Item itemKey={"logout"} text={"退出"} />
+                    </Nav.Sub>
+                }
+            />
+        </>
+    );
 };
 
-function mapStateToProps(state) {
-  const { global, auth, webSocket } = state;
-  return {
-    actions: global.actions,
-    user: auth.user,
-    socket: webSocket.socket,
-  };
+function mapStateToProps (state) {
+    const { global, auth, webSocket } = state;
+    return {
+        actions: global.actions,
+        user: auth.user,
+        socket: webSocket.socket,
+    };
 }
 
 export default connect(mapStateToProps)(Header);
diff --git a/code/web/client/src/layout/index.jsx b/code/web/client/src/layout/index.jsx
index ed0809c..8f99148 100644
--- a/code/web/client/src/layout/index.jsx
+++ b/code/web/client/src/layout/index.jsx
@@ -6,7 +6,7 @@ import { Provider } from 'react-redux';
 import { createBrowserHistory } from 'history';
 import { ConnectedRouter } from 'connected-react-router'
 import { Layout, NoMatch } from './containers';
-import { Switch, Route } from "react-router-dom";
+import { BrowserRouter, Switch, Route } from "react-router-dom";
 import { ConfigProvider } from '@douyinfe/semi-ui';
 import layoutActions from './actions';
 import zhCN from '@douyinfe/semi-ui/lib/es/locale/source/zh_CN';
@@ -154,23 +154,25 @@ const Root = props => {
         store ?
             <ConfigProvider locale={zhCN}>
                 <Provider store={store}>
-                    <ConnectedRouter history={history}>
-                        <Switch>
-                            {outerRoutes}
-                            <Layout
-                                history={history}
-                                routes={innnerRoutes}
-                            >
-                                {combineRoutes}
-                            </Layout>
-                            <Route
-                                path={'*'}
-                                component={NoMatch}
-                            />
-                        </Switch>
-                    </ConnectedRouter>
+                    <BrowserRouter basename={window.__MICRO_APP_BASE_ROUTE__ || '/'}>
+                        <ConnectedRouter history={history}>
+                            <Switch>
+                                {outerRoutes}
+                                <Layout
+                                    history={history}
+                                    routes={innnerRoutes}
+                                >
+                                    {combineRoutes}
+                                </Layout>
+                                <Route
+                                    path={'*'}
+                                    component={NoMatch}
+                                />
+                            </Switch>
+                        </ConnectedRouter>
+                    </BrowserRouter >
                 </Provider>
-            </ConfigProvider>
+            </ConfigProvider >
             : ''
     )
 }
diff --git a/code/web/client/src/public-path.js b/code/web/client/src/public-path.js
new file mode 100644
index 0000000..a9ca8b3
--- /dev/null
+++ b/code/web/client/src/public-path.js
@@ -0,0 +1,7 @@
+// __MICRO_APP_ENVIRONMENT__和__MICRO_APP_PUBLIC_PATH__是由micro-app注入的全局变量
+if (window.__MICRO_APP_ENVIRONMENT__) {
+    // eslint-disable-next-line
+    __webpack_public_path__ = window.__MICRO_APP_PUBLIC_PATH__
+} else {
+    __webpack_public_path__ = '/'
+}
\ No newline at end of file
diff --git a/code/web/client/src/sections/microApp/actions/index.js b/code/web/client/src/sections/microApp/actions/index.js
new file mode 100644
index 0000000..77dbf80
--- /dev/null
+++ b/code/web/client/src/sections/microApp/actions/index.js
@@ -0,0 +1,5 @@
+'use strict';
+
+export default {
+   
+}
\ No newline at end of file
diff --git a/code/web/client/src/sections/microApp/containers/index.js b/code/web/client/src/sections/microApp/containers/index.js
new file mode 100644
index 0000000..2466c39
--- /dev/null
+++ b/code/web/client/src/sections/microApp/containers/index.js
@@ -0,0 +1,5 @@
+'use strict';
+
+import MicroApp from './microApp';
+
+export { MicroApp };
\ No newline at end of file
diff --git a/code/web/client/src/sections/microApp/containers/microApp.jsx b/code/web/client/src/sections/microApp/containers/microApp.jsx
new file mode 100644
index 0000000..2943eb3
--- /dev/null
+++ b/code/web/client/src/sections/microApp/containers/microApp.jsx
@@ -0,0 +1,37 @@
+import React, { useEffect } from 'react';
+import { connect } from 'react-redux';
+import { Spin, Card } from '@douyinfe/semi-ui';
+
+const MicroApp = (props) => {
+    const { dispatch, actions, } = props
+
+    return (
+        <div>
+            <p>MicroApp</p>
+            <div style={{
+                height: 'calc(100% - 64px)', overflow: 'auto', position: 'absolute',
+            }}>
+                <micro-app
+                    name='microapp-test'
+                    url='http://localhost:5000/'
+                    baseroute='/microApp'
+                    inline
+                // disableSandbox
+                // shadowDOM
+                style={{height:'100%'}}
+                >
+                    microApp
+                </micro-app>
+            </div>
+        </div>
+    )
+}
+
+function mapStateToProps (state) {
+    const { auth, global } = state;
+    return {
+
+    };
+}
+
+export default connect(mapStateToProps)(MicroApp);
diff --git a/code/web/client/src/sections/microApp/index.js b/code/web/client/src/sections/microApp/index.js
new file mode 100644
index 0000000..cfcb401
--- /dev/null
+++ b/code/web/client/src/sections/microApp/index.js
@@ -0,0 +1,15 @@
+'use strict';
+
+import reducers from './reducers';
+import routes from './routes';
+import actions from './actions';
+import { getNavItem } from './nav-item';
+
+export default {
+   key: 'microApp',
+   name: 'MicroApp',
+   reducers: reducers,
+   routes: routes,
+   actions: actions,
+   getNavItem: getNavItem
+};
\ No newline at end of file
diff --git a/code/web/client/src/sections/microApp/nav-item.jsx b/code/web/client/src/sections/microApp/nav-item.jsx
new file mode 100644
index 0000000..3ce11c2
--- /dev/null
+++ b/code/web/client/src/sections/microApp/nav-item.jsx
@@ -0,0 +1,13 @@
+import React from 'react';
+import { IconCode } from '@douyinfe/semi-icons';
+
+export function getNavItem (user, dispatch) {
+   return (
+      [
+         {
+            itemKey: 'MicroApp', text: 'MicroApp', icon: <IconCode />,
+            to: '/microApp',
+         },
+      ]
+   );
+}
\ No newline at end of file
diff --git a/code/web/client/src/sections/microApp/reducers/index.js b/code/web/client/src/sections/microApp/reducers/index.js
new file mode 100644
index 0000000..7ed1088
--- /dev/null
+++ b/code/web/client/src/sections/microApp/reducers/index.js
@@ -0,0 +1,5 @@
+'use strict';
+
+export default {
+
+}
\ No newline at end of file
diff --git a/code/web/client/src/sections/microApp/routes.js b/code/web/client/src/sections/microApp/routes.js
new file mode 100644
index 0000000..f717bbd
--- /dev/null
+++ b/code/web/client/src/sections/microApp/routes.js
@@ -0,0 +1,12 @@
+'use strict';
+import { MicroApp, } from './containers';
+
+export default [{
+   type: 'inner',
+   route: {
+      path: '/microApp',
+      key: 'microApp',
+      breadcrumb: 'microApp',
+      component: MicroApp,
+   }
+}];
\ No newline at end of file
diff --git a/code/web/middlewares/webpack-dev.js b/code/web/middlewares/webpack-dev.js
index 65b4648..ba6ae90 100644
--- a/code/web/middlewares/webpack-dev.js
+++ b/code/web/middlewares/webpack-dev.js
@@ -29,6 +29,20 @@ module.exports = {
         }));
 
         const server = express();
+
+        server.all("*", function (req, res, next) {
+            //设置允许跨域的域名，*代表允许任意域名跨域
+            res.header("Access-Control-Allow-Origin", "*");
+            //允许的header类型
+            res.header("Access-Control-Allow-Headers", "content-type");
+            //跨域允许的请求方式 
+            res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
+            if (req.method == 'OPTIONS')
+               res.sendStatus(200); //让options尝试请求快速结束
+            else
+               next();
+         });
+         
         server.use(middleware(compiler));
         // server.use(require("webpack-hot-middleware")(compiler));
         server.listen('5201', function (err) {
diff --git a/code/web/package.json b/code/web/package.json
index 84dc5b9..1c71558 100644
--- a/code/web/package.json
+++ b/code/web/package.json
@@ -49,6 +49,7 @@
    "dependencies": {
       "@douyinfe/semi-ui": "^2.8.0",
       "@fs/attachment": "^1.0.0",
+      "@micro-zoe/micro-app": "^1.0.0-alpha.1",
       "@peace/components": "0.0.35",
       "@peace/utils": "^0.0.48",
       "@vitejs/plugin-react": "^1.3.1",
diff --git a/code/web/webpack.config.js b/code/web/webpack.config.js
index 5873d01..ea3841f 100644
--- a/code/web/webpack.config.js
+++ b/code/web/webpack.config.js
@@ -12,9 +12,13 @@ module.exports = {
     devtool: 'source-map',
     devServer: {
         historyApiFallback: true,
+        // 为 MicroApp 配置跨域
+        'Access-Control-Allow-Origin': '*',
+        allowedHosts: ['127.0.0.1:5200'],
     },
     entry: {
-        app: ["@babel/polyfill", PATHS.app]
+        app: ["@babel/polyfill", PATHS.app],
+      
     },
     output: {
         publicPath: '/client/build/',
