Предисловие

Когда я впервые начал изучать серверную разработку, я впервые изучил MVC (Model-View-Controller). Представление — это интерфейсная страница. В то время оно было интегрировано в серверную часть как статический ресурс. Данные страницы отображались в контроллере, а затем возвращались в браузер.

Позже я начал узнавать о разделении фронтенда и бэкенда. Фронтенд-страница полностью независима от бекенда. Бэкэнд отвечает за обработку запросов внешнего интерфейса, получение соответствующих данных из базы данных и возврат их во внешний интерфейс, а внешний интерфейс отображает данные на странице.

первые две недели,использоватьspringbootиvue3написалСистема отображения рейтинга анимации Tencent,Сегодня давайте посмотрим на сотрудничество между go и vue3.,Как добиться разделения фронтенда и бэкенда.

перейти на серверную часть

Как и Springboot в Java, Django в Python,这里我использоватьиз是goизginфреймворк для создания бэкэнда,Давайте сначала создадим модуль фоновых функций.

Иерархия проектов

Создайте новый проект goweb и создайте два каталога: app и web — это каталог кода фонового приложения, а web — каталог внешнего кода Vue. Здесь мы сначала создаем каталог модулей внутренних функций.

1. контроллер: внутренний контроллер, отвечающий за обработку запросов и бизнес-логику.
2. модель: хранит внутреннюю модель и отвечает за определение структур данных и операций с базой данных.
3. база данных: используется для инициализации соединений с базой данных и определения функций работы с базой данных.
4. Маршрутизатор: используйте методы, предоставляемые платформой Gin, для определения маршрутов и распределяйте различные запросы к соответствующим функциям обработки по разным маршрутам. В соответствующей функции обработки маршрутизации вызовите функцию обработки бизнес-логики или управляйте базой данных и т. д.
5. config: используется для определения таких конфигураций, как информация о соединении с базой данных.

Разделение внешнего и внутреннего интерфейса заменяет представление в архитектуре MVC, поэтому здесь нет модуля представления. В дополнение к указанным выше пяти каталогам вы также можете определить каталоги utils, common и другие.

Установите необходимые модули:

go get -u github.com/gin-gonic/gin 
go get -u gorm.io/gorm
go get -u gorm.io/driver/mysql
go get github.com/spf13/viper

Viper используется для анализа файлов конфигурации в различных форматах. GORM — это популярная библиотека ORM (реляционного сопоставления объектов) на языке Go. Проще говоря, она сопоставляет структуру таблиц в базе данных с классами (структурами) в коде. удобен для оперативного использования.

источник данных

Создайте источник данных MySQL, используя gorm:

package database

import (
	"GoWeb/app/model"
	_ "database/sql"
	"fmt"
	"github.com/spf13/viper"
	"gorm.io/driver/mysql"
	"gorm.io/gorm"
	"path"
	"runtime"
	"time"
)

var DB *gorm.DB

func InitDB() {
	// Установите имя файла конфигурации и формат файла конфигурации для чтения.
	_, filename, _, _ := runtime.Caller(0)  // Получить текущий путь к файлу (config.go)
	confPath := path.Dir(filename)  // Получить текущий каталог файлов
	viper.AddConfigPath(confPath)
	viper.SetConfigFile("application")
	viper.SetConfigType("yaml")

	host := viper.GetString("database.mysql.host")
	username := viper.GetString("database.mysql.username")
	password := viper.GetString("database.mysql.password")
	port := viper.GetString("database.mysql.port")
	dbname := viper.GetString("database.mysql.dbname")

	dsn := fmt.Sprintf("%s:%s@tcp(%s:%s)/%s?charset=utf8&parseTime=True&loc=Local", username, password, host, port, dbname)
	db, err := gorm.Open(mysql.Open(dsn), &gorm.Config{})

	if err != nil {
		fmt.Println("Error pinging database:", err)
		return
	}
	sqlDB, err := db.DB()
	sqlDB.SetMaxOpenConns(100)
	sqlDB.SetMaxIdleConns(10)
	sqlDB.SetConnMaxLifetime(time.Minute * 10)

	DB = db
}

func CloseDB() {
	db, err := DB.DB()
	if err != nil {
		fmt.Println("Error close database:", err)
	}
	db.Close()
}

И создайте метод для запроса таблицы мультфильмов:

func GetCartoon(offset, pageSize int) ([]model.Cartoon, error) {
	var cartoon []model.Cartoon
	result := DB.Table("cartoon").Select("cid", "name").Order("score").Offset(offset).Limit(pageSize).Find(&cartoon)
	if result.Error != nil {
		return nil, result.Error
	}
	fmt.Println(cartoon)
	return cartoon, nil
}

controller

когда придет запрос,сначала надо пройтиrouteЧтобы определить, на какой запрос следует разослать этот запросcontrollerПроцесс,Поэтому вам необходимо сначала настроить политику маршрутизации.,Определено в маршруте:

Здесь запрос /cartoon/listCartoon передается на обработку контроллеру GetCartoon:

Контроллер получает интерфейс через gin, включая параметры в формате form, url, json и других форматах, вызывает параметры, инкапсулированные в базе данных, для получения данных, а затем инкапсулирует их в json через gin и возвращает.

Запустить службу

Создайтеmain.go,Запустить службу。

func main() {
 router := gin.Default()
	// Привязка правил маршрутизации
	route.SetupRoutes(router)
	// Запустить приложение
	router.Run(":8082")
}

Таким образом, данные можно запрашивать через порт 8082.

интерфейс vue

Для внешнего интерфейса я использую проект, созданный с помощью vue-cli, который автоматически генерирует структуру внешнего интерфейса vue. Мы входим в проект go и выполняем команду create, чтобы создать веб-каталог:

vue create web

Инициализируйте внешний каталог согласно запросу.

Результат следующий:

Каталог в src используется для разработки, ресурсы используются для хранения статических файлов, компоненты — это некоторые пользовательские компоненты, такие как компонент Icon, который я написал в BuildAdmin, маршрутизатор используется для определения vue-router, а представления используются для хранения html. страница.

кроме,Существует также каталог API,Используется для инкапсуляции запросов, таких как данные фонового запроса.,Каталог utils инкапсулирует некоторые общедоступные классы.,storesКаталоги используются для определенияpiniaилиvuexиз静态变量。Для этой части реализации вы можете обратиться кСистема отображения рейтинга анимации Tencentиз前端开发部分。

Фронтенд и бэкенд демо

Соединение с базой данных прошло успешно, данные были запрошены. Однако при сопоставлении GORM со Struct возникла проблема. Я все еще занимаюсь устранением неполадок и уделяю время ее устранению.

При запросе на стойке регистрации все десять запрошенных фрагментов данных вернули пустые данные.

Заключение

Для новичка, использующего go для разработки серверной части, Go действительно немного сложен, сложность немного высока, а аспект ORM немного сбивает с толку.