美文网首页我爱编程
基于模版的前后端分离

基于模版的前后端分离

作者: 瑜骐 | 来源:发表于2018-04-16 18:28 被阅读0次

1. 需求

        在使用模板(如Freemarker)进行web开发的时候,经常会遇到这种情况:前端UI改变了对应的样式或静态文件内容,也需要将后端进行对应的修改;但是前端改变了很多,而且并没有标记出对应的改动点,则需要后端开发人员人肉查找前端对应的改动点,一点一点进行调试修改(实现上前端已经进行了一次调试修改,重复劳动),费时费力,而且还容易出错。因此急需一种机制来解决这种解决模板开发的进行前后端分离的方法,即是如果仅仅是改变样式和静态内容则后端开发人员可能并不需要感知,只需要前端开发人员进行相应的修改就可以了。

2. 想法

        想法目前有以下几种:

(1)提供一个工具,使的前端也能够自动运行后端程序的代码,并且能够快速的将前端对应的修改在页面上显示。

(2)提供一个工具,能够将对应前端的代码和后端写的模板代码进行merge,动态生成对应的结果代码,这样前端在自己对应的文件中开发,后端也在自己对应的文件中开发,互不影响,通过工具来将两者合并,但是这需要前端和后端在对应的标签上加上对应的标识,以便工具识别和merge。缺点是需要前后端都要对对应的内容加上相同的标签。

3. 实现

目前仅仅实现想法(1),提供一段bat脚本,能够给前端机器动态配置相应的环境变量和编译指定的工程,并运行起来;同时,为了能够满足前端修改的内容能够快速的在页面上得到响应,则可以开发对应模板的动态加载功能;还有就是运行的程序默认加载对应target目录中的网站静态文件(html、css),但是前端开发是在对应的项目目录进行开发的,而不是在对应的target下进行开发,因此还需要提供一个功能,能够动态定时的将项目目录下的修改拷贝到对应的target目录下面;实现的时候采用了简化版本,就是定时重新编译项目,这样前端开发人员在对应项目目录下的修改就能被拷贝到对应的target目录下面,对应的脚本代码如下所示start.bat 

                                                                脚本start.bat代码BEGIN


@echo off

@echo off

@echo off

@echo off

rem 当前bat执行的路径

set batPath=%~dp0

set curCdPath=%cd%

cd %~dp0

rem jdk 安装,如果已经存在则不进行安装

java -version 2>java_version.txt

set /p result=

set javaVersion=%result:~14,-2%

rem 判断jdk是否已经存在

if  %errorlevel% == 0 (

echo jdk already exist version %javaVersion%

goto endJDK

)

rem jdk安装和环境变量配置

echo.

echo intalling jdk,please don't do otherings

echo.

echo please wait,this operation may be need 3 or 4 minutes

echo.

start /WAIT jdk-8u141-windows-i586.exe /qn INSTALLDIR=C:\\Java\\jdk1.8

echo jdk install complete

set JAVA_HOME=C:\\Java\\jdk1.8

set PATH=%PATH%;%JAVA_HOME%\\bin;%JAVA_HOME%\\jre\\bin

set CLASSPATH=.;%JAVA_HOME%\\lib\\dt.jar;%JAVA_HOME%\\lib\\tools.jar

:endJDK

rem 删除 java version 对应的文件

del java_version.txt

rem maven 安装,如果已经安装则跳过

rem (mvn -version) ^| find "Apache Maven" >maven_version.txt

rem set /p mavenVersion=

rem set mavenVersionNum=%mavenVersion:~0,18%

rem if not "%result1%" == "" (

rem echo maven already exist version %mavenVersionNum%

rem goto endMaven

rem )

rem maven安装和环境变量配置

echo.

echo configuring maven,please wait

echo.

set maven_home=%cd%\\apache-maven-3.2.5

echo maven_home=%maven_home%

set PATH=%PATH%;%maven_home%\\bin

rem :endMaven

rem del maven_version.txt

rem 下载代码使用工程代码进行下载-下载到指定目录

