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

news2024/11/24 13:06:27

将页面拆出几个公用部分

在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 config

import (
    "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中没有数据,从数据库获取并存入Redis
    if 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.Map
    err := g.DB().Model("web_config").Scan(&configs)
    if err != nil {
        return nil, err
    }
    
    // 存入Redis
    if 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 middleware

import (
    "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 cmd

import (
    "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 front

import (
    "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.coloradmin.cn/o/2234660.html

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

相关文章

SpringBoot3集成Junit5

目录 1. 确保项目中包含相关依赖2. 配置JUnit 53. 编写测试类4、Junit5 新增特性4.1 注解4.2 断言4.3 嵌套测试4.4 总结 在Spring Boot 3中集成JUnit 5的步骤相对简单。以下是你可以按照的步骤&#xff1a; 1. 确保项目中包含相关依赖 首先&#xff0c;确保你的pom.xml文件中…

[数据结构从小白到大牛]第五篇:3分钟带你吃透双链表并用C语言模拟实现

目录 1->前言 2->链表的概念和结构 2.1链表概念 2.2->带头双向循环链表结构 3->模拟实现带头双向循环链表 3.1定义链表结点 struct ListNode 3.2创建链表结点 CreateLTNode 函数 3.3链表初始化函数 ListInit函数 3.4链表打印函数 ListPrint函数 3.5链表…

前端通过nginx部署一个本地服务的方法

前端通过nginx部署一个本地服务的方法&#xff1a; 1.下载ngnix nginx 下载完成后解压缩后运行nginx.exe文件 2.打包你的前端项目文件 yarn build 把生成的dist文件复制出来&#xff0c;替换到nginx的html文件下 3.配置conf目录的nginx.conf文件 主要配置server监听 ser…

不同的浮点数类型

不同的浮点数类型 尽管4字节的浮点数可表达相当大的数值&#xff0c;但对于人类而言&#xff0c;总不够用。一般而言&#xff0c;浮点数有3种类型&#xff0c;单精度的float和双精度的double以及更长的long double, 可参考&#xff1a;数据类型大小 不同语言的浮点数类型 C/Obj…

蓝桥杯第21场小白入门赛补题

5.蓝桥派对 思路 &#xff1a;一个区间与多少个其他区间有关联&#xff0c;先对所有区间左端点和右端点从小到大排序&#xff0c;对于每个询问&#xff0c;我们先算出[1,r]这个区间里有多少个区间的起点即区间总数&#xff0c;使用upper_bound函数&#xff0c;然后使用lower_bo…

推荐一款功能强大的数据库开发管理工具:SQLite Expert Pro

SQLite Expert Professional是一个功能强大的工具&#xff0c;旨在简化SQLite3数据库的开发。 它是SQLite的一个功能丰富的管理和开发工具&#xff0c;旨在满足所有用户从编写简单SQL查询到开发复杂数据库的需求。 图形界面支持所有SQLite功能。 它包括一个可视化查询构建器&a…

sql专题 之 常用命令

文章目录 查询基础语法查询全表查询选择查询&#xff1a;常量和运算&#xff1a; 条件查询where运算符&#xff1a;、 !、<、>空值&#xff1a;null模糊查询&#xff1a;like逻辑运算&#xff1a;and or not 去重&#xff1a;distinct排序&#xff1a;order by截断和偏移…

Unity的gRPC使用之实现客户端

应用背景&#xff1a;本想Unity调用C的dll库获取一些数据资源&#xff0c;但是由于自己调用的C库模块化处理的不太理想&#xff0c;众多dll之间相互依赖&#xff0c;使得在调用dll的时候&#xff0c;会忽略一些dll的缺失&#xff0c;使Unity项目报错&#xff0c;故想到了使用gR…

Linux基础-常用操作命令详讲

Linux基础-常用操作命令详讲 一、openssl加密简单介绍 1. 生成加密的密码散列&#xff08;password hash&#xff09;​编辑 1.1 常见的选项总结表 1.2 加密参数详解 2. 自签名证书 3. 证书转换 二、文件管理 1. 创建空文件 ​编辑 2. 删除文件 4. 新建目录 ​编辑…

[大模型]视频生成-Sora简析

参考资料&#xff1a; Sora技术报告https://openai.com/index/video-generation-models-as-world-simulators/4分钟详细揭密&#xff01;Sora视频生成模型原理https://www.bilibili.com/video/BV1AW421K7Ut 一、概述 相较于Gen-2、Stable Diffusion、Pika等生成模型的前辈&am…

STM32学习笔记-外部中断和外部时钟

文章目录 EXTI基本结构AFIO 定时器1. STM32 定时器的种类2. 定时器的主要功能3. 定时器的配置4. 定时器 PWM 输出模式5. 定时器中断配置输出比较1. 输出比较模式概述2. 输出比较模式的配置今天实在有点疲惫了&#xff0c;明天继续学吧。 EXTI基本结构 AFIO 中断引脚选择&#…

【测试小白--如何写好测试用例--测试用例编写的方法+结合常见登录模块为实例--保姆级教学】

测试用例编写方法&登录模块实例 一、测试用例编写方法1. 等价类划分2. 边界值分析3. 状态转换测试4. 决策表测试5. 错误推测6. 用户场景测试7. 安全测试用例 二、登录模块测试用例实例1. 等价类划分2. 边界值分析3. 状态转换测试4. 决策表测试5. 错误推测6. 用户场景测试7.…

Python数据可视化seaborn

产品经理在做数据分析时可能需要通过可视化来分析。seaborn官网 1. relplot 散点图 https://seaborn.pydata.org/examples/scatterplot_sizes.html import pandas as pd import seaborn as sns df pd.DataFrame({x: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10],y: [8, 6, 7, 8, 4, 6,…

Ubuntu Linux

背景 Ubuntu起源于南非&#xff0c;其名称“Ubuntu”来源于非洲南部祖鲁语或豪萨语&#xff0c;意为“人性”、“我的存在是因为大家的存在”&#xff0c;这体现了非洲传统的一种价值观。Ubuntu由南非计算机科学家马克沙特尔沃斯&#xff08;Mark Shuttleworth&#xff09;创办…

yolov8涨点系列之轻量化主干网络替换

文章目录 YOLOv8 替换成efficientvit轻量级主干网络的好处计算效率提升模型部署更便捷方便模型移植 模型可扩展性增强便于集成其他模块支持模型压缩技术 主干网络替换1.创建yolov8_efficeintVit.py2.修改task.py(1)引入创建的efficientViT文件(2)修改_predict_once函数(3)修改p…

碧桂园服务启动“乘梯无忧”专项行动 携手业主共筑电梯安全新未来

摘要&#xff1a;全国400城8000项目全面覆盖 电梯是当代社会不可或缺的垂直交通工具&#xff0c;电梯安全问题不仅关系到居民的日常生活&#xff0c;更关乎到他们的生命财产安全。随着生活节奏的加快&#xff0c;居民对电梯的运行效率也有了更高的要求和期待。 碧桂园服务在2…

应对AI与机器学习的安全与授权管理新挑战,CodeMeter不断创新引领保护方案

人工智能&#xff08;AI&#xff09;和机器学习&#xff08;ML&#xff09;技术正在快速发展&#xff0c;逐渐应用到全球各类主流系统、设备及关键应用场景中&#xff0c;尤其是在政府、商业和工业组织不断加深互联的情况下&#xff0c;AI和ML技术的影响日益广泛。虽然AI技术的…

【AI换装整合包及教程】OOTDiffusion: AI换装工具的革命性创新

引言 在当今这个数字化时代&#xff0c;人工智能&#xff08;AI&#xff09;技术的发展日新月异&#xff0c;从最初的语音识别、图像识别到现在的自然语言处理&#xff0c;AI的应用范围不断扩大&#xff0c;深刻地改变了我们的生活方式和工作模式。特别是在时尚界&#xff0c;…

全面解析:网络协议及其应用

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 # 全面解析&#xff1a;网络协议及其应用 文章目录 网络协议概述定义发展历程主要优势 主要网络协议应用层协议传输层协议网络层…

零基础‘自外网到内网’渗透过程详细记录(cc123靶场)——下

细节较多&#xff0c;篇幅较大&#xff0c;分为上/下两部分发布在两篇文章内 另一部分详见下面文章 零基础‘自外网到内网’渗透过程详细记录(cc123靶场)——上https://blog.csdn.net/weixin_62808713/article/details/143572185 八、第二层数据库服务器权限获取 猜到新闻资…