goframe开发一个企业网站 前端界面 拆分界面7

将页面拆出几个公用部分

在resource/template/front创建meta.html header.html footer.html

meta.html

<head><meta charset="utf-8"><meta content="width=device-width, initial-scale=1.0" name="viewport"><title>{{.configs}}   {{.configs.title}}|{{.configs.webname}}</title><meta name="keywords" content="{{.configs.keywords}}"><meta name="description" content="{{.configs.description}}"><!-- Favicons --><!-- Google Fonts --><link href="/resource/front/static/css/css2_swap.css" rel="stylesheet"><link rel="preconnect" href="https://fonts.googleapis.com/"><link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin=""><link href="/resource/front/static/css/css2-Comfortaawght700_swap.css" rel="stylesheet"><link href="/resource/front/static/css/css2-Poppinswght300400_swap.css" rel="stylesheet"><link href="/resource/front/static/css/css2-Poppinswght100200300400_swap.css" rel="stylesheet"><link href="/resource/front/static/css/css2-Robotoitalwght0100030004000500070009001900_swap.css" rel="stylesheet"><link href="/resource/front/static/css/css2-Playball_swap.css" rel="stylesheet"><!-- Vendor CSS Files --><link href="/resource/front/static/css/font-awesome.min.css" rel="stylesheet"><link href="/resource/front/static/css/bootstrap.min.css" rel="stylesheet"><link href="/resource/front/static/css/bootstrap-icons.css" rel="stylesheet"><link href="/resource/front/static/css/aos.css" rel="stylesheet"><link href="/resource/front/static/css/glightbox.min.css" rel="stylesheet"><link href="/resource/front/static/css/swiper-bundle.min.css" rel="stylesheet"><!-- Main CSS File --><link href="/resource/front/static/css/styles.css" rel="stylesheet">
</head>

header.html

<div id="preloader"></div>
<header id="header" class="single-page-header header d-flex align-items-center"><div class="container container-xl d-flex align-items-center justify-content-between"><a href="" class="logo d-flex align-items-center"><h1><span></span><span>{{.configs.webname}}</span></h1></a><nav id="navbar" class="navbar"><ul><li><a href="/">首页</a></li><li><a href="/service">服务</a></li><li class="dropdown"><a href="#"><span>项目</span><i class="bi bi-chevron-down dropdown-indicator"></i></a><ul><li><a href="/projects">Projects</a></li><li><a href="/project-details">Project Details</a></li></ul></li><li><a href="/about">关于</a></li><li><a href="/price">价格</a></li><li><a href="/testimonials">客户评价</a></li><li class="dropdown"><a href="#"><span>用户</span> <i class="bi bi-chevron-down dropdown-indicator"></i></a><ul><li><a href="/login">登陆</a></li><li><a href="/register">注册</a></li><li><a href="/faq">常见问题</a></li><li><a href="/team">团队</a></li><li><a href="/coming-soon">Coming Soon</a></li><li><a href="/terms">服务条款</a></li><li><a href="/policy">隐私条款</a></li><li><a href="/sample">Sample Page</a></li></ul></li><li><a href="/blogs">新闻</a></li><li><a href="/contact" class="main-button">联系我们</a></li></ul></nav><!-- navbar--><i class="mobile-nav-toggle mobile-nav-show bi bi-list"></i><i class="mobile-nav-toggle mobile-nav-hide d-none bi bi-x"></i></div>
</header><!-- End Header -->

footer.html


