2017.05.27 WeX5後端服務開發之註冊

1.數據庫搭建：前提啓動Mysql，以及數據庫管理工具HeidiSQL

本地數據庫配置：127.0.0.1，用戶名：root，密碼：x5

數據庫表的選擇：編碼爲：utf8_general_ci,能夠存儲中文，必須設置主鍵

還有關鍵的一步，在於全部字段類型都應該設置爲CHAR，包括ID，也不該該爲INT型，這樣不容易出錯 

 

2.在WeX5界面配置：窗口->首選項->studio配置->數據源->添加剛纔在MySQL中配置的數據庫

①數據源名稱很重要，不要忘記或寫錯，測試數據庫鏈接成功

②數據庫控制窗口，刷新數據庫，鏈接剛纔配置的數據源，鏈接成功

 

3.WeX5模型資源的控制窗口：   //這步很是容易忽略，很是關鍵，不要忘了

Baas文件夾下->db.config.m文件中，勾選剛纔配置的數據源，記住數據源的名稱，必須是剛纔數據庫控制窗口下的數據源名字

 

4.WeX5模型資源的控制窗口：

①Baas下新建文件夾，文件夾名稱最好和數據源名稱一致

②在新建的文件夾下，新建JAVA文件，這個java文件就是用來完成數據庫鏈接，以及註冊/登陸的方法，JAVA文件名必須首字母大寫，並且和以後新建的服務的名字一致

下面是JAVA文件的代碼，很是重要：

 

package jigou;                      //包名，就是Baas下新建文件夾的文件夾名稱

 

import java.sql.Connection;
import java.sql.Date;

 

import javax.naming.NamingException;

 

import com.alibaba.fastjson.JSONObject;
import com.justep.baas.action.ActionContext;
import com.justep.baas.data.DataUtils;
import com.justep.baas.data.Table;
import com.justep.baas.data.Transform;
import com.justep.baas.data.sql.SQLException;                //這些引用的java文件保持不變就好，複製代碼，不用外部去添加

 

public class Jigouindex {
private static final String DATASOURCE_LIKE = "jigou";    

//！！！！這裏是最最關鍵的，我一直的Bug出在這裏，數據源的名稱必須是db.config.m文件中，勾選的配置的數據源名稱

public static JSONObject zuce(JSONObject params, ActionContext context) throws SQLException, NamingException {
try {
String sql = "SELECT count(s.JGEmailorPhone) " + " FROM jigouzuce s where s.JGEmailorPhone= '" + params.getString("JGEmailorPhone") + "'";  

//這裏把jigouzuce這張表又命名爲s，而後params.getString("JGEmailorPhone")，這是在從JS方法中得到前端的input的val值，具體解釋看下邊的JS代碼
Connection conn;
conn = context.getConnection(DATASOURCE_LIKE);
int num = Integer.parseInt(DataUtils.getValueBySQL(conn, sql, null).toString());
System.out.println(num);
if (num == 0) {
String sql1 = "insert into jigouzuce(JGEmailorPhone,JGPassword,JGID,JGsigninTime) values('" + params.getString("JGEmailorPhone") + "','" + params.getString("JGPassword") + "','" + params.getString("JGID") + "','" + params.getString("JGsigninTime") + "')";      

//插入數據庫的ssql語句，最好先在數據庫中執行一遍，能執行成功在編譯java文件，黑體字必須是是數據庫中的列名
java.sql.PreparedStatement pstmt = null;
System.out.println(sql1);
pstmt = conn.prepareStatement(sql1);
pstmt.execute();

 

}
JSONObject ret = new JSONObject();
ret.put("state", "1");
return ret;
} catch (java.sql.SQLException e) {
JSONObject ret = new JSONObject();
ret.put("state", "0");
return ret;
}
}
}

 

 

③在新建的文件夾下，新建服務，服務的名稱應該和剛纔新建的java文件名稱一致，可是首字母小寫

新建Action，不用新建數據表Action，直接點擊新增，按照圖片說明進行編輯，實現那邊必須寫剛纔新建的java文件名，以及java文件中的方法名

 

 ④保存java文件和服務文件，右擊剛纔新建的文件夾，選擇模型編譯，模型必須編譯才能執行後續的操做

 

5.下面來到前端部分：

①新建W文件，選擇一個註冊或登陸的模板界面

②選中輸入框，找到input組件的屬性設置窗口，從新命名它的xid

 

③相似的把其餘幾個輸入框，也就是input組件的xid，也從新命名

 

④前端中，最關鍵的一步來了，選中按鈕組件，切換到button的屬性設置窗口

自定義屬性：onClick：regBtnClick

 

 切換到button的事件設置窗口，雙擊onClick的輸入框，會切換到JS代碼編輯的窗口，自動建立一個方法，從新命名爲regBtnClick：

下邊就是關鍵的前端代碼部分：

Model.prototype.regBtnClick = function(event){                                               //button的onClick事件對應的方法名稱
if(this.comp("password").val()==this.comp("repassword").val()){                       //this.comp("input的xid")
var _this = this;
justep.Baas.sendRequest({
"url" : "/jigou/jigouindex",                                                                               //關鍵的url，標識了前端數據提交到後端處理的路徑，構成：Baas下文件夾名/服務名
"action" : "Jigouzuce",　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　//action標識了，url中的服務jigouindex下，對應處理這個js方法的action，
"async" : false,
"params" : {                                                      //params，獲取前端input組件中的值，即this.comp("input組件的xid").val()，是一個JSON數據組
"JGEmailorPhone":this.comp("jigouname").val(),               //對應於剛纔創建的java文件中的，params.getString("JGEmailorPhone")
"JGPassword":this.comp("password").val(),
"JGsigninTime":justep.Date.toString(new Date(), justep.Date.STANDART_FORMAT),
"JGID":justep.UUID.createUUID()
},
"success" : function(data) {
if(data.state ==1){
alert("註冊成功！");
_this.comp("windowDialog1").open();
}else{
alert("註冊失敗");
}
}
});
}

};

 

 

 

6.前端還有關鍵的一步，就是在model中添加data組件，而不是baasdata組件，data組件編輯的列和遠程數據庫的表中的列名一致，

剛纔測試好像不須要data組件也能夠註冊成功，因此這步能夠忽略？