当前位置:首页 > 文章列表 > Golang > Go问答 > 只有一个模板的 Gin Web 应用程序

只有一个模板的 Gin Web 应用程序

来源:stackoverflow 2024-02-10 12:28:31 0浏览 收藏

IT行业相对于一般传统行业,发展更新速度更快,一旦停止了学习,很快就会被行业所淘汰。所以我们需要踏踏实实的不断学习,精进自己的技术,尤其是初学者。今天golang学习网给大家整理了《只有一个模板的 Gin Web 应用程序》,聊聊,我们一起来看看吧!

问题内容

我有一个 Gin Web 应用程序,其中包含基于一组部分和一个基本模板的多个 HTML 模板。基本模板似乎与相关部分一起渲染得很好,但我的主要视图、登录、索引和注册没有按预期渲染。每当我访问其中任何一个的 HTTP 端点时,只会呈现寄存器视图。

以下文件中缺少或配置错误的内容导致我的路由无法呈现请求的页面?

我的项目具有以下结构。

├── app
...
│   ├── handlers
│   │   ├── general
│   │   │   └── general.go
│   │   └── routes.go
│   ├── main.go
│   ├── reloadDev.sh
│   ├── static
│   │   ├── css
│   │   ├── img
│   │   └── js
│   └── templates
│       ├── home
│       │   ├── index.tmpl.html
│       │   ├── login.tmpl.html
│       │   └── register.tmpl.html
│       ├── layouts
│       │   └── base.tmpl.html
│       └── partials
│           ├── footer.tmpl.html
│           ├── head.tmpl.html
│           └── navbar.tmpl.html

base.tmpl.html

{{ define "base" }}


    {{ template "head" . }}
    {{template "navbar" .}}
    
    {{ block "content" . }}{{ end }}
    
    {{template "footer" .}}

{{end}}

注册.tmpl.html

{{ template "base" . }}
{{ define "content" }}

    
        
            <h1>Register</h1>
            
<input type="text" name="username" id="username" class="form-control" placeholder="Username" required> <input type="password" name="password" id="password" class="form-control" placeholder="Password" required> ...SNIP...
{{ end }}

index.tmpl.html(登录的结构与这两个相同。)

{{ template "base" . }}
{{ define "title" }}Home{{ end }}
{{ define "content" }}

    
        
            <p>Welcome to Astra Porta.</p>
            <p>Click <a target='_blank'  href='https://www.17golang.com/gourl/?redirect=MDAwMDAwMDAwML57hpSHp6VpkrqbYLx2eayza4KafaOkbLS3zqSBrJvPsa5_0Ia6sWuR4Juaq6t9nq6ycaOSa52ox8yzon2rhM--e4aUh6elaZK6m2C8dnmss2uCmn2jpGy0t86kgaybz7Guf9CGurFrkeCbbQ' rel='nofollow'>here</a> to login.</p>
        
    

{{ end }}

HTML 模板使用 embed.FS 与二进制文件捆绑在一起。

//go:embed templates/partials/* templates/layouts/* templates/home/*
var files embed.FS

func main() {
    router := setupRouter()
    err := router.Run()
    if err != nil {
        panic(err)
    }
}

func setupRouter() *gin.Engine {
    router := gin.Default()
    subFS, e := fs.Sub(files, "templates")
    if e != nil {
        panic(e)
    }

tmpl := template.Must(template.ParseFS(
    subFS,
    "layouts/*.html",
    "partials/*.html",
    "home/*.html",
))
router.SetHTMLTemplate(tmpl)

router.StaticFS("/static", http.Dir("static"))

err := router.SetTrustedProxies(nil)
if err != nil {
    panic(err)
}
handlers.InitializeRoutes(&router.RouterGroup)
return router
}

页面在我的应用程序路由中呈现。此处的引用映射到 *.tmpl.html 文件的文件名。

func SiteIndex(c *gin.Context) {
    c.HTML(http.StatusOK, "index.tmpl.html", nil)
}

func GetRegister(c *gin.Context) {
    c.HTML(http.StatusOK, "register.tmpl.html", nil)
}

func GetLogin(c *gin.Context) {
    c.HTML(http.StatusOK, "login.tmpl.html", nil)
}

