Gin框架實戰——HTML渲染

来源:https://www.cnblogs.com/echoqiqi/archive/2023/01/31/17080810.html
-Advertisement-
Play Games

Gin框架實戰——HTML渲染 最近使用Go的Gin框架做了個簡單的前端網頁,記錄一下細節~ 1.載入靜態文件 由於網頁需要使用css、圖片等渲染,而靜態文件必須先聲明:否則模板中調用載入不出來,這個很重要,即使你把文件放到對應路徑下,html中也寫了相應的路徑,但是開啟go服務端的網頁,會顯示不出 ...


   Gin框架實戰——HTML渲染

最近使用Go的Gin框架做了個簡單的前端網頁,記錄一下細節~

1.載入靜態文件

       由於網頁需要使用css、圖片等渲染,而靜態文件必須先聲明:否則模板中調用載入不出來,這個很重要,即使你把文件放到對應路徑下,html中也寫了相應的路徑,但是開啟go服務端的網頁,會顯示不出來樣式、圖片等。因此需要載入靜態文件。

//Default返回一個預設的路由
    r := gin.Default()
    r.StaticFS("/public", http.Dir("D:\\Gotest\\web1\\web\\static"))       //相當於更換路徑。載入靜態文件
    r.StaticFS("/fonts", http.Dir("D:\\Gotest\\web1\\web\\static\\fonts")) //相當於更換路徑。載入靜態文件

/* 設置靜態文件夾綁定:
r.Static(路由,靜態文件夾)另外一種寫法:r.StaticFS("/static"路由,http.Dir("static")資源)
設置單個靜態文件: r.StaticFile(路由,資源)
*/
eg:

router := gin.Default()
router.Static("/assets", "./assets")
router.StaticFS("/more_static", http.Dir("my_file_system"))
router.StaticFile("/favicon.ico", "./resources/favicon.ico")

這裡的載入資源,我的理解是更換路徑,本地的文件路徑,換成工程里設置的路徑。

有兩種方式:①r.Static(路由,靜態文件夾)另外一種寫法:r.StaticFS("/static"路由,http.Dir("static")資源)

這種方法是載入一個文件下所有的文件,但是不載入文件裡子文件的內容。如使用

r.StaticFS("/public",http.Dir(./static))

載入下圖的static文件夾下的文件,main.css、admin_login.css、common.css可以使用public/main.css路徑代替原有路徑,然後public/fonts文件貌似裡面的內容載入不出來,所以,不知道是不是我的問題,我認為是只能載入文件夾下的文件,而不能載入文件夾下文件裡面的文件(不能遞歸)。

使用router.StaticFile("/favicon.ico", "./resources/favicon.ico")載入單個文件,就是那個文件的路徑換成StaticFile函數里第一個參數的路徑即可。

 

 

 2.HTML渲染

使用LoadHTMLGlob載入html文件,使用get/post方法從html文件里獲取前端數據。

 

 controller.IndexController函數為:

func IndexController(c *gin.Context) {
    c.HTML(http.StatusOK, "login.html", gin.H{
        "Title": "開元十年",
    })
}

這個函數表示為,http的狀態碼為StatusOK時,載入login.html文件。效果圖為:

 

 

參考文章:

https://zhuanlan.zhihu.com/p/484462011