<!-- Footer -->
<footer id="footer" class="main-footer"><div class="container"><div class="footer-content"><div class="row"><div class="col-lg-4 col-md-6 col-sm-12 footer-column"><div class="logo-widget footer-widget"><a href="" class="logo d-flex align-items-center"><h1><span>{{.configs.webname}}</span></h1></a><div class="text"><p>Lorem ipsum dolor amet consectetur adi pisicing elit sed eiusm tempor incididunt ut labore dolore magna aliqua enim ad minim veniam quis.nostrud exercita.laboris nisi ut aliquip ea commodo conse quatuis aute irure.</p></div><ul class="footer-social"><li><a href="#"><i class="fa fa-facebook"></i></a></li><li><a href="#"><i class="fa fa-twitter"></i></a></li><li><a href="#"><i class="fa fa-google"></i></a></li></ul></div></div><div class="col-lg-3 col-md-6 col-sm-12 offset-lg-2 footer-column"><div class="service-widget footer-widget"><div class="footer-title">Services</div><ul class="list"><li><a href="#">Web Design</a></li><li><a href="#">App Developemnt</a></li><li><a href="#">Cloud Services</a></li><li><a href="#">Domain adn Hosting</a></li><li><a href="#">Seo Optimization</a></li><li><a href="#">Social Media</a></li></ul></div></div><div class="col-lg-3 col-md-6 col-sm-12 footer-column"><div class="contact-widget footer-widget"><div class="footer-title">Contacts</div><div class="text"><p>{{.configs.province}}</p><p>{{.configs.address}}</p><p>{{.configs.phone}}</p><p>{{.configs.email}}</p></div></div></div></div></div></div>
</footer>
<!-- main-footer end -->
<div class="footer-bottom"><div class="container"><div class="row"><div class="col-lg-6 col-md-6 col-sm-12 column"><div class="copyright">Copyright &copy; 2024.{{.configs.companyname}} All rights reserved.</div></div><div class="col-lg-6 col-md-6 col-sm-12 column"><ul class="footer-nav"><li><a href="#">Terms of Service</a></li><li><a href="#">Privacy Policy</a></li></ul></div></div></div>
</div>
<!-- End Footer -->

这样修改不用每页都去改写相关的部分。公用部分减少了代码编写的繁杂。
在这里插入图片描述

将前端公用的数据写入到redis

好的,我来帮您组织这个完整的配置中间件实现。

  1. 首先创建 internal/logic/config/config.go:
package configimport ("context""github.com/gogf/gf/v2/frame/g"
)type sConfig struct{}var Service = new(sConfig)// GetConfigs 获取所有配置
func (s *sConfig) GetConfigs(ctx context.Context) (g.Map, error) {// 从Redis获取配置configs, err := g.Redis().Do(ctx, "HGETALL", "web_config")if err != nil {return nil, err}// 如果Redis中没有数据,从数据库获取并存入Redisif configs.IsEmpty() {return s.syncConfigsToRedis(ctx)}return configs.Map(), nil
}// syncConfigsToRedis 同步配置到Redis
func (s *sConfig) syncConfigsToRedis(ctx context.Context) (g.Map, error) {// 从数据库获取配置var configs g.Maperr := g.DB().Model("web_config").Scan(&configs)if err != nil {return nil, err}// 存入Redisif len(configs) > 0 {_, err = g.Redis().Do(ctx, "HMSET", "web_config", configs)if err != nil {return nil, err}// 设置过期时间(例如24小时)_, err = g.Redis().Do(ctx, "EXPIRE", "web_config", 24*3600)if err != nil {return nil, err}}return configs, nil
}
  1. 创建 internal/middleware/config.go:
package middlewareimport ("web/internal/logic/config""github.com/gogf/gf/v2/frame/g""github.com/gogf/gf/v2/net/ghttp"
)func Config(r *ghttp.Request) {ctx := r.GetCtx()configs, err := config.Service.GetConfigs(ctx)if err != nil {r.Response.WriteJson(g.Map{"code": -1,"message": err.Error(),})return}// 将配置存储到请求中,供后续使用r.SetCtxVar("configs", configs)r.Middleware.Next()
}
  1. cmd/cmd.go 中注册中间件:
package cmdimport ("web/internal/middleware""github.com/gogf/gf/v2/frame/g""github.com/gogf/gf/v2/net/ghttp"
)func initRouter() {s := g.Server()// 注册全局中间件s.Use(middleware.Config)// ... 其他路由配置 ...
}
  1. 在控制器中使用配置:
package frontimport ("github.com/gogf/gf/v2/frame/g""github.com/gogf/gf/v2/container/gvar"
)type Controller struct{}func (c *Controller) getConfigs(ctx g.Ctx) g.Map {configs := g.RequestFromCtx(ctx).GetCtxVar("configs")return configs.Map()
}

功能说明:

  1. 配置服务层 (logic/config)

    • 提供配置获取的核心逻辑
    • 实现 Redis 缓存机制
    • 当 Redis 无数据时自动从数据库同步
    • 支持配置的自动更新
  2. 中间件 (middleware/config)

    • 在每个请求开始时加载配置
    • 将配置信息注入到请求上下文
    • 处理错误情况并返回适当的响应
  3. 路由注册 (cmd/cmd.go)

    • 全局注册配置中间件
    • 确保所有请求都能访问配置信息

