网上书店商城项目

写在前面

本文档手机端查看

文档查看 (浏览器扫描 或者qq扫描跳转浏览器打开~~)

17__c72f1798ce23246d2a6c362d4a5683fa_d385ff93970ceee921dab646eb4581ca

或者浏览器输入 flya.top😃

项目成员介绍

前端软1904苏才华 QQ:2813319028

后端软1905风离(网名)QQ: 1906249747 CSDN Github

项目所用技术栈介绍

项目地址前端 后端

项目协作平台Gitee 后端仓库 Gitee前端仓库

前端:HTML,CSS,JS,Vue,VueX,ElmentUi(基于Vue的美化框架),Axios,ElmentUi后台模板

关于Vue 关于ElementUi 关于Axios

接口文档:Swagger2.0(前后端接口文档生成) 接口文档地址

后端基础框架:Java1.8,Spring,SpringMVC,SpringBoot,MybatisPlus(自动生成MVC基础结构)

关于SpringBoot 关于MVC架构 关于MyBatisPlus

安全框架:Shiro(权限授权认证)查看详细解释

日志打印:log4j (代替sout)

数据库:Mysql5.7,Redis(非关系缓存数据库),数据库连接池Druid(为了方便前后端交互 Mysql Redis均部署在服务器上)

服务器:Tomcat8.0

部署环境:阿里云Linux Centos7.6 Nginx

图片云储存:又拍云查看服务

短信服务:腾讯云短信服务 查看后台

第三方支付:支付宝支付查看服务 微信支付(后续待实现)

第三方接口服务: ISBN获取图书信息接口 (1付费 2免费)免费接口查看

消息中间件:RabbitMQ 查看详细解释

搜索引擎+日志分析+可视化:ElasticSearch Kibana Logstash 查看详细解释

项目上线打包发布: Docker

后端开发参考文档: 阿里巴巴Java开发手册

==================================================================================================================================================================================

项目开发中所用软件及工具:

前端:VScode

后端:IDEA

数据库管理:DataGrip Navicat RDM

数据库UML设计:DataGrip

接口测试工具:Postman

项目文档编辑工具:Typora

项目流程图:ProcessOn 查看流程图和系统架构

前后端分离介绍

1.1什么是前后端分离

在传统的web应用开发中,大多数的程序员会将浏览器作为前后端的分界线。将浏览器中为用户进行页面展示的部分称之为前端,而将运行在服务器,为前端提供业务逻辑和数据准备的所有代码统称为后端。
很多人误以为前后端分离只是一种web应用开发模式,只要在web应用的开发期进行了前后端开发工作的分工就是前后端分离。 前后端分工
其实前后端分离并不只是开发模式,而是web应用的一种架构模式。在开发阶段,前后端工程师约定好数据交互接口,实现并行开发和测试;在运行阶段前后端分离模式需要对web应用进行分离部署,前后端之前使用HTTP或者其他协议进行交互请求。然而作为一种架构模式,我们在实施的过程中主要对以下四个方面来进行比较和重新认识。

前后端分离大概可以从四个方面来理解:

1. 2交互形式

在这里插入图片描述

在前后端分离架构中,后端只需要负责按照约定的数据格式向前端提供可调用的API服务即可。前后端之间通过HTTP请求进行交互,前端获取到数据后,进行页面的组装和渲染,页面跳转,最终返回给浏览器。

1.3 代码组织方式

在这里插入图片描述

在传统架构模式中,前后端代码存放于同一个代码库中,甚至是同一工程目录下。页面中还夹杂着后端代码。前后端工程师进行开发时,都必须把整个项目导入到开发工具中。而前后端分离模式在代码组织形式上有以下两种:
半分离
前后端共用一个代码库,但是代码分别存放在两个工程中。后端不关心或很少 关心前端元素的输出情况,前端不能独立进行开发和测试,项目中缺乏前后端 交互的测试用例。
真分离
前后端代码库分离,前端代码中有可以进行Mock测试(通过构造虚拟测试对 象以简化测试环境的方法)的伪后端,能支持前端的独立开发和测试。而后端 代码中除了功能实现外,还有着详细的测试用例,以保证API的可用性,降低 集成风险。
1.1.3 开发模式

1.4 真正前后端分离

在这里插入图片描述

1.5、后端先行(正在使用的)

在这里插入图片描述

1.6、总结

前后端分离是一种架构模式,前后端人员先预定好接口,并行开发与测试.上线时进行分别部署.对开发人员能力要求高.对于小型公司或刚转型前后端分离模式公司,开发人员能力有限,采用是后端先行前后端分离开发模式.


项目结构介绍

打开文件结构简单介绍即可

数据来源介绍

1 通过爬虫爬取豆瓣分类下的图书ISBN (前期准备全部爬下来 后来发现不太可能(本人技术有限))
image-20211028221328986

