欢迎来到尧图网

客户服务 关于我们

您的位置：首页 > 财经 > 产业 > goframe开发一个企业网站 前端界面 拆分界面7

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

2025/5/3 14:52:03 来源：https://blog.csdn.net/hzether/article/details/143463408  浏览:  次   关键词：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 缓存时间

这样的设计可以：

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

版权声明:

本网仅为发布的内容提供存储空间，不对发表、转载的内容提供任何形式的保证。凡本网注明“来源：XXX网络”的作品，均转载自其它媒体，著作权归作者所有，商业转载请联系作者获得授权，非商业转载请注明出处。

我们尊重并感谢每一位作者，均已注明文章来源和作者。如因作品内容、版权或其它问题，请及时与我们联系，联系邮箱：809451989@qq.com，投稿邮箱：809451989@qq.com

相关资讯

热文排行

最新新闻

推荐新闻

热搜词