正确答案


对于其他遇到此问题的人。 mkopriva 评论中指出的解决方案是正确的。我删除了 base.tmpl.html 并使用更新的部分和目标页面组成每个视图。

标题

{{ define "header" }}
<!DOCTYPE html>
<html lang="eng" data-bs-theme="dark">
{{template "navbar" .}}
    <body>
    {{ block "content" . }}{{ end }}
        <head><meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
           ...SNIP...
            <title>App</title>
        </head>
{{end}}

页脚

{{define "footer"}}

        <div class="container">
            <footer class="py-3 my-4" data-bs-theme="dark">
                <ul class="nav justify-content-center border-bottom pb-3 mb-3">
                    <li class="nav-item"><a href="/" class="nav-link px-2 text-body-secondary">Home</a></li>
                </ul>
                <p class="text-center text-body-secondary">© 2024 .</p>
            </footer>
        </div>
    </body>
</html>
{{end}}

有问题的页面

{{template "header"}}
<div class="container">
    <div class="row">
        <div class="col-md-6 offset-md-3">
            <p>Welcome to Astra Porta.</p>
            <p>Click <a href="/login">here</a> to login.</p>
        </div>
    </div>
</div>
{{template "footer"}}

到这里,我们也就讲完了《只有一个模板的 Gin Web 应用程序》的内容了。个人认为,基础知识的学习和巩固,是为了更好的将其运用到项目中,欢迎关注golang学习网公众号,带你了解更多关于的知识点!

版本声明
本文转载于:stackoverflow 如有侵犯,请联系study_golang@163.com删除
无法访问的文件无法访问的文件
上一篇
无法访问的文件
GORM查询方法的字段遗漏问题
下一篇
GORM查询方法的字段遗漏问题
查看更多
最新文章
查看更多
课程推荐
  • 前端进阶之JavaScript设计模式
    前端进阶之JavaScript设计模式
    设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
    543次学习
  • GO语言核心编程课程
    GO语言核心编程课程
    本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
    514次学习
  • 简单聊聊mysql8与网络通信
    简单聊聊mysql8与网络通信
    如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
    499次学习
  • JavaScript正则表达式基础与实战
    JavaScript正则表达式基础与实战
    在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
    487次学习
  • 从零制作响应式网站—Grid布局
    从零制作响应式网站—Grid布局
    本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
    484次学习
查看更多
AI推荐
  • SEO  AI Mermaid 流程图:自然语言生成,文本驱动可视化创作
    AI Mermaid流程图
    SEO AI Mermaid 流程图工具:基于 Mermaid 语法,AI 辅助,自然语言生成流程图,提升可视化创作效率,适用于开发者、产品经理、教育工作者。
    686次使用
  • 搜获客笔记生成器:小红书医美爆款内容AI创作神器
    搜获客【笔记生成器】
    搜获客笔记生成器,国内首个聚焦小红书医美垂类的AI文案工具。1500万爆款文案库,行业专属算法,助您高效创作合规、引流的医美笔记,提升运营效率,引爆小红书流量!
    696次使用
  • iTerms:一站式法律AI工作台,智能合同审查起草与法律问答专家
    iTerms
    iTerms是一款专业的一站式法律AI工作台,提供AI合同审查、AI合同起草及AI法律问答服务。通过智能问答、深度思考与联网检索,助您高效检索法律法规与司法判例,告别传统模板,实现合同一键起草与在线编辑,大幅提升法律事务处理效率。
    719次使用
  • TokenPony:AI大模型API聚合平台,一站式接入,高效稳定高性价比
    TokenPony
    TokenPony是讯盟科技旗下的AI大模型聚合API平台。通过统一接口接入DeepSeek、Kimi、Qwen等主流模型,支持1024K超长上下文,实现零配置、免部署、极速响应与高性价比的AI应用开发,助力专业用户轻松构建智能服务。
    783次使用
  • 迅捷AIPPT:AI智能PPT生成器,高效制作专业演示文稿
    迅捷AIPPT
    迅捷AIPPT是一款高效AI智能PPT生成软件,一键智能生成精美演示文稿。内置海量专业模板、多样风格,支持自定义大纲,助您轻松制作高质量PPT,大幅节省时间。
    674次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码