SpringMVC demo 小例子,实现简单的记名和注册葡京网上娱乐场

我是一个刚毕业半年多的前端小白,进集团办事的时候,由于店铺的前端技术还没定下来,所以在做项目的时候自己是自由发挥。由于vue具有上心灵,开发效能高的特色,所以,我在做项目时候,便接纳了vue作为技术栈,由于是率先次接纳bootstrap加jQuery以外的技术栈,所以以下是在完成项目的进程中,对vue使用方面认识不到或不足的自问。

1.创设一个动态的web工程

1.率先,新手使用vue最普遍的失误,就是DOM操作,而vue的双向数据绑定,恰恰让咱们其实不需要展开繁琐的DOM操作,我们只需要关怀数据层面就足以了。想想自己最开首拿到input仍然用什么样document.getElementById(‘id’).value这种,就觉着温馨很傻,明明只需要v-model绑定data就好了,唉~

2.导入springMvc所急需的jar包(这里能够去网上找,资源有诸多)

2.认为vue只可以用来开发SPA。直到见到尤大神在天涯论坛上答应的:不肯定做个档次就非得cli一个一家子桶,vue也不是为单页面而生的。我才了然,vue的使用形式,我偏偏知道冰山一角,咋样能灵活依照自己的要求使用支付,还需自己之后的多多成人。

前两部就不详细描述了,后边才是尊重代码~

3.组件化思想。初叶一最先,觉得人家的UI框架都写好了,就直接拿来用。当然如此做并没有什么问题。不过,当自家发现我每个页面几乎都有几段同样的代码,或者都亟待用到这一个UI框架的机件,比如面包屑,比如导航菜单,那我干嘛不把如此UI框架做成独立的组件呢?

率先有一个web.xml文件,这一个属于大布局文件,由于只要写login,里面大概布置一下骨干条件就足以

4.路由懒加载。当自身的门类打包后,运行,初次加载慢的飞起。那让自己很高烧,这样光有付出进度有咋样用,用户体验肯定是不佳的。我查了下打包后的dist文件夹,我去,好几兆。所以,难道要本人再度选取其他技术栈再开发一次。当然是无法了。在网上查了材料后,终于精通了路由懒加载这一个艺术。使用路由懒加载后,webpack会把原先很大的js分解成四个体积较小的js,当大家运行加载行,它会按需加载,那样初次加载过长的题材便解决了。

 

5.webpack。用到了vue全家桶,便少不了webpack。并不是,你npm run
build,就可以安心睡觉去。就比如我在行使video.js时就需要在webpack里面配备(这些搞了自己很久,头皮发麻)。webpack是个有力的东西,可以遵照webpack做过多的事,比如,引入其他插件,把单页面改成多页面配置,给文件夹配置路径方便书写等等。但,不得不说,这多少个东西很难学,而且官网说实话对自身而言写的并不通俗易懂,这么些个插件表达文档就更别提了,能看懂的不到一半。当然也说不定是我太菜。要想成长,webpack是我从此必须攻下的难点。

<servlet>
    <servlet-name>springmvc</servlet-name>
    <servlet-class>
        org.springframework.web.servlet.DispatcherServlet
    </servlet-class>
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
     <servlet-name>springmvc</servlet-name>
     <url-pattern>/</url-pattern>
  </servlet-mapping>

6.终极一个,无关于vue,这便是,遭逢题目,先想一想,上网查看资料,资料看不懂了,再去问人家。这一点其实际职场很首要,因为我们都有投机的做事,何人也从没时间和无偿去帮你,所以能团结解决的尽量协调解决。

参与的那么些叫Dispatcher
Servlet,可以依据servlet-name找到相应的小布置文件,也就是部署spring
MVC的文件

自我小白,不足之处多多指教。

在web.xml文件同级目录下新建springmvc-servlet.xml文件,下边是springmvc-servlet.xml文件中的内容

 

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns:p="http://www.springframework.org/schema/p"
    xmlns:context="http://www.springframework.org/schema/context"
    xmlns:mvc="http://www.springframework.org/schema/mvc"
    xsi:schemaLocation="
    http://www.springframework.org/schema/beans
    http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
    http://www.springframework.org/schema/context
    http://www.springframework.org/schema/context/spring-context-3.0.xsd
    http://www.springframework.org/schema/mvc 
    http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd">
    <!--默认的注解映射的支持 -->
    <mvc:annotation-driven/>
    <!--启用自动扫描 -->
    <context:component-scan base-package="controller"/>
    <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/jsp/"/>
        <property name="suffix" value=".jsp"/>
    </bean>
</beans>

只顾表达的是,启动自动扫描,spring会在指定的包下(例如我这边是controller包),自动扫描标注@Controller的类

prefix指的是重返的值给电动加一个前缀,同理suffix指的就是后缀

葡京网上娱乐场 1

 

 葡京网上娱乐场 2

看样子此间也是够勤奋了,下面是交由的总体目录,下边起初写逻辑代码,先从loginController起始

@Controller
public class LoginController {
    @RequestMapping(value="/",method=RequestMethod.GET)
    public String sayHello(){
        //model.addAttribute("msg", "Hello,World!");
        return "login";
    }

诠释下边代码,@Controller,标注这么些类是Controller类,spring会自动举行扫描,@Request
Mapping中的value指的是url中的地址后缀,设置成/的指标自然是为了有利于啊,

比如说启动工程时,url只需要输入什么localhost:8080/项目名,它就会自动跳转到login页面;method指的是来的url是post请求如故get请求

return的是login字符串,我们还记得上边说的prefix了呢,它就会把你的url自动拼接上,完整路径就是上边这多少个

/WEB-INF/jsp/login.jsp

