我的Vue之旅 10 Gin重写后端、实现页面详情页 Mysql + Golang + Gin

第三期 · 使用 Vue 3.1 + Axios + Golang + Mysql + Gin 实现页面详情页
使用 Gin 框架重写后端Gin Web Framework (gin-gonic.com)整体代码量相比传统http写法少了30%,简洁、可读性高 。
C:.│go.mod│go.sum│init.go│main.go│├───controller│checkerror.go│comment.go│gameblog.go│gamelist.go│post.go│test.go│├───router│router.go│├───structs│comment.go│gameblog.go│gamelist.go│post.go│├───utils│mysql.go│└───variablevariable.go代码仓库vue_gin" rel="external nofollow noreferrer">alicepolice/vue_gin (github.com)
utils/mysql.go 不要重复执行 sql.Open、sql.Close前几期犯了一个错误, db, err := sql.Open(dbDriver, dbUser+":"+dbPass+"@/"+dbName) 获取到的db对象底层实现了一个连接池,实际上不需要重复去关闭和开启数据库,否则会非常耗时 。
官方文档里也写了

返回的数据库对于多个 goroutine 并发使用是安全的,并维护自己的空闲连接池 。因此,Open 函数应该只被调用一次 。很少需要关闭数据库 。
所以只需要调用一次,并存放至全局变量中 。
package utilsimport ( "database/sql" "time" _ "github.com/go-sql-driver/mysql" "wolflong.com/vue_gin/variable")func MySqlDB() { dbDriver := "mysql" dbUser := "root" dbPass := "sql2008" dbName := "vue" db, err := sql.Open(dbDriver, dbUser+":"+dbPass+"@/"+dbName) if err != nil {panic(err) } db.SetConnMaxLifetime(time.Minute * 3) db.SetMaxOpenConns(256) db.SetMaxIdleConns(256) variable.DB = db}package variableimport ( "database/sql")var DB *sql.DBMySQL 建表drop table if exists users;drop table if exists comments;create table users(uid int primary key auto_increment,name varchar(255));create table comments(id int primary key auto_increment,uid int,text mediumtext,pid int,date long);insert into users(uid,name) values(1001,"西瓜炒芹菜"),(1002,"玉米炖萝卜"),(1003,"西红柿炒番茄");INSERT INTO comments(id, uid, text, pid, date) VALUES (1, 1003, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107328334);INSERT INTO comments(id, uid, text, pid, date) VALUES (2, 1003, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107328836);INSERT INTO comments(id, uid, text, pid, date)VALUES (3, 1003, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107329459);INSERT INTO comments(id, uid, text, pid, date)VALUES (4, 1001, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107331864);INSERT INTO comments(id, uid, text, pid, date)VALUES (5, 1001, 'asdmoapsdasopdnopasdopasopdas localstorage', 100, 1666107332720);INSERT INTO comments(id, uid, text, pid, date)VALUES (6, 1002, '你好', 100, 1666107337646);select * from users;select * from comments;select * from game;drop table if exists posts;create table posts(id int primary key auto_increment,bgcolor varchar(7),textcolor varchar(7),headimg varchar(255),videosrc varchar(255),imgs mediumtext,html mediumtext);insert into posts(id,bgcolor,textcolor,headimg,videosrc,imgs,html) values(100,"#E8E1BC","#2f5b71","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109232741_head.png","https://www.youtube.com/embed/zGGTLStyKX0",'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233251_1.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233256_4.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233253_2.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233255_3.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221109233258_5.png"]','<div class="m-4 text-xl font-bold">A sound reverberated from beyond the ocean.</div><div class="ml-4 mt-6">At the edge of a desolate island, pick up what the waves wash ashore tomake instruments. Use those instruments to answer the echoes heard frombeyond the ocean. In this hand-drawn world, enjoy a soothing soundscapeformed by waves, footsteps and the sounds made from things washed up.</div><imgsrc="http://shimg.jingyanzongjie.com/230728/0435131F5-0.gif"class="w-full mt-6 px-4"/><div class="ml-4 mt-6">Resonance of the Ocean is a short adventure game you can play in 10 ~30min. This game was made in the 22nd unity1week, a Japanese game jamevent. This version is updated with an English localization and with smallchanges. In unity1week, this game placed 4th in the overall ranking, and1st for art and sound.</div><div class="m-4 mt-6 text-xl font-bold">Controls</div><div class="ml-4 mt-6">This game only supports keyboard controls.<ul class="list-disc ml-6 mt-2"><li>Arrow Keys: Move</li><li>Space Key(Or ZXC): Confirm</li><li>ZXC Keys: pick up, replace, throw, search</li></ul></div><div class="m-4 mt-6 text-xl font-bold">Save Function</div><div class="ml-4 mt-6">There is no save function available as the time required to complete thegame is short (10 ~ 30 min). Thank you for your understanding.</div>'),(101,"#FFFFFF","#000000","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004301_head2.png","https://www.youtube.com/embed/vddlEmrbNRw",'["https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_7.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_8.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_9.png","https://xiaonenglife.oss-cn-hangzhou.aliyuncs.com/static/pic/2022/11/20221110004259_10.png"]','<div class="ml-4 mt-6">The past and future cannot be explored alone! Team up with a friend andpiece together the mysteries surrounding Albert Vanderboom. Communicatewhat you see around you to help one another solve various puzzles andexplore the worlds from different perspectives!</div><div class="ml-4 mt-6">The Past Within is the first <a class="underline">co-op</a> onlypoint-and-click adventure set in the mysterious world of Rusty Lake.</div><div class="m-4 mt-6 text-xl font-bold">Features</div><div class="ml-4 mt-6"><ul class="list-disc ml-6 mt-2"><li class="font-bold">A co-op experience</li>Play together with a friend, one in The Past, the other in The Future.Work together to solve the puzzles and help Rose set her father’s planin motion!<li class="font-bold">Two worlds - Two perspectives</li>Both players will experience their environments in two differentdimensions: 2D as well as in 3D - a first-time experience in the RustyLake universe!<li class="font-bold">Cross-platform play</li>As long as you can communicate with each other, you and your partner ofchoice can each play The Past Within on your preferred platform: PC,Mac, iOS, Android and (very soon) Nintendo Switch!<li class="font-bold">Playtime & Replayability</li>The game contains 2 chapters and has an average play-time of 2 hours.For the full experience, we recommend replaying the game from the otherperspective. Plus you can use our replayability feature for a freshstart with new solutions to all puzzles.</ul></div>');select * from posts;

经验总结扩展阅读