https://blog.csdn.net/m764395448/article/details/109113426?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522167371151716800213068248%2522%252C%2522scm%2522%253A%252220140713.130102334..%2522%257D&request_id=167371151716800213068248&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~top_positive~default-1-109113426-null-null.142^v71^pc_new_rank,201^v4^add_ask&utm_term=gin%E6%A1%86%E6%9E%B6&spm=1018.2226.3001.4187


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 最近做的一個項目是採用前後端分離模式寫前端,後端是fabric區塊鏈,提供介面,需要使用post方法進行訪問。如上一章註冊用戶,就是需要把用戶名、賬戶信息轉換成json形式 使用post方法傳給後端區塊鏈的url.話不多說直接看代碼分析。 /*post1註冊用戶*/ func signup(url ...
  • 聲明式事務 1.事務分類 編程式事務 Connection connection = JdbcUtils.getConnection(); try{ //1.先設置事務不要提交 connection.setAutoCommit(false); //2.進行業務 crud //3.提交事務 conne ...
  • 這篇文章主要描述如何定位RPC問題以及如何使用時鐘輪來管理RPC中的定時任務,主要包括如何設計合適的異常機制,如何使用分散式鏈路跟蹤系統,以及如何使用時鐘輪來管理RPC中的超時控制和心跳檢測。 ...
  • 初識Flask Flask簡介 Flask是一個基於Python的web框架,由奧地利開發商Armin Ronacher於2010年4月1日發佈。它以靈活、“微”框架著稱,其本身並不具備太多的功能,但通過豐富的第三方插件,使其在保持重量輕和簡單的同時仍然可以進行高度擴展,讓開發者能輕鬆應對現實開發中 ...
  • 簡單介紹一下Go中Gin使用get和post方法獲取前端數據 1.使用get方法獲取url中的參數 因為我使用的網頁只需要在url上傳一個參數,簡單介紹一下,get方法的傳參吧,可能不全,後續補充~ 在主函數使用get/post方式載入需要從網頁中使用get/post方法獲取數據如下(預設使用get ...
  • 聲明:文章僅用於學習交流,切勿用於非法用途。 一、autojs版本 使用autojs版本4.1,其餘版本對微信、qq、抖音有限制。 下載地址:關註【產品經理不是經理】gzh,回覆【autojs】即可下載。 官方文檔:https://pro.autojs.org/docs/zh/v8/ 學習要點:熟悉 ...
  • 一、 為什麼要多線程 CPU和IO設備之間的速度存在很大的差異,提高CPU利用率 提高服務端併發量 線程安全問題: 有共用數據的情況下使用多線程可能會導致線程安全問題 原子性:時間片輪轉導致 可見性:CPU和記憶體之間有緩存/工作記憶體和主記憶體 有序性:指令重排序 實現線程安全的方法: 互斥同步:悲觀 ...
  • 程式設計基礎 基礎知識 什麼是程式? 為進行某項活動的步驟,電腦的程式,為得到某種結果,通過電腦語言表達的指令序列。 什麼是程式設計? 計算思維,是運用電腦科學的基礎概念進行問題求解,系統設計,以及人類行為理解等涵蓋電腦科學之廣度的一系列思維活動。 計算思維的特點: 1.滿足電腦程式執行的 ...
一周排行
    -Advertisement-
    Play Games
  • 通過WPF的按鈕、文本輸入框實現了一個簡單的SpinBox數字輸入用戶組件並可以通過數據綁定數值和步長。本文中介紹了通過Xaml代碼實現自定義組件的佈局,依賴屬性的定義和使用等知識點。 ...
  • 以前,我看到一個朋友在對一個系統做初始化的時候,通過一組魔幻般的按鍵,調出來一個隱藏的系統設置界面,這個界面在常規的菜單或者工具欄是看不到的,因為它是一個後臺設置的關鍵界面,不公開,同時避免常規用戶的誤操作,它是作為一個超級管理員的入口功能,這個是很不錯的思路。其實Winform做這樣的處理也是很容... ...
  • 一:背景 1. 講故事 前些天有位朋友找到我,說他的程式每次關閉時就會自動崩潰,一直找不到原因讓我幫忙看一下怎麼回事,這位朋友應該是第二次找我了,分析了下 dump 還是挺經典的,拿出來給大家分享一下吧。 二:WinDbg 分析 1. 為什麼會崩潰 找崩潰原因比較簡單,用 !analyze -v 命 ...
  • 在一些報表模塊中,需要我們根據用戶操作的名稱,來動態根據人員姓名,更新報表的簽名圖片,也就是電子手寫簽名效果,本篇隨筆介紹一下使用FastReport報表動態更新人員簽名圖片。 ...
  • 最新內容優先發佈於個人博客:小虎技術分享站,隨後逐步搬運到博客園。 創作不易,如果覺得有用請在Github上為博主點亮一顆小星星吧! 博主開始學習編程於11年前,年少時還只會使用cin 和cout ,給單片機點點燈。那時候,類似async/await 和future/promise 模型的認知還不是 ...
  • 之前在阿裡雲ECS 99元/年的活動實例上搭建了一個測試用的MINIO服務,以前都是直接當基礎設施來使用的,這次準備自己學一下S3相容API相關的對象存儲開發,因此有了這個小工具。目前僅包含上傳功能,後續計劃開發一個類似圖床的對象存儲應用。 ...
  • 目錄簡介快速入門安裝 NuGet 包實體類User資料庫類DbFactory增刪改查InsertSelectUpdateDelete總結 簡介 NPoco 是 PetaPoco 的一個分支,具有一些額外的功能,截至現在 github 星數 839。NPoco 中文資料沒多少,我是被博客園群友推薦的, ...
  • 前言 前面使用 Admin.Core 的代碼生成器生成了通用代碼生成器的基礎模塊 分組,模板,項目,項目模型,項目欄位的基礎功能,本篇繼續完善,實現最核心的模板生成功能,並提供生成預覽及代碼文件壓縮下載 準備 首先清楚幾個模塊的關係,如何使用,簡單畫一個流程圖 前面完成了基礎的模板組,模板管理,項目 ...
  • 假設需要實現一個圖標和文本結合的按鈕 ,普通做法是 直接重寫該按鈕的模板; 如果想作為通用的呢? 兩種做法: 附加屬性 自定義控制項 推薦使用附加屬性的形式 第一種:附加屬性 創建Button的附加屬性 ButtonExtensions 1 public static class ButtonExte ...
  • 在C#中,委托是一種引用類型的數據類型,允許我們封裝方法的引用。通過使用委托,我們可以將方法作為參數傳遞給其他方法,或者將多個方法組合在一起,從而實現更靈活的編程模式。委托類似於函數指針,但提供了類型安全和垃圾回收等現代語言特性。 基本概念 定義委托 定義委托需要指定它所代表的方法的原型,包括返回類 ...