diff --git a/.roadhogrc.mock.js b/.roadhogrc.mock.js
index 36e6e97f053e60e3f0f12b1cdd65bfa0efcee248..cf82620d012eb394a41cc7b270878aad68cb61b5 100644
--- a/.roadhogrc.mock.js
+++ b/.roadhogrc.mock.js
@@ -79,6 +79,33 @@ const proxy = {
     res.send({ status: 'ok' });
   },
   'GET /api/notices': getNotices,
+  'GET /api/500': (req, res) => {
+    res.status(500).send({
+      "timestamp": 1513932555104,
+      "status": 500,
+      "error": "error",
+      "message": "error",
+      "path": "/base/category/list"
+    });
+  },
+  'GET /api/404': (req, res) => {
+    res.status(404).send({
+      "timestamp": 1513932643431,
+      "status": 404,
+      "error": "Not Found",
+      "message": "No message available",
+      "path": "/base/category/list/2121212"
+    });
+  },
+  'GET /api/403': (req, res) => {
+    res.status(403).send({
+      "timestamp": 1513932555104,
+      "status": 403,
+      "error": "Unauthorized",
+      "message": "Unauthorized",
+      "path": "/base/category/list"
+    });
+  },
 };
 
 export default noProxy ? {} : delay(proxy, 1000);