代码展示

import random

from bs4 import BeautifulSoup # 网页解析
import re # 正则表达式
import requests


user_agent_list = [ \
        "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/22.0.1207.1 Safari/537.1" \
        "Mozilla/5.0 (X11; CrOS i686 2268.111.0) AppleWebKit/536.11 (KHTML, like Gecko) Chrome/20.0.1132.57 Safari/536.11", \
        "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.6 (KHTML, like Gecko) Chrome/20.0.1092.0 Safari/536.6", \
        "Mozilla/5.0 (Windows NT 6.2) AppleWebKit/536.6 (KHTML, like Gecko) Chrome/20.0.1090.0 Safari/536.6", \
        "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.1 (KHTML, like Gecko) Chrome/19.77.34.5 Safari/537.1", \
        "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.9 Safari/536.5", \
        "Mozilla/5.0 (Windows NT 6.0) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.36 Safari/536.5", \
        "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1063.0 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 5.1) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1063.0 Safari/536.3", \
        "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_0) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1063.0 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 6.2) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1062.0 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1062.0 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 6.2) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1061.1 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1061.1 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 6.1) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1061.1 Safari/536.3", \
        "Mozilla/5.0 (Windows NT 6.2) AppleWebKit/536.3 (KHTML, like Gecko) Chrome/19.0.1061.0 Safari/536.3", \
        "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/535.24 (KHTML, like Gecko) Chrome/19.0.1055.1 Safari/535.24", \
        "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/535.24 (KHTML, like Gecko) Chrome/19.0.1055.1 Safari/535.24"\
        "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.4577.82 Safari/537.36"
    ]



# header = {
# 'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.4577.82 Safari/537.36'
# }
desc = []
def getUrl(str1,str2):
    UserAgent = random.choice(user_agent_list)
    headers = {'User-Agent': UserAgent}
    url = "https://book.douban.com/tag/{0}?start={1}".format(str1,str2);
    resp = requests.get(url,headers=headers)
    resp.encoding="utf-8"
    soup = BeautifulSoup(resp.text, 'html.parser')  # 选择解析器
    urls = []

    for i in range(1,21):
        test = soup.select_one('#subject_list > ul > li:nth-child({0}) > div.pic > a'.format(i))
        try:
         u = test.get('href')
        except:
         continue
        urls.append(u)
        pass

    # print(urls)
#-----------------------------------------------------------------------------------------------------
    for i in urls:
        # 添加星星

        resp2 = requests.get(i,headers=headers)
        resp2.encoding = "utf-8"
        soup = BeautifulSoup(resp2.text, 'html.parser')
        findISBN = re.compile(r'<span.*?class="pl">ISBN:</span>(.*?)<br/>.*?</div>.*?</div>', re.S)
        try:
          ISBN = re.findall(findISBN,str(soup))[0].replace(' ','').replace('<br/>\n','')
        except IndexError:
           continue
        isbn = ISBN[0:13]
        print("isbn===>"+isbn)
        isbn = int(isbn)

        desc.append(isbn)


        # exit()
    return desc

    pass
if __name__ == '__main__': # 中国文学
   tag = ['数学','国学','人物传记']
   # f = open("111111111.txt", "w")
   # with f as file_object:
   #     file_object.write(str(tag))
   for t in tag:
       temp = []
       for i in range(0, 220, 20):
           print(i)
           temp = getUrl("{0}".format(t), "{0}".format(i))
       f = open("{0}.txt".format(t), "w")
       with f as file_object:
           file_object.write(str(temp))




2 调用免费接口 根据ISBN获取图书信息并存入数据库中

目前数据库中大概有7k条图书数据 后续可继续扩充 防止ElasticSearch大材小用哈哈

数据库结构介绍

打开DataGrip展示即可

Shiro权限授权认证介绍

先介绍一下Session cookie 和token之间的区别和应用场景

详细介绍

然后介绍授权认证的流程 (口述 锻炼下自己)

image-20211029002140214

登录注册流程介绍

简单介绍一种 例如手机号登录流程 如何整合Redis

搜索添加商品展示 并简单说一下实现原理

购物车到订单的实现简单介绍一下 主要展示代码逻辑(这个所需时间长可后讲)

支付宝支付演示 和支付调用流程简单讲解

简单介绍一下内网穿透

全局异常处理和统一结果封装讲解(简单带一下)

用户头像存储原理(简单带一下)

RabbitMQ异步发送账号密码短信(简单带一下)

可视化地址

听取意见和建议 并对同学提出的问题进行解答

2~3个问题

后续扩展说明

image-20211029001212073

后台管理系统完善

增加商品秒杀功能

向分布式微服务转型

高并发测试….

SpringBoot线程池实现多线程查询生成订单列表 优化列表响应时间

完善支付密码操作

增加优惠卷 抽奖功能…

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值