你们要的测试练习网站来了

本文涉及的产品
RDS MySQL Serverless 基础系列,0.5-2RCU 50GB
云数据库 RDS MySQL,集群系列 2核4GB
推荐场景:
搭建个人博客
云数据库 RDS MySQL,高可用系列 2核4GB
简介: 搭建测试环境首选的有tpshop、shopxo、iwebshop这类php开发的电商网站,虽然部署方便,但是却跟企业实际的架构相差太远,不利于我们更好的了解和学习软件测试。

对于小白而言,搭建测试环境首选的有tpshop、shopxo、iwebshop这类php开发的电商网站,虽然部署方便,但是跟企业实际的架构相差太远,不利于我们更好的了解和学习软件测试。

那么,对于自学软件测试的朋友来说,是否还在为找不到可以用来练习接口自动化的网站而发愁呢?是否在为找不到部署测试环境而发愁呢?是否不知道现在企业做出来的网站都是什么样子呢?下面让我带大家一起来了解一下吧!!!

项目选型:找一个前后端分离的项目,后端用java的springboot框架,前端用vue框架,这个是目前用的比较多的组合。

废话不多说,先上一波效果:

后台管理页面效果如下:


640.gif


后台api接口swagger文档效果:


640.gif


怎样找一个这样的网站?



可以在gitee/github平台上去搜索这样的网站,我通过搜索关键字springboot vue,在gitee上找到这么个网站:


微信图片_20220113204138.png地址如下:

https://gitee.com/microapp/linjiashop

项目介绍:

项目是一个电商网站,包含后端api接口以及swagger接口文档,后端管理页面,手机H5页面以及小程序的代码,先从后端api接口以及后端管理页面的部署开始介绍。

ps:要部署该项目,需要掌握以下内容:

1、具备java基础,了解maven工程的打包构建

2、了解通过npm工具构建打包前端代码

3、了解常见测试环境部署的一些流程,掌握linux简单命令,掌握jenkins简单用法。




找到网站后,如何部署?



在这之前,我找过很多类似的开源项目,要么就是代码太复杂,要部署很多中间件,对于我这个小白来说有点困难,要么就是代码写的有问题,或者缺失sql脚本,或者没有写简单的部署文档,有点难以下手。


下面介绍一下如何去部署选定的项目:

1、下载源代码到本地

准备工作:

电脑上安装好git,获取源代码到本地,本简单看一下代码目录,找到doc下的相关文档,其中doc下面的database.sql为数据库脚本


微信图片_20220113204650.jpg



2、安装mysql数据库并创建项目的数据库

因为最终我打算将项目部署到linux虚拟机里面,因此先在linux里面安装mysql。这里推荐使用docker的方式安装mysql:

1、Docker环境搭建

2、执行命令安装mysql:

docker pull mysql:5.7
docker run -itd --name mysql -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 mysql:5.7

通过以上命令,很快速的就安装好了mysql,然后用navicat客户端远程连接后,创建一个数据库linjiashop,并创建用户名linjiashop,设置密码为linjiashop,并授权用户linjiashop对该数据库的操作权限。


微信图片_20220113204144.png3、执行数据库建表脚本(也可以不执行数据库脚本,代码中有个配置可以在本地调试的时候自动执行脚本)



3、编译打包后端java代码

要编译打包,首先要了解项目的基本代码结构,可以结合这个项目,了解一下微服务架构的概念。这里要构建的第一个工程的包是linjiashop-admin-api文件夹下的后端接口代码,该项目不能单独打包,需要依赖于core工程一期构建,为了方便,可以直接在代码根目录执行命令一次性打包所有java代码就行:

mvn -U clean package -Dmaven.test.skip=true

ps:用以上命令打包的话,需要在电脑上安装好maven,maven的仓库地址更换为阿里云的仓库后,打包会快一些。

下面说一下linjiashop-admin-api工程打包前,代码中需要修改的位置:

1、修改代码中的数据库连接地址:


微信图片_20220113204147.png


2、修改resources文件夹下的logback.xml文件中的fileNamePattern的值


微信图片_20220113204150.png


3、下载的源代码默认是打包war包,可以改成jar包方便部署(不改也可以)

在pom.xml文件中按如下脚本进行修改:

<packaging>jar</packaging>


微信图片_20220113204152.png


4、执行mvn -U clean package -Dmaven.test.skip=true命令,然后在项目的target目录中可以找到打出来的jar包。将jar包用java -jar 启动即可,启动的时候可以加-server.port=8082的参数指定端口。


4、编译前端代码

1、电脑上安装好nodejs的环境,配置环境变量,下载nginx,用来部署前端

2、进入到linjiashop-admin文件夹下面,执行以下命令即可:

(注意打包前需要改一些配置)

本地调试的命令:

npm install --registry=https://registry.npm.taobao.org
npm run dev

本地打包的命令:

npm install --registry=https://registry.npm.taobao.org 
npm run build:prod

ps: npm install 命令是安装包的依赖,如果的比较慢的话 ,可以改成如下的命令:

npm install cnpm --registry=https://registry.npm.taobao.org
cnpm install
npm run dev /  npm run build:prod

3、打包前或者本地调试的时候,需要更改一些脚本:

前端代码目录下有一个vue.config.js的文件,里面涉及到localhost地址以及端口的,可以改成后端api接口的ip和端口


微信图片_20220113204155.png