 接下来看login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>login</title>
</head>
<body>
    <form action="login" method="post">
        用户名:<input type="text" name="username"/><br/>
        密&nbsp;&nbsp;码:<input type="password" name="password"/>
        <input type="submit" value="登陆"/>
        <a href="regist">注册</a>
    </form>
</body>
</html>

此地的action重返的是login,Controller会自动捕获到这个请求,于是在login
Controller中要有一个办法来捕获这么些请求

@RequestMapping(value="login",method=RequestMethod.POST)
    public String login(Model model, // 向前台页面传的值放入model中
            HttpServletRequest request){ // 从前台页面取得的值
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        String user_name = LoginCheck.check(username, password);
        if(user_name != null && user_name != ""){
            model.addAttribute("msg", user_name);
            return "success";
        }else{
            return "login2";
        }
    }

登陆嘛,当然要有表明,于是就有了LoginCheck,不多说,上代码

package logic;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;

import dao.Dao;

public class LoginCheck {

    public static String check(String username,String password){
        try {
            Connection conn = Dao.getConnection();
            PreparedStatement p = conn.prepareStatement("select * from user_t where user_name=? and password=?");
            p.setString(1, username);
            p.setString(2, password);
            ResultSet rs = p.executeQuery();
            if(rs.next()){
                String user_name = rs.getString("user_name");
                Dao.close(rs, p, conn);
                return user_name;
            }
            Dao.close(rs, p, conn);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return "";
    }
}

向数据库查询就要有DAO啦,Dao网上都有,我的就是在网上随便找一个改动就用了~

package dao;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

public class Dao {
    // 获取数据库连接
    public static Connection getConnection(){

        Connection conn = null;
        String url = "jdbc:mysql://127.0.0.1:3306/test?characterEncoding=utf8&useSSL=false&serverTimezone=Hongkong";
        try
        {
            Class.forName("com.mysql.cj.jdbc.Driver");
            conn = DriverManager.getConnection(url,"root","数据库密码");//大家分享代码的时候也不要暴露自己的数据库密码,这样是非常不安全的
        }
        catch(ClassNotFoundException e)
        {
            e.printStackTrace();
            System.out.println("数据库驱动加载出错");
        }
        catch(SQLException e)
        {
            e.printStackTrace();
            System.out.println("数据库出错");
        }
        return conn;
    }
     //关闭相关通道
    public static void close(ResultSet rs,PreparedStatement p,Connection conn)
    {
        try
        {
            if(!rs.isClosed()){
                rs.close();
            }
            if(!p.isClosed()){
                p.close();
            }
            if(!conn.isClosed()){
                conn.close();
            }
        }
        catch(SQLException e)
        {
            e.printStackTrace();
            System.out.println("数据关闭出错");
        }
    }
    //关闭相关通道
    public static void close(PreparedStatement p,Connection conn)
    {
        try
        {
            if(!p.isClosed()){
                p.close();
            }
            if(!conn.isClosed()){
                conn.close();
            }
        }
        catch(SQLException e)
        {
            e.printStackTrace();
            System.out.println("数据关闭出错");
        }
    }
}

好了,假设查询的结果卓绝上数据库中询问到的值了,那么就可以跳转到success页面了,success.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>登陆成功</title>
</head>
<body>
    登陆成功!
    欢迎~${msg};
</body>
</html>

login大功告成,接下去的注册页面和这一个道理相似,我不多废话了,把代码附上供我们参考

首先是regist.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册页面</title>
</head>
<body>
    <form action="registSuccess" method="Post">
        用户名:<input type="text" name="username"/>
        密&nbsp;&nbsp;码<input type="text" name="password"/>
        年&nbsp;&nbsp;龄<input type="number" name="age"/>
        <input type="submit" value="提交"/>
    </form>
</body>
</html>

接下去是RegistController

package controller;

import javax.servlet.http.HttpServletRequest;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

import logic.RegistCheck;

@Controller
public class RegistController {
    @RequestMapping(value="regist",method=RequestMethod.GET)
    public String regist(){
        return "regist";
    }

    @RequestMapping(value="registSuccess",method=RequestMethod.POST)
    public String registSuccess(HttpServletRequest request,Model model){
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        String age = request.getParameter("age");

        if(RegistCheck.registCheck(username, password,age)){
            model.addAttribute("username", username);
            return "login";
        }else{
            return "regist2";
        }
    }
}

接下去是RegistCheck

 

package logic;

import java.sql.Connection;
import java.sql.PreparedStatement;

import dao.Dao;

public class RegistCheck {

    public static boolean registCheck(String username,String password,String age){
        String user_name = LoginCheck.check(username, password);
        if(user_name == null || user_name == ""){
            try {
                Connection conn = Dao.getConnection();
                PreparedStatement p = conn.prepareStatement("insert user_t(user_name,password,age) VALUES (?,?,?);");
                p.setString(1, username);
                p.setString(2, password);
                p.setString(3, age);
                p.executeUpdate();
                System.out.println("注册成功");
                Dao.close(p, conn);
                return true;
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
        return false;
    }
}

再有一个registSuccess.jsp,成功再次来到的页面,我只是放了个空页面,没内容

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>注册成功</title>
</head>
<body>
    注册成功!
</body>
</html>

好了,现在寿终正寝login和登记页面都写好了,新人刚到集团的时候相当容易遇到这么的小锻练,哈哈哈说多了,喜欢就点赞哈

迎接转载,转载请讲明出处~

Java从学习到放任,MySQL从删库到跑路,哈哈哈