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组件也可以注册成功,所以这步可以忽略?

原文地址:https://www.cnblogs.com/hqutcy/p/6912242.html