IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 谷粒商城之逆向工程 -> 正文阅读

[JavaScript知识库]谷粒商城之逆向工程

目录

renren-fast后台管理系统的搭建

renren-fast-vue前台管理系统的搭建及联调:

使用renren-generator的服务逆向代码生成?

整合Mybatis-Plus

使用renren-generator生成剩余服务的代码


renren-fast后台管理系统的搭建

①点开码云,搜索人人开源

②复制克隆地址,使用git克隆?

git clone https://gitee.com/renrenio/renren-fast.git

?

③创建gulimall_adm数据库,执行renren-fast中的db文件中的mysql.sql

④删除renren-fast中的.git文件,将其导入父项目中?

⑤在父项目中的pom文件中添加renre-fast的moudle

⑥修改renren-fast的配置文件

修改数据库的ip地址和数据库名称、用户名和密码

出现问题:

?解决方案:

在url的中加入useSSL=flase

 url: jdbc:mysql://192.168.56.22:3306/gulimall_adm?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai&&useSSL=false

renren-fast-vue前台管理系统的搭建及联调:

①什么是node?

node是基于chrome v8引擎的JavaScript的运行环境,我们关注node中的npm功能,相当于Java的maven用于包管理工具

②下载node.js

下载地址:Node.js

③查看安装是否成功及使用淘宝镜像

在cmd中输入node-v如果出现下面的信息则安装成功

node -v

?

在cmd输入下面的命令进行一个淘宝镜像的设置?

npm config set registry http://registry.npm.taobao.org/

④使用git拉取renren-fast-vue的前端框架代码

?

?

git clone https://gitee.com/renrenio/renren-fast-vue.git

?⑤使用vscode打开renren-fast-vue

?

由于是第一次打开,使用npm install下载前端项目运行需要的各种环境:?

npm install

