整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
介
JeeWeb是一款基于SpringBoot 2+Spring+Mybatis+Hibernate的敏捷開發(fā)系統(tǒng)；它是一款具有代碼生成功能的智能快速開發(fā)平臺；是以Spring Framework為核心容器，Spring MVC為模型視圖控制器，Hibernate為數(shù)據(jù)訪問層， Apache Shiro為權(quán)限授權(quán)層，Ehcahe對常用數(shù)據(jù)進(jìn)行緩存，Disruptor作為并發(fā)框架，Bootstrap作為前端框架的優(yōu)秀 開源 系統(tǒng)。
JeeWeb是一款 全開源開發(fā)平臺 ，特別 代碼生成器模塊也采用開源模式 ，各位開發(fā)者可以根據(jù)自己的需要改造出更加適合自己的代碼生成器，不管是做項目、學(xué)習(xí)、接私活它都將是你的最佳拍檔；
JeeWeb主要定位于企業(yè)快速開發(fā)平臺建設(shè)，已內(nèi)置很多優(yōu)秀的基礎(chǔ)功能和高效的 代碼生成 工具，包括：系統(tǒng)權(quán)限組件、數(shù)據(jù)權(quán)限組件、數(shù)據(jù)字典組件、核心工具組件、視圖操作組件、代碼生成、 UI模版標(biāo)簽 庫等。前端界面風(fēng)格采用了結(jié)構(gòu)簡單、性能優(yōu)良、頁面美觀大氣的Twitter Bootstrap頁面展示框架。采用分層設(shè)計、提交數(shù)據(jù)安全編碼、密碼加密、訪問驗證、數(shù)據(jù)權(quán)限驗證。使用Maven做項目管理，提高項目的易開發(fā)性、擴(kuò)展性。
目前功能模塊代碼生成器、權(quán)限框架、數(shù)據(jù)字典、數(shù)據(jù)緩存、并發(fā)框架、數(shù)據(jù)監(jiān)控、計劃任務(wù)、多數(shù)據(jù)源管理、附件管理、類似mybatis動態(tài)SQL、UI模板標(biāo)簽、短信發(fā)送、郵件發(fā)送、統(tǒng)計功能等功能。
JeeWeb的開發(fā)方式采用（ 代碼生成器快速設(shè)計生成代碼->手工完善邏輯->豐富模板標(biāo)簽快速前端開發(fā) ），可以快速協(xié)助java開發(fā)人員解決60%的重復(fù)工作，讓開發(fā)人員更多關(guān)注業(yè)務(wù)邏輯的實現(xiàn)，框架使用前端模板標(biāo)簽，解放JAVA開發(fā)人員的開發(fā)壓力，提高開發(fā)效率，為企業(yè)節(jié)省項目研發(fā)成本，減少開發(fā)周期。
后臺框架演示（支持兩種前端樣式自由切換）
論壇演示
前后端分離演示
JeeWeb 技術(shù)特點
JeeWeb使用目前流程的WEB開發(fā)架構(gòu)技術(shù)，如 SpringBoot,Mybatis, Hibernate,Apache Shiro, Disruptor , ehcache, Jquery ,BootStrap等等，支持多種數(shù)據(jù)庫MySQL, Oracle, sqlserver等。 分層設(shè)計：使用分層設(shè)計，分為dao，service，Controller，view層，層次清楚，低耦合，高內(nèi)聚。
安全考慮：嚴(yán)格遵循了web安全的規(guī)范，前后臺雙重驗證，參數(shù)編碼傳輸，密碼md5加密存儲，shiro權(quán)限驗證，從根本上避免了SQL注入，XSS攻擊，CSRF攻擊等常見的web攻擊手段。
JeeWeb 功能特點
1、后端
2、前端
簡單使用說明
平臺目錄結(jié)構(gòu)說明
jeeweb ├─jeeweb-common 公共模塊 │ ├─jeeweb-common-base 公用基礎(chǔ)模塊 │ │ │ ├─jeeweb-common-email 郵件基礎(chǔ)模塊 │ │ │ ├─jeeweb-common-hibernatemvc hibernate公用模塊 │ │ │ ├─jeeweb-common-mybatismvc mybatis公用模塊 │ │ │ ├─jeeweb-common-oss 數(shù)據(jù)存儲公用模塊 │ │ │ ├─jeeweb-common-quartz quartz公用模塊 │ │ │ ├─jeeweb-common-query 查詢封裝模塊 │ │ │ ├─jeeweb-common-security 安全公用模塊 │ │ │ ├─jeeweb-common-sms 短信公用模塊 │ │ │ └─jeeweb-common-utils 公用工具模塊 │ ├─jeeweb-ui UI模塊 │ ├─jeeweb-beetl-tag 基于beetl的類似spring form的模板標(biāo)簽 │ │ │ ├─jeeweb-ui-static 公用靜態(tài)資源模塊 │ │ │ └─jeeweb-ui-tag 基于靜態(tài)資源模塊的標(biāo)簽 │ ├─jeeweb-web 業(yè)務(wù)模塊 │ ├─jeeweb-admin 后臺案例模塊 │ │ │ ├─jeeweb-bbs Jeeweb官方論壇代碼模塊 │ │ │ ├─jeeweb-vue 前后端分離后端模塊 │ │ │ └─jeeweb-generator 代碼生成器模塊 │
代碼示例
[1].GRID列表
<#grid:grid id="onlineGrid" datatype="local" datas="${onlineSessionList}" sortname="startTimestamp" sortorder="desc">
<#grid:column label="sys.common.key" hidden="true" name="id" width="100"/>
<#grid:column label="用戶" name="username" />
<#grid:column label="用戶主機(jī)IP" name="host" />
<#grid:column label="系統(tǒng)主機(jī)IP" name="systemHost" />
<#grid:column label="登錄時間" name="startTimestamp" width="140" queryMode="date" condition="between" />
<#grid:column label="最后訪問時間" name="lastAccessTime" width="140"/>
<#grid:column label="狀態(tài)" name="status" dict="onlinestatus" />
<#grid:column label="User-Agent" name="userAgent" />
<#grid:column label="用戶會話ID" name="id" />
<#grid:toolbar title="強(qiáng)制退出" btnclass="btn-danger" icon="fa-trash-o" function="toolbarSelectConfirm" url="${adminPath}/sys/online/forceLogout" tipMsg="您確定要強(qiáng)制退出這些信息么，請謹(jǐn)慎操作！"/>
</#grid:grid>
[2].TREEGRID列表
<#grid:grid id="organizationGrid" async="true" treeGrid="true" expandColumn="name" url="${adminPath}/sys/organization/ajaxTreeList">
<#grid:column label="sys.common.key" hidden="true" name="id" width="100"/>
<#grid:column label="sys.organization.name" name="name" query="true" condition="like" />
<#grid:column label="sys.organization.remarks" name="remarks" />
<#grid:column label="sys.common.opt" name="opt" formatter="button" width="100"/>
<#grid:button groupname="opt" function="delete" />
<#grid:toolbar function="add"/>
<#grid:toolbar function="update"/>
<#grid:toolbar function="delete"/>
<#grid:toolbar function="search"/>
<#grid:toolbar function="reset"/>
</#grid:grid>
[3].表單代碼
<% layout('/layouts/form.html', {title: @MessageUtils.getMessage('sys.user.updateuser',''), formId: 'userForm', bodyClass: 'white-bg', libs: 'bootstrap-fileinput'}){ %>
<#form:form id="userForm" modelAttribute="data" method="post" class="form-horizontal">
<#form:hidden path="id" />
<table class="table table-bordered table-condensed dataTables-example dataTable no-footer">
<tbody>
<tr>
<td class="width-15 active text-right">
<label>用戶名:</label></td>
<td class="width-35">${data.username}</td>
<td class="width-15 active text-right">
<label>
<font color="red">*</font>姓名:</label></td>
<td class="width-35">
<#form:input path="realname" class="form-control " datatype="*" nullmsg="請輸入姓名！" htmlEscape="false" />
<label class="Validform_checktip"></label>
</td>
</tr>
<tr>
<td class="width-15 active text-right">
<label>
<font color="red">*</font>郵箱:</label></td>
<td class="width-35">
<#form:input path="email" class="form-control" datatype="e" nullmsg="請輸入姓名！" htmlEscape="false" />
<label class="Validform_checktip"></label>
</td>
<td class="width-15 active text-right">
<label>
<font color="red">*</font>聯(lián)系電話:</label></td>
<td class="width-35">
<#form:input path="phone" class="form-control" htmlEscape="false" datatype="m" nullmsg="請輸入用戶名！" />
<label class="Validform_checktip"></label>
</td>
</tr>
<tr>
<td class="active">
<label class="pull-right">
<font color="red">*</font>用戶角色:</label></td>
<td colspan="3">
<#form:checkboxes path="roleIdList" nested="false" items="${allRoles}" defaultValue="${roleIdList}" itemLabel="name" itemValue="id" htmlEscape="false" cssClass="i-checks required" /></td>
</tr>
<tr>
<td class="width-15 active">
<label class="pull-right">組織機(jī)構(gòu):</label></td>
<td colspan="3">
<#form:treeselect title="請選擇組織機(jī)構(gòu)" path="organizationIds" nested="false" dataUrl="${adminPath}/sys/organization/treeData" chkboxType="" labelName="parentname" labelValue="${organizationNames}" multiselect="true" /></td>
</tr>
</tbody>
</table>
</#form:form>
<% } %>
git地址：https://gitee.com/dataact/jeeweb
學(xué)習(xí)目標(biāo)
HTTP 協(xié)議的全稱是(HyperText Transfer Protocol)，翻譯過來就是超文本傳輸協(xié)議。
超文本是超級文本的縮寫，是指超越文本限制或者超鏈接，比如:圖片、音樂、視頻、超鏈接等等都屬于超文本。
HTTP 協(xié)議的制作者是蒂姆·伯納斯-李，1991年設(shè)計出來的，HTTP 協(xié)議設(shè)計之前目的是傳輸網(wǎng)頁數(shù)據(jù)的，現(xiàn)在允許傳輸任意類型的數(shù)據(jù)。
傳輸 HTTP 協(xié)議格式的數(shù)據(jù)是基于 TCP 傳輸協(xié)議的，發(fā)送數(shù)據(jù)之前需要先建立連接。
它規(guī)定了瀏覽器和 Web 服務(wù)器通信數(shù)據(jù)的格式，也就是說瀏覽器和web服務(wù)器通信需要使用http協(xié)議。
通信效果圖:
學(xué)習(xí)目標(biāo)
URL的英文全拼是(Uniform Resoure Locator),表達(dá)的意思是統(tǒng)一資源定位符，通俗理解就是網(wǎng)絡(luò)資源地址，也就是我們常說的網(wǎng)址。
URL的樣子:
https://news.163.com/18/1122/10/E178J2O4000189FH.html
URL的組成部分:
域名:
域名就是IP地址的別名，它是用點進(jìn)行分割使用英文字母和數(shù)字組成的名字，使用域名目的就是方便的記住某臺主機(jī)IP地址。
URL的擴(kuò)展:
https://news.163.com/hello.html?page=1&count=10
參數(shù)說明:
學(xué)習(xí)目標(biāo)
首先需要安裝Google Chrome瀏覽器，然后Windows和Linux平臺按F12調(diào)出開發(fā)者工具, mac OS選擇 視圖 -> 開發(fā)者 -> 開發(fā)者工具或者直接使用 alt+command+i 這個快捷鍵，還有一個多平臺通用的操作就是在網(wǎng)頁右擊選擇檢查。
開發(fā)者工具的效果圖:
開發(fā)者工具的標(biāo)簽選項說明:
開發(fā)者工具使用效果圖:
開發(fā)者工具的使用說明:
查看http請求信息效果圖:
查看http響應(yīng)信息效果圖:
學(xué)習(xí)目標(biāo)
HTTP最常見的請求報文有兩種:
說明:
HTTP GET 請求報文效果圖:
GET 請求報文說明:
---- 請求行 ----
GET / HTTP/1.1 # GET請求方式 請求資源路徑 HTTP協(xié)議版本
---- 請求頭 -----
Host: www.itcast.cn # 服務(wù)器的主機(jī)地址和端口號,默認(rèn)是80
Connection: keep-alive # 和服務(wù)端保持長連接
Upgrade-Insecure-Requests: 1 # 讓瀏覽器升級不安全請求，使用https請求
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36 # 用戶代理，也就是客戶端的名稱
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8 # 可接受的數(shù)據(jù)類型
Accept-Encoding: gzip, deflate # 可接受的壓縮格式
Accept-Language: zh-CN,zh;q=0.9 #可接受的語言
Cookie: pgv_pvi=1246921728; # 登錄用戶的身份標(biāo)識
---- 空行 ----
GET 請求原始報文說明:
GET / HTTP/1.1\r\n
Host: www.itcast.cn\r\n
Connection: keep-alive\r\n
Upgrade-Insecure-Requests: 1\r\n
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36\r\n
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8\r\n
Accept-Encoding: gzip, deflate\r\n
Accept-Language: zh-CN,zh;q=0.9\r\n
Cookie: pgv_pvi=1246921728; \r\n
\r\n (請求頭信息后面還有一個單獨(dú)的’\r\n’不能省略)
說明：
HTTP POST 請求報文效果圖:
請求體效果圖:
POST 請求報文說明:
---- 請求行 ----
POST /xmweb?host=mail.itcast.cn&_t=1542884567319 HTTP/1.1 # POST請求方式 請求資源路徑 HTTP協(xié)議版本
---- 請求頭 ----
Host: mail.itcast.cn # 服務(wù)器的主機(jī)地址和端口號,默認(rèn)是80
Connection: keep-alive # 和服務(wù)端保持長連接
Content-Type: application/x-www-form-urlencoded # 告訴服務(wù)端請求的數(shù)據(jù)類型
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36 # 客戶端的名稱
---- 空行 ----
---- 請求體 ----
username=hello&pass=hello # 請求參數(shù)
POST 請求原始報文說明:
POST /xmweb?host=mail.itcast.cn&_t=1542884567319 HTTP/1.1\r\n
Host: mail.itcast.cn\r\n
Connection: keep-alive\r\n
Content-Type: application/x-www-form-urlencoded\r\n
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36\r\n
\r\n(請求頭信息后面還有一個單獨(dú)的’\r\n’不能省略)
username=hello&pass=hello
說明：
GET和POST請求對比效果圖:
學(xué)習(xí)目標(biāo)
HTTP 響應(yīng)報文效果圖:
響應(yīng)報文說明:
--- 響應(yīng)行/狀態(tài)行 ---
HTTP/1.1 200 OK # HTTP協(xié)議版本 狀態(tài)碼 狀態(tài)描述
--- 響應(yīng)頭 ---
Server: Tengine # 服務(wù)器名稱
Content-Type: text/html; charset=UTF-8 # 內(nèi)容類型
Transfer-Encoding: chunked # 發(fā)送給客戶端內(nèi)容不確定內(nèi)容長度，發(fā)送結(jié)束的標(biāo)記是0\r\n, Content-Length表示服務(wù)端確定發(fā)送給客戶端的內(nèi)容大小，但是二者只能用其一。
Connection: keep-alive # 和客戶端保持長連接
Date: Fri, 23 Nov 2018 02:01:05 GMT # 服務(wù)端的響應(yīng)時間
--- 空行 ---
--- 響應(yīng)體 ---
<!DOCTYPE html><html lang=“en”> …</html> # 響應(yīng)給客戶端的數(shù)據(jù)
原始響應(yīng)報文說明:
HTTP/1.1 200 OK\r\n
Server: Tengine\r\n
Content-Type: text/html; charset=UTF-8\r\n
Transfer-Encoding: chunked\r\n
Connection: keep-alive\r\n
Date: Fri, 23 Nov 2018 02:01:05 GMT\r\n
\r\n(響應(yīng)頭信息后面還有一個單獨(dú)的’\r\n’不能省略)
<!DOCTYPE html><html lang=“en”> …</html>
說明:
每項數(shù)據(jù)之間使用:\r\n
HTTP 狀態(tài)碼是用于表示web服務(wù)器響應(yīng)狀態(tài)的3位數(shù)字代碼。
狀態(tài)碼 | 說明 |
200 | 請求成功 |
307 | 重定向 |
400 | 錯誤的請求，請求地址或者參數(shù)有誤 |
404 | 請求資源在服務(wù)器不存在 |
500 | 服務(wù)器內(nèi)部源代碼出現(xiàn)錯誤 |
學(xué)習(xí)目標(biāo)
可以為發(fā)出請求的瀏覽器提供靜態(tài)文檔的程序。
平時我們?yōu)g覽百度新聞數(shù)據(jù)的時候，每天的新聞數(shù)據(jù)都會發(fā)生變化，那訪問的這個頁面就是動態(tài)的，而我們開發(fā)的是靜態(tài)的，頁面的數(shù)據(jù)不會發(fā)生變化。
搭建Python自帶的靜態(tài)Web服務(wù)器使用 python3 -m http.server 端口號, 效果圖如下:
-m選項說明:
-m表示運(yùn)行包里面的模塊，執(zhí)行這個命令的時候，需要進(jìn)入你自己指定靜態(tài)文件的目錄，然后通過瀏覽器就能訪問對應(yīng)的 html文件了，這樣一個靜態(tài)的web服務(wù)器就搭建好了。
通過瀏覽器訪問搭建的靜態(tài)Web服務(wù)器，效果圖如下:
查看http的通信過程,效果圖如下:
VvvebJs是一個開源的網(wǎng)頁拖拽自動生成的JavaScript庫，你可以以簡單拖拽的方式生成自己需要的網(wǎng)頁樣式，內(nèi)置jquery和Bootstrap，你可以拖拽相關(guān)的組件進(jìn)行網(wǎng)頁的構(gòu)建，非常的方便，而且可以實時修改代碼，功能豐富，使用簡單，界面友好，特別適合一些專注于展示的網(wǎng)頁設(shè)計，需要的朋友不可錯過！
https://github.com/givanz/VvvebJs
默認(rèn)情況下，編輯器附帶Bootstrap 4和Widgets組件，可以使用任何類型的組件和輸入進(jìn)行擴(kuò)展。
如下代碼：
<!-- jquery-->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.hotkeys.js"></script>
<!-- bootstrap-->
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<!-- builder code-->
<script src="libs/builder/builder.js"></script>
<!-- undo manager-->
<script src="libs/builder/undo.js"></script>
<!-- inputs-->
<script src="libs/builder/inputs.js"></script>
<!-- components-->
<script src="libs/builder/components-bootstrap4.js"></script>
<script src="libs/builder/components-widgets.js"></script>
<script>
$(document).ready(function()
{
Vvveb.Builder.init('demo/index.html', function() {
//load code after page is loaded here
Vvveb.Gui.init();
});
});
</script>
要初始化編輯器，調(diào)用Vvveb.Builder.init。第一個參數(shù)是要加載以進(jìn)行編輯的URL，它必須位于相同的子域中才能進(jìn)行編輯。第二個參數(shù)是頁面加載完成時調(diào)用的函數(shù)，默認(rèn)情況下調(diào)用編輯器Gui.init();
Component Group是一個組件集合，例如Bootstrap 4組由Button和Grid等組件組成，該對象僅用于在編輯器左側(cè)面板中對組件進(jìn)行分組。例如，Widgets組件組只有兩個組件視頻和地圖，并被定義為如下
Vvveb.ComponentsGroup['Widgets']=["widgets/googlemaps", "widgets/video"];
Component是一個對象，它提供可以在畫布上放置的html以及在選擇組件時可以編輯的屬性，例如Video Component，具有Url和Target屬性的html鏈接Component定義為：
Vvveb.Components.extend("_base", "html/link", {
nodes: ["a"],
name: "Link",
properties: [{
name: "Url",
key: "href",
htmlAttr: "href",
inputtype: LinkInput
}, {
name: "Target",
key: "target",
htmlAttr: "target",
inputtype: TextInput
}]
});
在Component屬性集合中使用Input對象來編輯屬性，例如文本輸入，選擇，顏色，網(wǎng)格行等。例如，TextInput擴(kuò)展Input對象并定義為：
var TextInput=$.extend({}, Input, {
events: {
"keyup": ['onChange', 'input'],
},
setValue: function(value) {
$('input', this.element).val(value);
},
init: function(data) {
return this.render("textinput", data);
},
}
);
輸入還需要一個在編輯器html（在editor.html中）定義為<script>標(biāo)簽的模板，其id為vvveb-input-inputname，例如對于文本輸入為vvveb-input-textinput，定義：
<script id="vvveb-input-textinput" type="text/html">
<div>
<input name="{%=key%}" type="text" class="form-control"/>
</div>
</script>
以上是借助瀏覽器翻譯工具，對官網(wǎng)的文檔進(jìn)行簡單的翻譯，可能會有些不夠準(zhǔn)確的地方，感興趣的小伙伴可以直接查看相關(guān)文檔！
VvvebJs是一個非常強(qiáng)大的網(wǎng)頁可視化生成構(gòu)建工具，讓不懂網(wǎng)頁設(shè)計的小伙伴們也能夠通過拖拽來生成美觀大方的網(wǎng)頁出來，讓設(shè)計網(wǎng)頁就像設(shè)計圖片一樣，VvvebJs特別適合展示型網(wǎng)頁，甚至可以不需要代碼就能完成一項復(fù)雜的網(wǎng)頁設(shè)計，總體來說，VvvebJs是一個值得嘗試的工具！
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
