权限实现思路 前端记录所有路由，通过角色动态控制。 前端在 router/index.js 中，定义出所有页面的路由，在每个 router 节点上，我们给增加一个角色属性。 用户在登录系统后，后端返回的用户信息中，就有用户的角色。前端需要判断每个路由节点的 role 数组中，是否包含这个角色，如果包含，就保留此router，否则就过滤掉。最后前端只需要将过滤完成后的路由展示在页面上即可。 实现步骤 后端返回用户角色，例如admin、user 前端根据角色判断是否展示菜单—菜单增加role角色属性实现 ，例如： { path: "/usermanage", name: "用户管理", icon: "User", component: Layout, meta:{title:"用户管理",role:['admin']}, children: [ { path: '/usermanage/user' ...

实现思路 要想实现类似SSH终端功能并非易事，主要难点在于页面与连接的目标是实时交互的。说起实时交互，相信大家都有接触过，例如qq、微信、在线客服这些都是，像一些网页版的在线聊天系统常用的实现方案就是websocket。 WebSocket协议与HTTP的主要区别：HTTP是无状态协议，由客户端发起请求，客户端与服务器“一问一答”，因此服务器端无法主动向客户端发送信息。而WebSocket是基于TCP长连接的协议，客户端与服务器建立连接后，服务器端随时能向客户端发送信息。 WebSocket协议的主要价值在于其与HTTP的差异（服务器端与客户端能够保持实时的双向通信），使其在某些应用情景下比HTTP更能满足技术需求。 Django Web框架实现WebSocket主要有两种方式：channels和dwebsocket。 Channels是针对Django项目的一个增强框架，使得Django不仅支持HTTP协议，还能支持WebSocket协议。 为了更好的模拟shell终端，还需要一个前端库xterm.js ，这是一个比较成熟的shell终端模拟库，目前大部分公司实现的webssh都是用 ...

基本介绍 django-apscheduler支持三种调度任务：固定时间间隔，固定时间点（日期），Crontab 命令。同时，它还支持异步执行、后台执行调度任务 配置简单、功能齐全、使用灵活、支持windows和linux，适合中小型项目。 django-apscheduler中相关的概念和python的定时任务框架apscheduler中的概念是一样的。 可以独立运行，也可以放在程序（如Django、Flask）中。 灵活，可以在程序开始前开启定时任务，也可以执行到某个任务时，立即可开启定时任务。 如果依赖程序的话，会占用程序资源。 基础组件： APScheduler 有四种组件，分别是：调度器(scheduler)，作业存储(job store)，触发器(trigger)，执行器(executor)。 schedulers（调度器） 它是任务调度器，属于控制器角色。它配置作业存储器和执行器可以在调度器中完成，例如添加、修改和移除作业。 triggers（触发器） 描述调度任务被触发的条件。不过触发器完全是无状态的。 job stores（作业存储器） 任务持久化仓库，默认保存 ...

环境准备 1.操作系统版本 2.关闭防火墙 systemctl stop firewalld 3.关闭selinux setenforce 0 4.永久关闭selinux，修改完保存退出 vim /etc/selinux/configSELINUX=disabled 5.下载安装包 百度网盘链接: https://pan.baidu.com/s/1oCNdwR7is_-gbCD0nTlyow 提取码: caj8 yum安装依赖离线包 若通外网，可以直接yum在线安装 yum -y install pcre-devel gcc make nginx 1.拷贝zabbix_agent.zip包到服务器root家目录 2.解压安装包 unzip zabbix_agent.zip 3.安装 cd zabbix_agentyum localinstall *.rpm -y 安装zabbix客户端 1.拷贝zabbix-7.0.3.tar.gz到服务器root家目录 2.解压安装包 tar -zxf zabbix-7.0.3.tar.gz 3.创建zabbix账号 groupadd --sy ...

环境准备 1.操作系统版本 2.关闭防火墙 systemctl stop firewalld 3.关闭selinux setenforce 0 4.永久关闭selinux，修改完保存退出 vim /etc/selinux/configSELINUX=disabled 5.下载安装包 百度网盘链接: https://pan.baidu.com/s/1nRkRKi0ifsSyGo9mPVhlNg 提取码: xc85 yum安装依赖离线包 若通外网，可以直接yum在线安装 yum -y install net-tools nginx pcre-devel gcc make libxml2 libxml2-devel net-snmp-devel OpenIPMI-devel libevent-devel libcurl-devel libxml2-devel libjpeg-devel libpng-devel openssl-devel libcurl-devel libxslt-devel libzip-devel wget vim unzip oniguruma-devel gd g ...

介绍 Vue Router 是 Vue.js (opens new window)官方的路由管理器。它和 Vue.js 的 核心深度集成，包含的功能有： 嵌套的路由/视图表 模块化的、基于组件的路由配置 路由参数、查询、通配符 基于Vue.js 过渡系统的视图过渡效果 细粒度的导航控制 使用 在用脚手架创建项目时已经选择安装上了，如果刚开始没有，通过npm安装： npm install vue-router@4 安装完后会有router目录： 使用流程： 开发页面（组件） 定义路由 组件使用路由 路由传参 URL传参：一般用于页面跳转，将当前数据传递到新页面，例如详情页 params传参 - 配置路由：{path: '/user/:id', component: about}- 传递方式：<router-link to="/user/6/"></router-link>- 传递后路径：/user/6- 接收参数：$route.params.id query传 ...

介绍 在前端页面展示的数据大多数都是通过访问一个API获取的，做这件事的方法有好几种，例如 jquery ajax、vue-resource、axios，而vue-resource是vue插件，但3版本不再更新，目前官方 推荐主流的axios，aixos是一个http请求库。 官方文档：http://www.axios-js.com/zh-cn/docs/ 使用 使用流程： 1、安装axios：npm install axios 2、在main.js文件中全局注册 3、在组件中使用 如果打开页面就自动渲染，可以放到mounted生命周期钩子 中获取数据并赋值： 异常处理 很多时候我们可能并没有从API 获取想要的数据。这可能是由于很多种因素引起的，比如axios 调用可能由于多种原因而失败，包括但不限于： API 不工作了； 请求发错了； API 没有按我们预期的格式返回信息。 可以使用catch异常处理这些问题。 模拟连接一个未存在的地址，前端给出提示： 全局默认值 在实际开发中，几乎每个组件都会用到axios发起数据请求，如果每次都填写完整的请求路径，不 利 ...

介绍 组件：一段独立的，能代表页面某一个部分的代码片段，拥有自己独立的数据、JavaScript脚本、 以及CSS样式。 组件是可复用的Vue实例，在开发过程中可以把经常重复的功能，封装为组件，达到快捷开发的 目的。 组件的好处： 提高开发效率 方便重复使用 易于管理和维护 通常一个应用会以一棵嵌套的组件树的形式来组织，如图所 示。 例如，你可能会有页头、侧边栏、内容区等组件，每个组件 又包含了其它的像导航链接、博文之类的组件。 文件格式 Vue单文件组件（又名*.vue文件，缩写为SFC）是一种特殊的文件格式，它允许讲Vue组件的模板、逻辑与样式封装在单个文件中。 正如所见，Vue SFC 是经典的HTML、CSS 与JavaScript 三个经典组合的自然延伸。每个*.vue 文件由三种类型的顶层代码块组成：<template>、<script> 与 <style>：- <template> 部分定义了组件的模板。- <script> 部分是一个标准的JavaScript 模块。它应该导出一个Vue 组件 ...

Vue Cli 脚手架介绍 到目前为止，已经会了Vue基本使用，但这种在HTML引用Vue.js的方式，简单的页面还是没问题 的，如果用Vue开发整个前端项目，组建Vue项目结构及配置还是比较复杂的，例如引入各种js文 件、打包上线等。因此，为了提高开发效率，官方开发了VueCli脚手架快捷搭建开发环境。 Vue CLI 是一个基于Vue.js 进行快速开发的完整系统，提供： 通过@vue/cli 实现的交互式的项目脚手架。 通过@vue/cli + @vue/cli-service-global 实现的零配置原型开发。 一个运行时依赖(@vue/cli-service)，该依赖： 可升级； 基于webpack 构建，并带有合理的默认配置； 可以通过项目内的配置文件进行配置； 可以通过插件进行扩展。 一个丰富的官方插件集合，集成了前端生态中最好的工具。 一套完全图形化的创建和管理Vue.js 项目的用户界面。 Vue CLI 致力于将Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配 置即可平稳衔接，这样你可以专注在撰写应用 ...

生命周期是指Vue实例从创建到销毁的过程。就是vue实例从开始创建、 初始化数据、编译模板、挂载Dom、渲染->更新->渲染、卸载等⼀系 列过程，在vue⽣命周期中提供了⼀系列的⽣命周期函数，如图所⽰。