出现以下错误信息:?

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! chromedriver@2.27.2 install: `node install.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the chromedriver@2.27.2 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\DELL\AppData\Roaming\npm-cache\_logs\2021-12-04T07_35_55_129Z-debug.log

?应该是镜像拉取的时候被墙屏蔽了,使用下面命令进行解决:

npm install chromedriver@2.27.2 --ignore-scripts

package.json相当于pom文件,设置版本号。node_modules是用于存放下载的组件

⑥启动renren-fast的后台管理服务,再使用npm run dev启动renren-fast-vue的前端项目

?

npm run dev

?出现以下错误信息:

ERROR  Failed to compile with 6 errors                                                                                                                                                                                 下午3:47:18

error  in ./src/assets/scss/index.scss

Module build failed: Error: Cannot find module 'node-sass'

解决方案:

使用npm install node-sass --save命令

npm install node-sass --save

使用这个命令报错的话,就是用淘宝镜像的命令

npm install -g cnpm --registry=https://registry.npm.taobao.org

cnpm install node-sass --save

执行cnpm install node-sass --save出现以下错误:

cnpm : 无法加载文件 C:\Users\DELL\AppData\Roaming\npm\cnpm.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 1
+ cnpm install node-sass --save
+ ~~~~
    + CategoryInfo          : SecurityError: (:) [],PSSecurityException
    + FullyQualifiedErrorId : UnauthorizedAccess

解决方案:

1.以管理员身份运行Windows POWERSHELL

2.输入set-ExecutionPolicy RemoteSigned指令

3.输入A

4.再次执行cnpm install node-sass --save命令


成功运行将会出现如下信息:

默认用户名和密码都是admin,我们点击验证码进行一个跟换,控制台将出现以下信息:

这个表我们可以看一下,记录的是用户的登录记录?

使用renren-generator的服务逆向代码生成?

①码云中搜索renren-generator复制克隆路径,使用git-bash克隆项目到桌面

?

git clone https://gitee.com/renrenio/renren-generator.git

?

②删除.git文件,将代码生成器代码导入项目中,在父项目中导入renren-generator的module

?

?

?

?

出现以下错误信息:?

'parent.relativePath' of POM io.renren:renren-generator:1.0.0 (D:\IdeaProject\gulimall\renren-generator\pom.xml) points at com.atguigu.gulimall:gulimall instead of org.springframework.boot:spring-boot-starter-parent, please verify your project structure @ line 11, column 10
It is highly recommended to fix these problems because they threaten the stability of your build.
For this reason, future Maven versions might no longer support building such malformed projects.

解决方案:添加<relativePath/>

③修改application.yml配置文件

我们现在是要去生成product项目中的三层代码,所以要连接的是gulimall_product数据库

url: jdbc:mysql://192.168.56.22:3306/gulimall_pms?useUnicode=true&characterEncoding=UTF-8&useSSL=false&serverTimezone=Asia/Shanghai
username: root
password: root

④修改generator.properties配置文件

修改为:?

由于gulimall_product数据库中的表都是以pms为前缀的,所以tablePrefix为pms

生成代码的路径名为:package+moduleName

⑤登录localhost:80,生成代码,并将生成的代码进行替换

将生成的代码与项目中的原代码进行一个替换

?

将前端代码进行一个删除暂时用不到:

⑥改正生成代码中的报错

Controller层中的报错:

1.使用shiro的权限验证,后面我们会使用spring security的权限验证所以先注释掉

2.响应类、页面工具类可以从renren-fast中复制

Dao层中的报错:mybaits的依赖没有导入

Pojo中的报错:mybatisplus和lombok依赖没有导入

Service层中的报错:

1.mybatisplus的依赖没有导入

2.PageUtils和Query类不存在

解决方案:

1.创建common模块,导入各个子模块需要用到的依赖

?

mybatisplus地址:MyBatis-Plus

?

出现问题:

解决方案:?

 <dependencies>
        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.2.0</version>
        </dependency>
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <version>1.18.8</version>
        </dependency>
    </dependencies>

出现问题:

Using platform encoding (UTF-8 actually) to copy filtered resources, i.e. build is platform dependent!

解决方案:

 <properties>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>

在product模块中的pom文件中导入common依赖:

Pojo和Dao层的报错解决完成:

在common中创建com.atguigu.common.utils包

?

将rennre-fast项目中的pageUtils和Query复制到com.atguigu.common.utils包下

?

?

将Query类中需要的类进行一个复制:

?

在common中导入StringUtils的依赖:?

 <dependency>
            <groupId>commons-lang</groupId>
            <artifactId>commons-lang</artifactId>
            <version>2.6</version>
 </dependency>

在common中utils下复制R:

?

需要在common中导入HttpStatus的依赖:

maven的仓库地址:https://mvnrepository.com/

?

<dependency>
            <groupId>org.apache.httpcomponents</groupId>
            <artifactId>httpcore</artifactId>
            <version>4.4.12</version>
</dependency>

?

解决方案:?

1.修改renren-generator的controller模板

2. 将方法前面的所有RequiresPermissions注解注释掉

3.将导入的依赖注释删除

?

4.重启代码生成器服务,使用代码生成器生成代码进行一个代码的替换

至此,所有报错解决完成

整合Mybatis-Plus

①导入mybatis-plus的依赖

在common中已经导入了mybatis-plus的依赖,product中又导入了common的依赖

②配置

mybatis-plus的地址:配置 | MyBatis-Plus

1、配置数据源

????????1)、导入数据库的驱动

????????????????

?

?

?发现没有5.7的版本的数据库连接驱动

?

?发现使用5.1或者8.0都可以连接5.7版本的mysql,官方推荐使用8.0的驱动

在common中的pom文件中添加依赖:?

<!-- https://mvnrepository.com/artifact/mysql/mysql-connector-java -->
<dependency>
    <groupId>mysql</groupId>
    <artifactId>mysql-connector-java</artifactId>
    <version>8.0.16</version>
</dependency>

? ? ? ? 2)、在applicaiton.yml文件中配置数据源相关信息

spring:
  datasource: #配置数据源
    driver-class-name: com.mysql.cj.jdbc.Driver #配置驱动
    url: jdbc:mysql://192.168.56.22:3306/gulimall_pms #配置url
    username: root
    password: root

2、配置mybatis-plus

? ? ? ? 1)、使用@MapperScan注解

//dao的全限定类名
MapperScan("com.atguigu.gulimall.product.dao") 

? ? ? ?2)、告诉mybatis-plus,sql映射文件的位置

mybatis-plus:
  mapper-locations: classpath:/mapper/**/*.xml  #配置mybatis-plus扫描映射文件的位置
  global-config:
    db-config:
      id-type: auto   #配置主键自增     

?最终的application.yml文件:

spring:
  datasource: #配置数据源
    driver-class-name: com.mysql.cj.jdbc.Driver #配置驱动
    url: jdbc:mysql://192.168.56.22:3306/gulimall_pms #配置url
    username: root
    password: root
mybatis-plus:
  mapper-locations: classpath:/mapper/**/*.xml  #配置mybatis-plus扫描映射文件的位置
  global-config:
    db-config:
      id-type: auto   #配置主键自增

进行一个测试:

 @Autowired
    private BrandService brandService;

    @Test
    void contextLoads() {
        BrandEntity brandEntity=new BrandEntity();
        brandEntity.setName("apple");
        brandService.save(brandEntity);
        System.out.println("插入成功!");
    }

使用renren-generator生成剩余服务的代码

①生成coupon服务代码

修改yml中的数据库

修改生成的路径和表前缀

?代码替换

?在coupon中的pom文件中导入common依赖

配置application.yml文件

?

spring:
  datasource: #配置数据源
    driver-class-name: com.mysql.cj.jdbc.Driver #配置驱动
    url: jdbc:mysql://192.168.56.22:3306/gulimall_sms #配置url
    username: root
    password: root
mybatis-plus:
  mapper-locations: classpath:/mapper/**/*.xml  #配置mybatis-plus扫描映射文件的位置
  global-config:
    db-config:
      id-type: auto   #配置主键自增
server:
  port: 7000

?检测无问题:

?其余的服务也是同理生成和配置

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-12-05 11:57:28  更:2021-12-05 11:57:50 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 7:56:15-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码