使用方式:

  1. 在模板中使用:
<title>{{.configs.title}}</title>
<meta name="keywords" content="{{.configs.keywords}}">
  1. 在控制器中使用:
configs := g.RequestFromCtx(ctx).GetCtxVar("configs").Map()
title := configs["title"]

注意事项:

  1. 确保 Redis 配置正确
  2. 数据库中需要有对应的 web_config 表
  3. 建议添加配置更新接口,更新后清除 Redis 缓存
  4. 可以根据需要调整 Redis 缓存时间

这样的设计可以:

  • 减少数据库访问压力
  • 提高配置访问速度
  • 保持配置的一致性
  • 方便在整个应用中使用配置

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/884645.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

读书笔记#深入理解Java虚拟机(第三版)# Java内存模型与线程

深入理解Java虚拟机&#xff08;第三版&#xff09;# 高效并发 chap12 Java内存模型与线程 概述 在许多场景下&#xff0c;让计算机同时去做几件事情&#xff0c;不仅是因为计算机的运算能力强大了&#xff0c;还有一个很重要的原因是计算机的运算速度与它的存储和通信子系统的…

鸿蒙笔记--自定义点击事件

这一节主要了解一下鸿蒙中自定义点击事件&#xff0c;主要是实现在父组件点击子组件后获取子组件的返回参数。 栗子&#xff1a; import { MyCustomButton } from ./MyCustomButton;Entry Component struct Index {State message: string Hello World;build() {Column(){MyC…

第三十一章 Vue之路由(VueRouter)

目录 一、引言 1.1. 路由介绍 二、VueRouter 三、VueRouter的使用 3.1. 使用步骤&#xff08;52&#xff09; 3.2. 完整代码 3.2.1. main.js 3.2.2. App.vue 3.2.3. Friend.vue 3.2.4. My.vue 3.2.5. Find.vue 一、引言 1.1. 路由介绍 Vue中路由就是路径和组件的映…

软件测试学习笔记丨SeleniumPO模式

本文转自测试人社区&#xff0c;原文链接&#xff1a;https://ceshiren.com/t/topic/22525 本文为霍格沃兹测试开发学社的学习经历分享&#xff0c;写出来分享给大家&#xff0c;希望有志同道合的小伙伴可以一起交流技术&#xff0c;一起进步~ 说明&#xff1a;本篇博客基于sel…

【学习enable_if模板, 学习unqiue_str 删除操作】

enable_if 是 C 标准库中的一个模板结构体&#xff0c;它用于条件编译和 SFINAE&#xff08;Substitution Failure Is Not An Error&#xff09;。enable_if 的主要作用是通过条件编译来控制模板的实例化&#xff0c;从而实现条件编译和 SFINAE。 1. enable_if 的基本用法如下…

【自然资源】关于多测合一,你了解吗?

关于多测合一&#xff0c;你了解吗&#xff1f; “多测合一” 是指&#xff1a;按照“统一标准、多测合并、成果共享”要求和“应合尽合、能合则合”原则&#xff0c;对同一工程建设项目各个阶段的多项测绘服务事项进行整合优化的测绘服务和管理模式。 是将工程建设项目竣工验…

江协科技STM32学习- P28 USART串口数据包

&#x1f680;write in front&#x1f680; &#x1f50e;大家好&#xff0c;我是黄桃罐头&#xff0c;希望你看完之后&#xff0c;能对你有所帮助&#xff0c;不足请指正&#xff01;共同学习交流 &#x1f381;欢迎各位→点赞&#x1f44d; 收藏⭐️ 留言&#x1f4dd;​…

HarmonyOS鸿蒙开发入门,常用ArkUI组件学习(二)

书接上回&#xff0c;让我们继续来学习ArkUI的其他组件 目录&#xff0c;可以点击跳转到想要了解的组件详细内容 组件四&#xff1a;Button组件五&#xff1a;Slider组件六&#xff1a; Column & Row组件七&#xff1a;循环控制组件八&#xff1a; List 组件四&#xff1a;…

SqlSugar查询达梦数据库遇到的异常情况

使用SqlSugar连接达梦数据库&#xff0c;联查两张表的数据遇到的奇怪问题&#xff1a;同一套代码&#xff0c;在一个环境中可以正常查询并返回数据&#xff0c;但在另一环境中运行则查不到数据。在个人电脑上测试时也能正确运行&#xff0c;搞不清楚是怎么回事&#xff0c;特此…

