一、Gin

1、Ajax

        AJAX 即“Asynchronous Javascript And XML”(异步 JavaScript和 XML),是指一种创建交互式、快速动态网页应用的网页开发技术,无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。

        AJAX的最大的特点: 异步访问,局部刷新。

案例:Ajax之验证用户名是否被占用

main.go

func main() {
	r := gin.Default()
	r.LoadHTMLGlob("part02/templates/**/*")
	//指定js文件:
	r.Static("/s", "part02/static")
	r.GET("/test1", myfunc.Test1)
	r.POST("/getUserInfo", myfunc.Test2)
	r.POST("/ajaxpost", myfunc.Test3)
	r.Run()
}

myfunc.go

func Test1(context *gin.Context) {
	context.HTML(200, "demo01/hello01.html", nil)
}

func Test3(context *gin.Context) {
	//获取post-ajax请求的数据,获取对应的参数:
	uname := context.PostForm("uname")
	fmt.Println(uname)
	fmt.Println(uname == "丽丽")
	if uname == "丽丽" {
		context.JSON(200, gin.H{
			"msg": "用户名重复了!",
		})
	} else {
		context.JSON(200, gin.H{
			"msg": "",
		})
	}
}

hello01.html  注意:引入jQuery.min.js

{{define "demo01/hello01.html"}}
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/s/css/mycss.css">
    <script src="/s/js/jQuery.min.js"></script>
</head>
<body>
    用户form表单<br>
    <form action="/getUserInfo" method="post">
        用户名:<input type="text" name="username" id="uname"><span id="errmsg"></span><br>
        密码:<input type="password" name="pwd">
        <input type="submit" value="提交">
    </form>

    <script>
        //获取用户名的文本框
        var unametext = document.getElementById("uname");
        //给文本框绑定一个事件:失去焦点的时候会触发后面的函数的事件
        unametext.onblur = function () {
            //获取文本框的内容:
            var uname = unametext.value;
            //alert(uname)可以弹出数据,验证代码的正确性
            //局部刷新:通过ajax技术来实现数据的校验 ---》 后台 :异步访问,局部刷新
            //调用ajax方法需要传入json格式的数据: $.ajax({属性名:属性值,属性名:属性值,方法名:方法})
            $.ajax({
                url : "/ajaxpost",//请求路由
                type : "POST",//请求类型 GET、POST
                data : {//向后端发送的数据,以json格式向后传递
                    "uname" : uname
                },
                success : function (info) {//后台响应成功会调用函数,info-后台响应的数据封装到info中,info名字可以随便起
                    document.getElementById("errmsg").innerText = info["msg"]
                },
                fail : function () {后台响应失败会调用函数
                }
            })
        }
    </script>
</body>
</html>
{{end}}

测试:

Web framework-Gin(二)-LMLPHP

2、文件上传

form表单中文件上传(单个文件)

main.go

func main() {
	r := gin.Default()
	r.LoadHTMLGlob("part03/templates/**/*")
	r.GET("/userindex", myfunc.Test1)
	r.POST("/savefile", myfunc.Test2)
	r.Run()
}

myfunc.go

func Test1(context *gin.Context) {
	context.HTML(200, "demo01/hello01.html", nil)
}

func Test2(context *gin.Context) {
	//获取前端传入的文件:
	file, _ := context.FormFile("myfile")
	fmt.Println(file.Filename)
	//加入一个时间戳:
	time_int := time.Now().Unix()
	time_str := strconv.FormatInt(time_int, 10) //10:十进制
	//保存在我的本地:
	context.SaveUploadedFile(file, "e://"+time_str+file.Filename)
	//响应一个字符串:
	context.String(200, "文件上传成功")
}

hello01.html 

{{define "demo01/hello01.html"}}
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/s/css/mycss.css">
</head>
<body>
    用户form表单<br>
    <form action="/savefile" method="post" enctype="multipart/form-data">
        <input type="file" name="myfile">
        <input type="submit" value="提交">
    </form>
</body>
</html>
{{end}}

测试:

Web framework-Gin(二)-LMLPHP

Web framework-Gin(二)-LMLPHP

3、模板语法

4、数据绑定

5、路由组

6、中间件

Web framework-Gin

Go framework-Beego

难留少年时,总有少年来!

无论你是年轻还是年长,所有程序员都需要记住:时刻努力学习新技术,否则就会被时代抛弃!

09-05 02:29