diff --git a/src/common/menu.js b/src/common/menu.js
index 9fd3f3fef398a6cfa03a4ef4432f4cce573ddad5..e73b95b3609bbd8c7d61d1e57f230b3537994199 100644
--- a/src/common/menu.js
+++ b/src/common/menu.js
@@ -89,6 +89,9 @@ const menuData = [{
   }, {
     name: '500',
     path: '500',
+  }, {
+    name: '触发异常',
+    path: 'trigger',
   }],
 }, {
   name: '账户',
diff --git a/src/common/router.js b/src/common/router.js
index 612fee151ab84a24116bfd085078e9a995ad3d08..a2305f5f5a96e9618264eb4b28a6e1c21927a22c 100644
--- a/src/common/router.js
+++ b/src/common/router.js
@@ -104,6 +104,9 @@ export const getRouterData = (app) => {
     '/exception/500': {
       component: dynamicWrapper(app, [], () => import('../routes/Exception/500')),
     },
+    '/exception/trigger': {
+      component: dynamicWrapper(app, ['error'], () => import('../routes/Exception/triggerException')),
+    },
     '/user': {
       component: dynamicWrapper(app, [], () => import('../layouts/UserLayout')),
     },
diff --git a/src/error.js b/src/error.js
new file mode 100644
index 0000000000000000000000000000000000000000..83d1386d5c5a574251c39ac78edc60edbdbd2d09
--- /dev/null
+++ b/src/error.js
@@ -0,0 +1,17 @@
+import { routerRedux } from 'dva/router';
+
+const error = (e, dispatch) => {
+  if (e.name === 401 || e.name === 403) {
+    dispatch(routerRedux.push('/exception/403'));
+    return;
+  }
+  if (e.name <= 504 && e.name >= 500) {
+    dispatch(routerRedux.push('/exception/500'));
+    return;
+  }
+  if (e.name >= 404 && e.name < 422) {
+    dispatch(routerRedux.push('/exception/404'));
+  }
+};
+
+export default error;
diff --git a/src/index.js b/src/index.js
index 71f460ec1eb0eea0cfcfc06deb6b220db3d21272..1298630b815cdd62cbed509ad6669bc76367c29c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -3,12 +3,13 @@ import dva from 'dva';
 import 'moment/locale/zh-cn';
 import './g2';
 import './rollbar';
+import onError from './error';
 // import browserHistory from 'history/createBrowserHistory';
 import './index.less';
-
 // 1. Initialize
 const app = dva({
   // history: browserHistory(),
+  onError,
 });
 
 // 2. Plugins
diff --git a/src/models/error.js b/src/models/error.js
new file mode 100644
index 0000000000000000000000000000000000000000..818d65bfcdf20bcf31666537a510846662a2f28a
--- /dev/null
+++ b/src/models/error.js
@@ -0,0 +1,42 @@
+import { query403, query404, query500 } from '../services/error';
+
+export default {
+  namespace: 'error',
+
+  state: {
+    error: '',
+    isloading: false,
+  },
+
+  effects: {
+    *query403(_, { call, put }) {
+      yield call(query403);
+      yield put({
+        type: 'trigger',
+        payload: '403',
+      });
+    },
+    *query500(_, { call, put }) {
+      yield call(query500);
+      yield put({
+        type: 'trigger',
+        payload: '500',
+      });
+    },
+    *query404(_, { call, put }) {
+      yield call(query404);
+      yield put({
+        type: 'trigger',
+        payload: '404',
+      });
+    },
+  },
+
+  reducers: {
+    trigger(state, action) {
+      return {
+        error: action.payload,
+      };
+    },
+  },
+};
diff --git a/src/routes/Exception/style.less b/src/routes/Exception/style.less
new file mode 100644
index 0000000000000000000000000000000000000000..44fccccf43b2e4e58195f05e8149198bd3f627e4
--- /dev/null
+++ b/src/routes/Exception/style.less
@@ -0,0 +1,7 @@
+.trigger {
+  background: "red";
+  :global(.ant-btn) {
+    margin-right: 8px;
+    margin-bottom: 12px;
+  }
+}
diff --git a/src/routes/Exception/triggerException.js b/src/routes/Exception/triggerException.js
new file mode 100644
index 0000000000000000000000000000000000000000..0ed15a9fb1d3ef32d5c441d4dcf1f2b9fccc8b6c
--- /dev/null
+++ b/src/routes/Exception/triggerException.js
@@ -0,0 +1,52 @@
+import React, { PureComponent } from 'react';
+import { Button, Spin } from 'antd';
+import { connect } from 'dva';
+import styles from './style.less';
+
+@connect(state => ({
+  isloading: state.error.isloading,
+}))
+export default class TriggerException extends PureComponent {
+  state={
+    isloading: false,
+  }
+  trigger403 = () => {
+    this.setState({
+      isloading: true,
+    });
+    this.props.dispatch({
+      type: 'error/query403',
+    });
+  };
+  trigger500 = () => {
+    this.setState({
+      isloading: true,
+    });
+    this.props.dispatch({
+      type: 'error/query500',
+    });
+  };
+  trigger404 = () => {
+    this.setState({
+      isloading: true,
+    });
+    this.props.dispatch({
+      type: 'error/query404',
+    });
+  };
+  render() {
+    return (
+      <Spin spinning={this.state.isloading} wrapperClassName={styles.trigger}>
+        <Button type="danger" onClick={this.trigger403}>
+        触发403
+        </Button>
+        <Button type="danger" onClick={this.trigger500}>
+         触发500
+        </Button>
+        <Button type="danger" onClick={this.trigger404}>
+         触发404
+        </Button>
+      </Spin>
+    );
+  }
+}
diff --git a/src/services/error.js b/src/services/error.js
new file mode 100644
index 0000000000000000000000000000000000000000..b1969d82559909d8f71d2c1cb90654ce6bc3fa2b
--- /dev/null
+++ b/src/services/error.js
@@ -0,0 +1,13 @@
+import request from '../utils/request';
+
+export async function query404() {
+  return request('/api/404');
+}
+
+export async function query403() {
+  return request('/api/403');
+}
+
+export async function query500() {
+  return request('/api/500');
+}
diff --git a/src/utils/request.js b/src/utils/request.js
index fa043e3bc1eea8aeb43442e89b4b98064c740e3e..d5c5200e10f2e86596f9479ed3769a2e8017c6e2 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -28,6 +28,7 @@ function checkStatus(response) {
     description: errortext,
   });
   const error = new Error(errortext);
+  error.name = response.status;
   error.response = response;
   throw error;
 }