ip地址分为几大类-IP和子网掩码对照表

一、IP地址的基本概念与分类 IP地址是用于在网络中标识每个设备的逻辑地址。互联网协议将IP地址分为A、B、C、D和E五类&#xff0c;其中A、B、C三类最常用&#xff0c;它们主要根据地址的首位位数以及用途进行划分。 A类地址&#xff1a; 范围&#xff1a;0.0.0.0 - 127.255.2…

【AI开源项目】Botpress - 开源智能聊天机器人平台及其部署方案

文章目录 Botpress 概述Botpress 的定位 Botpress 的主要特点1. OpenAI 集成2. 易于使用3. 定制和扩展性4. 多平台支持5. 集成和扩展 API6. 活跃的社区和详尽的文档 部署方案集成集成开发集成部署机器人示例开发工具代理本地开发先决条件从源代码构建 Botpress 如何解决常见问题…

JetPack Compose安卓开发之底部导航Tabbar

效果&#xff0c;页面切换 项目结构 TabBar.kt package com.weimin.strollerapp.components.tabbarimport androidx.compose.foundation.Image import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Column import androidx.compose.f…

SpringBoot应用:精品在线试题库的设计与实现

2 相关技术 2.1 Spring Boot框架简介 Spring Boot是由Pivotal团队提供的全新框架&#xff0c;其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置&#xff0c;从而使开发人员不再需要定义样板化的配置。通过这种方式&#xff0c;Sprin…

乐鑫esp32和esp32s3使用flash download tool V3.9.7工具下载固件的使用说明

使用esp32IDF工具编程后使用vscode内置的烧录工具&#xff08;火的图标按钮&#xff09;烧录是正常的&#xff0c;说明程序没有问题。 如果要使用flash download tool V3.9.7工具下载固件还是有些要注意的事项&#xff1a; 1.三个bin文件分别在&#xff1a; 第一个&#xff1a;…

如何在Linux系统中使用Apache HTTP Server

如何在Linux系统中使用Apache HTTP Server Apache简介 安装Apache 在Debian/Ubuntu系统中安装 在CentOS/RHEL系统中安装 启动Apache服务 验证Apache是否正在运行 访问Apache默认页面 配置Apache虚拟主机 创建虚拟主机配置文件 示例虚拟主机配置 创建网站根目录 准备静态网站内…

HTTP相关返回值异常原因分析,第二部分

今天我们讲讲HTTP相关返回值异常如何解决&#xff08;实例持续更新中&#xff09; 一、4xx状态码 这些状态码表示请求有问题&#xff0c;通常是由于客户端的错误引起的。 1.1 400 Bad Request: 请求格式不正确&#xff0c;服务器无法理解。 状态码400的含义&#xff1a; …

8、Node.js Express框架

五、Express框架 5.1概念 Express框架是一个基于Node.js平台的极简、灵活的WEB开发框架:www.express.com.cn 简单来说,Express是一个封装好的工具包,封装了很多功能,便于我们开发WEB应用 5.2安装 npm i express5.3 Express初体验 //01-express初体验.js //1.导入exrp…

学习笔记——三小时玩转JQuery

也可以使用在线版&#xff0c;不过在线版需要有网络&#xff0c;网不好的情况下加载也不好 取值的时候也是只会取到有样式的纯文本&#xff0c;不会取到标签&#xff0c;会取到标签效果 prepend和append这两个方法用的比较多&#xff0c;before和affter用的比较少 想要把代码写…

Rust 力扣 - 54. 螺旋矩阵

文章目录 题目描述题解思路题解代码题目链接 题目描述 题解思路 我们只需要一圈一圈的从外向内遍历矩阵&#xff0c;每一圈遍历顺序为上边、右边、下边、左边 我们需要注意的是如果上边与下边重合或者是右边与左边重合&#xff0c;我们只需要遍历上边、右边即可 题解代码 i…

企业项目开发的流程

一.立项阶段 1.市场调研 了解市场需求和竞争对手情况。全面的市场调研分析报告。 用户调研&#xff1a;产品组针对目标用户进行定量和定性的调查&#xff0c;了解其需求和行为习惯&#xff0c;为产品的功能和设计方向提供依据。 举例&#xff1a;终端管家.用户分为商户和渠…