springmvc+vue+vux整合要点

一. springmvc：
springmvc框架搭建此处不再赘述。
以下几点注意：
1.json方式与前端传递对象参数：

/**
	 * @ResponseBody用以将map以json形式返回
	 * @RequestBody用以以json形式传入member对象
	 * @param httpSession
	 * @return
	 * @throws IOException
	 */	
	@ResponseBody
	@RequestMapping(method = RequestMethod.POST, value = "/deleteMember", produces = { "application/json;charset=UTF-8" })
	public  Map deleteMemberProcess(HttpServletRequest request, HttpServletResponse response, @RequestBody Member member) throws IOException {
		memberService.deleteMember(member);
		Map map = new HashMap();
		map.put("status", 0);
		return map;
	}

在vue中的调用：

  this.$http.post(this.GLOBAL.site+"/admin/deleteAppoint",item).then(function (res) {
          console.log("deleteAppoint status:" + res.body.status)
          if (res.body.status == 0) {
            this.getPublishedAppoints()
          }
        })

整个map以json格式放入res.body中，map中status变量为res.body.status。
2.定时器任务：
有个需求需要在每天的23点以前执行一些删除任务，这需要用到springmvc的定时器，具体配置如下：

@Scheduled(cron = "0 0 23 * * ?") // 每天23点执行删除任务
    public void taskCycle() {
    	//删除任务代码
    }

在spring-mvc.xml中，配置task。
具体可以参照：
https://www.cnblogs.com/liaojie970/p/5913272.html
3.静态资源配置：
具体参见以下两篇文章：
https://www.cnblogs.com/dflmg/p/6393416.html
https://blog.csdn.net/codejas/article/details/80055608
spring-mvc.xml中的配置如下

vue执行npm run build后会在project目录下生成dist文件，里面有：
static文件夹：包括css、js、img
index.html
将static文件夹及index.html复制进eclipse的src->main->webapp目录下即可。该目录还有一个WEB-INF，里面配置了web.xml
这样静态资源与xml中配置的 location="/static/js/“及location=”/static/css/"对应起来了。当然mvc:resources的配置是多余的。
4.JuitTest：
@Test及函数名前缀test都要加上

@Test
	public void testRegisterMember() {
	}

如果想在maven build时跳过test，runAs->maven build…中配置Goals：
clean install -DskipTests
5.数据库路径编码：
具体配置如下：

			jdbc:mysql://localhost:3306/schooldb?useUnicode=true&characterEncoding=UTF-8&useSSL=false

6.数据自动创建：
在云服务器上你可能不想写sql语句创建数据库，可以利用Hibernate根据实体类自动创建：

  
            
                update 
                org.hibernate.dialect.MySQL5Dialect
                true
                true
            
        

现将update中update改为create上传至云服务器，start tomcat服务器，然后改回update，再上传运行，数据库就建好了，当然create database schooldb必须手动先执行下，否则数据库连接不上。
7.联合主键：
预约Id与手机号联合主键，同时该类要实现implements Serializable。

	/**
     * 预约Id
     */
    @Id
    @Column(name = "APPOINT_ID")
    private String appointID;

    /**
     * 会员手机号
     */
    @Id
    @Column(name = "MOBILE")
    private String mobile;

另外需要重写hashCode及equals，这个shift+alt+s自动生成就好了：

@Override
	public int hashCode() {
		final int prime = 31;
		int result = 1;
		result = prime * result + ((appointID == null) ? 0 : appointID.hashCode());
		result = prime * result + ((mobile == null) ? 0 : mobile.hashCode());
		return result;
	}

	@Override
	public boolean equals(Object obj) {
		if (this == obj)
			return true;
		if (obj == null)
			return false;
		if (getClass() != obj.getClass())
			return false;
		MemberAppoint other = (MemberAppoint) obj;
		if (appointID == null) {
			if (other.appointID != null)
				return false;
		} else if (!appointID.equals(other.appointID))
			return false;
		if (mobile == null) {
			if (other.mobile != null)
				return false;
		} else if (!mobile.equals(other.mobile))
			return false;
		return true;
	}

其他方案见：https://www.cnblogs.com/lcngu/p/5854864.html
8.跨域配置：
对跨域的一个详细解释如下：
https://segmentfault.com/a/1190000012469713
因为涉及到同机搭建tomcat与node.js，用于vue测试，所以要配置跨域。
web.xml中实现如下：

 	
 		CorsFilter
 		com.thetransactioncompany.cors.CORSFilter
 	
 	
 		CorsFilter
 		/*
	

二. Vue部分：
待续