用Go+Vue.js快速搭建一个Web应用(初级demo)

2020-01-28 12:40:30丽君

Vue.js做为目前前端最热门的库之一,为快速构建并开发前端项目多了一种思维模式。本文给大家介绍用Go+Vue.js快速搭建一个Web应用(初级demo)。

环境准备:

1. 安装go语言,配置go开发环境;

2. 安装node.js以及npm环境;

Gin的使用:

为了快速搭建后端应用,采用了Gin作为Web框架。Gin是用Golang实现的一种Web框架,api非常友好,且拥有出色的路由性能和详细的错误提示,如果你想快速开发一个高性能的生产环境,Gin是一个不错的选择。

下载和安装Gin:

go get github.com/gin-gonic/gin

代码中使用:


import "github.com/gin-gonic/gin"

下面是一个使用Gin的简单例子:


package main 
import "github.com/gin-gonic/gin" 
 func main() { 
  r := gin.Default() 
  r.GET("/ping", func(c *gin.Context) { 
    c.JSON(200, gin.H{ 
      "message": "pong", 
    }) 
  }) 
  r.Run() // listen and serve on 0.0.0.0:8080 
}

注:Gin可以很方便的支持各种HTTP请求方法以及返回各种类型的数据,详情可以前往https://github.com/gin-gonic/gin查看。

开始一个项目:

在Gogland(IDE)中新建一个项目:demo,并建立一个main.go文件作为项目入口:


package main 
import ( 
  "demo/router" 
) 
 func main() { 
  router.Init() // init router 
}

注: go中package main 必须包含一个main函数。

从上面的代码可以看到,我们引入了demo下面的router包,并显式的调用了router的Init()函数, 那现在我们就在demo项目下新建router目录,并在目录下建立router.go用于编写路由规则,代码如下:


package router
import (
     "demo/handlers"
     "github.com/gin-gonic/gin"
)
func Init() {
     // Creates a default gin router
     r := gin.Default()  // Grouping routes
     // group: v1
     v1 := r.Group("/v1")
     {
         v1.GET("/hello", handlers.HelloPage)
     }
     r.Run(":8000") // listen and serve on 0.0.0.0:8000
}

在这里,我们创建了一个gin的默认路由,并为其分配了一个组 v1,监听hello请求并将其路由到视图函数HelloPage,最后绑定到 0.0.0.0:8000。

现在我们来创建视图函数,新建handlers目录,并在目录下新建hello.go文件,代码如下:


package handlers 
import ( 
     "github.com/gin-gonic/gin" 
     "net/http" 
) 
func HelloPage(c *gin.Context) { 
     c.JSON(http.StatusOK, gin.H{ 
         "message": "welcome", 
     }) 
}

C.JSON是Gin实现的返回json数据的内置方法,包含了2个参数,状态码和返回的内容。http.StatusOK代表返回状态码为200,正文为{"message": "welcome"}

注:Gin还包含更多的返回方法如c.String, C.HTML, c.XML等,请自行了解。