qq_39778055的博客

上一篇文章介绍了在我的项目中如何使用vue-router和vuex实现登陆时的权限验证，并根据权限生成了特定用户的动态路由，在拿到对应的路由之后，就可以根据路由来动态生成侧边栏，这里就需要使用到递归组件，因为实际开发的过程中，路由可能是多级嵌套的，我们没法确定到底有多少，嵌套路由的使用可以参考vue-router官方文档。递归组件实现方法也有很多种，这里主要介绍一下我的实现方式。目录1.router-view2.侧边栏递归组件的实现逻辑3.代码实现(1) index.vue（2）Me

在任何一个前后端项目中都会涉及到权限验证的问题，在vue-router中由于有了vue-router函数从而就使得权限验证很简单，基本的逻辑为用户登陆成功之后获取用于的token，再根据token去获取用户的权限信息，根据权限信息去匹配路由，从而动态生成路由表，再根据路由表去渲染侧边栏。其中需要使用到vuex进行全局的状态管理。目录1.addRoutes2.代码实现(1) router中的路由(2)vuex中的状态管理（3）permisson.js3. 最终效果4.Githu

在前面搭建好了前后台的基本框架之后，就可以使用websocket+scrapy来开发和用户交互的实时爬虫系统了。基本的思路为：当用户在前台发送请求之后，通过websocket的方式来进行前后台交互，并且通过websocket来实时通知用户此时的爬虫进度。1.前台页面的搭建<div class="app-container"> <div class="filter-container"> <el-input v-model="keyword" pla

1.什么是websocket对于传统的web开发而言，是前台发送请求，后端接口返回对应的数据。但是在爬虫网页项目中当用户在页面上发送爬取请求之后，这个时候如果是传统的ajax请求，则前台就会阻塞，并且我们需要后台实时的通知用户现在爬虫的爬取进度。为了完成这一系列的交互功能，我们就需要使用websocket。websocket本质上就是一种协议，这种协议可以允许服务端主动给客户端客户端推送数据，在与vue相结合之后可以实现实时的数据刷新与展示效果。2.如何在aiohttp中使用websocketa

目录1.综述2.登陆验证3.代码实现(1)数据库的结构(2)后台接口函数(3)前台js函数4.Github地址1.综述在搭建完flask后台之后,就可以前台页面的搭建了，我选用的是vue-element-admin,直接git下来之后使用npm安装完依赖就可以直接跑起来了，不过首先需要解决的就是登陆验证的问题，我这里只是说一下我的解决方法，并且还没有考虑到权限的问题，因为权限的问题比较复杂，我的这个项目还没做到，等做到了再给大家分享我的解决方法.2.登陆验证vue

1.为什么使用Flask搭建后台 2.Flask后台的搭建过1.为什么使用Flask搭建后台python的web restful矿建很多，有django的，有fastapi，有flask等等，flask与django相比的优势在于它的耦合度较低，可以自己定制很多需要的功能，我一般更喜欢自己去定制某些特定的需求，与fastpi等相比，它的异步通信功能以及websocket等都有较为成熟的实现，所以综上，我选择了使用flask作为后台的restful接口，至于爬虫框架，选择是的scrapy.2.后台