更改了上述地址后,打包部署到服务器nginx下后,访问页面时,会发现页面请求的接口地址并没有改成后端api部署的8082端口,而还是通过前端nginx页面的地址所对应的端口发送的请求,因此还需更改一个配置文件,或者通过nginx的端口转发功能进行配置。我对nginx不太熟,这里只介绍一下改代码的方式:

找到src/utils/rquests.js文件,更改截图中的内容:


微信图片_20220113204157.png


按照上述步骤操作之后,网站基本上就部署完成了,页面一些简单的功能已经可以使用,一些稍微复杂的功能,比如图片上传,还需要更改配置,这个等后面研究出来了再分享给大家,目前已经可以拿部署的网站用来做UI自动化和接口自动化的练习了,而且还可以用来练习功能测试,定位前后端问题,查看报错日志等。


如何结合jenkins实现持续部署



测试环境的部署流程,一般就分为以下几步:

1、构建、打包

2、将文件传到要部署的服务器

3、备份

4、停服务,替换文件,启动服务

5、监控服务状态,验证部署是否成功


jar包部署:(详细步骤请参考之前写的文章:Jenkins自动部署测试环境之jar包部署)

主要使用jenkins的Publish Over SSH插件传文件到服务器,然后远程执行shell脚本。


前端部署:

与jar包部署类似,不过前端可以采用构建成docker镜像进行部署。

dockerfile 主要内容如下:

FROM nginx
WORKDIR /app
COPY dist/ /usr/share/nginx/html
EXPOSE 80
RUN echo 'echo init ok!!'

setup.sh 脚本如下:

cd /home/jenkins/jenkins_remote_dir/workspace/linjiashop-admin-freestyle-deploy/linjiashop-admin
docker stop adminui;
docker rm adminui;
docker build -t adminui .;
docker images;
docker run -p 8081:80 -d --name adminui adminui ;

大家如果在搭建环境过程中有疑问,或者对本篇文章中的某些内容有疑问,欢迎在屏幕下方留言探讨。有其他项目想要部署的可以私信小编喔,小编与你一起学习环境部署。

相关实践学习
如何快速连接云数据库RDS MySQL
本场景介绍如何通过阿里云数据管理服务DMS快速连接云数据库RDS MySQL,然后进行数据表的CRUD操作。
全面了解阿里云能为你做什么
阿里云在全球各地部署高效节能的绿色数据中心,利用清洁计算为万物互联的新世界提供源源不断的能源动力,目前开服的区域包括中国(华北、华东、华南、香港)、新加坡、美国(美东、美西)、欧洲、中东、澳大利亚、日本。目前阿里云的产品涵盖弹性计算、数据库、存储与CDN、分析与搜索、云通信、网络、管理与监控、应用服务、互联网中间件、移动服务、视频服务等。通过本课程,来了解阿里云能够为你的业务带来哪些帮助 &nbsp; &nbsp; 相关的阿里云产品:云服务器ECS 云服务器 ECS(Elastic Compute Service)是一种弹性可伸缩的计算服务,助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。产品详情: https://www.aliyun.com/product/ecs
相关文章
|
7月前
|
测试技术 C语言
网站压力测试工具Siege图文详解
网站压力测试工具Siege图文详解
119 0
|
7月前
|
缓存 运维 监控
网站性能测试
【4月更文挑战第8天】网站性能测试
115 1
|
7月前
|
敏捷开发 运维 安全
链家网站系统测试设计与实现_kaic
链家网站系统测试设计与实现_kaic
|
3月前
|
人工智能 数据可视化 API
10 分钟构建 AI 客服并应用到网站、钉钉或微信中测试评
10 分钟构建 AI 客服并应用到网站、钉钉或微信中测试评
120 2
|
2月前
locust网站压力测试软件
locust网站压力测试软件
52 0
|
3月前
|
监控 安全 Linux
如何利用Kali Linux进行网站渗透测试:最常用工具详解
如何利用Kali Linux进行网站渗透测试:最常用工具详解
152 6
|
5月前
|
开发框架 前端开发 JavaScript
ABP框架测试信息---Winform端、动态网站、Vue&Element管理后端等
ABP框架测试信息---Winform端、动态网站、Vue&Element管理后端等
|
4月前
|
Linux C#
【Azure App Service】C#下制作的网站,所有网页本地测试运行无误,发布至Azure之后,包含CHART(图表)的网页打开报错,错误消息为 Runtime Error: Server Error in '/' Application
【Azure App Service】C#下制作的网站,所有网页本地测试运行无误,发布至Azure之后,包含CHART(图表)的网页打开报错,错误消息为 Runtime Error: Server Error in '/' Application
|
5月前
|
数据库
基于PHP+MYSQL开发制作的趣味测试网站源码
基于PHP+MYSQL开发制作的趣味测试网站源码。可在后台提前设置好缘分, 自己手动在数据库里修改数据,数据库里有就会优先查询数据库的信息, 没设置的话第一次查询缘分都是非常好的 95-99,第二次查就比较差 , 所以如果要你女朋友查询你的名字觉得很好 那就得是她第一反应是查和你的缘分, 如果查的是别人,那不好意思,第二个可能是你。
75 3
|
5月前
|
测试技术 Python
我们假设要测试一个名为`http://example.com`的网站,并对其进行简单的GET请求性能测试。
我们假设要测试一个名为`http://example.com`的网站,并对其进行简单的GET请求性能测试。