rem java -jar gitCodeController.jar  config.properties

set localPrjPath=""

set webDir=""

set port=""

set profile=""

set mainClass=""

set interval=600

rem 读取配置文件中的cloneLocalPath对应的值

for /F  "tokens=1,2 delims==" %%i in (config.properties) do (

    if "%%i"=="cloneLocalPath" (

set localPrjPath=%%j

)

  if "%%i"=="webDir" (

set webDir=%%j

      )

  if "%%i"=="port" (

set port=%%j

      )

  if "%%i"=="profile" (

set profile=%%j

        )

  if "%%i"=="mainClass" (

set mainClass=%%j

      )

  if "%%i"=="interval" (

set interval=%%j

      )

)

echo localPrjPath=%localPrjPath%

if %localPrjPath% == "" (

echo 'ERROR:project name is null'

goto END

)

echo port=%portr%

if %port% == "" (

echo 'ERROR:port is null'

goto END

)

echo webDir=%webDir%

if %webDir% == "" (

echo 'ERROR:web dir is null'

goto END

)

echo profiler="%profile%"

if "%profile%" == "" (

echo 'ERROR:profile is null'

goto END

)

echo mainClass=%mainClass%

if %mainClass% == "" (

echo 'ERROR:mainClass is null'

goto END

)

echo interval=%interval%

if %interval% == "" (

echo 'ERROR:interval is null'

goto END

)

set mainPath=%cd%

rem maven编译和执行对应的主类

rem 主目录

cd %localPrjPath%

rem mvn compile >compile_result.txt

rem del compile_result.txt

rem mvn package

set mvnSettingPath=%maven_home%\\conf\\settings.xml

echo mvnSettingPath=%mvnSettingPath%

call mvn clean install -Dmaven.test.skip=true -s %mvnSettingPath%

set projectDIR=%cd%

:LOOP_BUILD

rem web目录

cd %webDir%

call mvn package dependency:copy-dependencies -Dmaven.test.skip=true -s %mvnSettingPath%

rem 运行java命令

rem 启动类

set MAIN_CLASS=%mainClass%

rem jvm参数

set JAVA_OPTS=-Xmx512M -Xms256M -XX:PermSize=64M -XX:MaxPermSize=512M -XX:+HeapDumpOnOutOfMemoryError -Dspring.profiles.active=%profile% -Dserver.port=%port%

rem 代码路径地址

rem set CODE_HOME="target"

cd target/classes

set CLASSPATH=%cd%;%cd%/../dependency/*

rem java可执行文件位置

rem set _EXECJAVA=%JAVA_HOME%/bin/java

set _EXECJAVA=java

rem 执行java程序之前,先删除

taskkill /F /IM java.exe

echo "%_EXECJAVA% %JAVA_OPTS% -classpath %CLASSPATH% %MAIN_CLASS%"

start %_EXECJAVA% %JAVA_OPTS% -classpath %CLASSPATH% %MAIN_CLASS%

rem 间隔是负数

if %interval% LEQ 0 (

goto END

)

rem echo "use ping to delay"

rem 使用ping来延迟指定时间,单位是秒

set SLEEP=ping 127.0.0.1 /n

rem 延迟4秒

%SLEEP% %interval% > nul

cd %projectDIR%

goto LOOP_BUILD

:END

rem 回退到原来运行的目录

cd %curCdPath%

                                                                   脚本start.bat代码END


脚本对应的配置文件config.properties:

                                                                    配置config.properties 开始


# clone 下来代码的局部地址

cloneLocalPath=D:\WorkProject\CTFIN-KCCF

# web 目录

webDir=kccf-pc

# port 端口

port=8902

#profile

profile=dev,user,message,content,order

# 运行主类

mainClass=com.kccf.pc.KccfApplication

# 多长时间重新编译一次,单位是秒,默认是10分钟编译一次

interval=600

                                                                       配置文件END


相关文章

网友评论

    本文标题:基于模版的前后端分离

    本文链接:https://www.haomeiwen.com/subject/qnwkkftx.html