同步操作将从 ele-admin/easyweb-jwt 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
前后端分离模式的后端管理系统开发平台,前端使用路由实现单页面应用,后端接口遵循RESTful风格。
描述 | 框架 |
---|---|
核心框架 | Spring、Spring MVC、Spring Boot |
持久层 | MyBatis、Druid、MyBatis-Plus |
权限框架 | Spring Security、OAuth2.0 |
描述 | 框架 |
---|---|
核心框架 | Layui、jQuery |
路由框架 | Q.js (纯js轻量级路由框架) |
mvvm框架 | pandyle.js (专为jquery编写的mvvm) |
主要特色 | 单页面 / 响应式 / 简约 / 极易上手 |
开发工具为IDEA,数据库文件存放在项目的
src/main/resources/sql
目录下。
src/main/resources/static
目录下面即可module/config.js
里面的base_url
为后台访问地址nginx
服务器的html
文件夹下面nginx/conf/nginx.conf
配置文件,设置代理以解决跨域问题
http {
server {
# 加入以下配置
location /api {
proxy_pass http://47.98.107.251:8088;
}
}
}
module/config.js
里面的base_url
为http://localhost:80/api/
,80是ngix的端口前后端分离应该采用分离部署的方式,后台应该支持跨域资源共享,但是oauth2我刚接触, 在做跨域的时候无法做到对
/oatuh/
接口的跨域,所以目前只能通过ngix的反向代理解决跨域的问题
如果你担心跨域是否比不跨域更不安全,这种担心完全是多余的,因为跨域问题是只存在于浏览器中的
|-src
|-main
|-java
| |-com.wf.ew
| |-common // 核心模块
| | |-config // 存放SpringBoot配置类
| | | |-MyBatisPlusConfig.java // MyBatisPlus配置
| | | |-SwaggerConfig.java // Swagger2配置
| | |
| | |-exception // 自定义异常类,统一异常处理器
| | |-oauth // 权限配置模块
| | |-utils // 工具类包
| | |-BaseController.java // controller基类
| | |-JsonResult.java // 结果集封装
| | |-PageResult.java // 分页结果集封装
| |
| |-system // 系统管理模块
| |-xxxxxx // 其他业务模块
| |
| |-EasyWebApplication.java // SpringBoot启动类
|
|-resources
|-mapper // mapper文件
| |-system
|
|-application.properties // 配置文件
|-assets
| |-css // 样式
| |-images // 图片
| |-libs // 第三方库
|
|-components // html组件
| |-system // 系统管理页面
| |-xxxxxx // 其他业务页面
| |-tpl // 公用组件
| | |-message.html // 消息
| |-console.html // 主页一
| |-header.html // 头部
| |-side.html // 侧导航
|
|-module // js模块 (使用layui的模块开发方式)
| |-admin.js // admin模块
| |-config.js // config模块
| |-index.js // index模块
|
|-index.html // 主界面
|-login.html // 登陆界面
前后端分离的优势:
注:
后端输出动态页面网页会打开慢,但是ajax渲染数据会不利于SEO优化,像文章、博客、新闻
之类的网站最好是用后端动态输出页面可以利于SEO优化。
以上仅代表我个人观点,具体分离和不分离的优劣可以看看论坛的讨论。
后台管理系统都是表格,界面也比较简单,所以基本都是有后端程序员一条龙服务,后端人员大多 都只会一个jquery、bootstrap,vue需要学习webpack、es6、npm等基础,我不建议后端人员去学习前端的技术, 因为后端的技术还有很多需要我们去学习,我这里的前端所选用的框架都是基于jquery的,相比vue、react来说 后端人员看看文档就会了。
一般网站都是分头部、左侧和底部的,在传统不分离的项目中,大多数都使用iframe或SiteMesh来实现, 在前后端分离的项目中路由是比较流行的解决方案,几种方案优劣比较:
大致可以总结以下三点:
基于token的认证方式是用户通过账号密码登录获取token,token就相当于访问后台接口的一把钥匙, 每次访问后台接口都需要传递token,token是存储在客户端,所以token只要不丢失就不需要再次做登录的操作, 当然token是有一个过期的时间的,过期了就相当于这把钥匙作废了,需要重新登录。
这种场景就是现在app的场景,而基于session的web网站浏览器关闭就需要重新登录。 关于auth2.0无状态鉴权的知识请前往理解OAuth 2.0 - 阮一峰查看。
我理解的就是页面局部加载,跟传统的局部刷新不同的就是url也会变化,是把一个url的内容加载到网页的局部区域, 而不是整个页面跳转。
因为网站的url改变后浏览器默认是会跳转页面的,所以现在的路由普遍采用hash的方式,就是在url后面加#
的方式,
因为浏览器会忽略#
后面的url,认为是同一页面。
前端路由适合用在页面有公共区域的地方,只想改变局部内容,而且改变了局部内容url也对应变化, 这样用户可以复制url再打开就直接进入到相应的页面了,管理系统页面的侧边导航就是一个很好的例子。
都是猿友,撸码不易,如果这个轮子对你有用,不妨打赏一下!
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。