Hugo 博客中配置 Firebase 的方法

Table of Contents

Table of Contents

简介
#

    [#](#%E7%AE%80%E4%BB%8B)

#

Blowfish 添加了对 Firebase 的支持以在网站上使用动态数据.

配置方法
#

    [#](#%E9%85%8D%E7%BD%AE%E6%96%B9%E6%B3%95)

#

在 Firebase 官网免费注册一个账号

选择「添加项目」，输入项目名

![](https://mostima.blog/blog/firebase-hugo-blog/firebase1.png)





![](https://mostima.blog/blog/firebase-hugo-blog/firebase2.png)

开启「为此项目启用 Google Analytics」

![](https://mostima.blog/blog/firebase-hugo-blog/firebase3.png)

选择默认账号即可

![](https://mostima.blog/blog/firebase-hugo-blog/firebase4.png)

进入项目主页后选择 </>

![](https://mostima.blog/blog/firebase-hugo-blog/firebase6.png)

输入你的应用名

![](https://mostima.blog/blog/firebase-hugo-blog/firebase7.png)

选择「使用 <script> 标记」，并记录下 config 数据，如黄框所示

![](https://mostima.blog/blog/firebase-hugo-blog/firebase8.png)

在 config/_default/params.toml 文件中将上一步中的配置变量覆盖原配置

# 实例，请替换为自己的数据
[firebase]
  apiKey: "AIzaSyB5tqlqDky77Vb4Tc4apiHV4hRZI18KGiY",
  authDomain: "blowfish-21fff.firebaseapp.com",
  projectId: "blowfish-21fff",
  storageBucket: "blowfish-21fff.appspot.com",
  messagingSenderId: "60108104191",
  appId: "1:60108104191:web:039842ebe1370698b487ca",
  measurementId: "G-PEDMYR1V0K"

配置 Authentication

在「项目首页」或「侧边栏」中选择 Authentication

![](https://mostima.blog/blog/firebase-hugo-blog/firebase9.png)

选择开始

![](https://mostima.blog/blog/firebase-hugo-blog/firebase10.png)

选择「匿名」

![](https://mostima.blog/blog/firebase-hugo-blog/firebase11.png)

启用匿名，并保存

![](https://mostima.blog/blog/firebase-hugo-blog/firebase12.png)

点击侧边栏，选择「Firestore Database」，并点击创建数据库

![](https://mostima.blog/blog/firebase-hugo-blog/firebase13.png)

选择距离你为止较近的「位置」

![](https://mostima.blog/blog/firebase-hugo-blog/firebase14.png)

选择「以生产模式开始」，并点击创建

![](https://mostima.blog/blog/firebase-hugo-blog/firebase15.png)

完成后，修改规则，将以下内容粘贴进输入框中

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if request.auth != null;
    }
  }
}

如果你之前已经将 showViews 和 showLikes 设置为 true 的话, 现在阅读量和点赞量应该可以正常显示了.

Related
#

#

    Hugo 博客搭建

3 February 2024·664 words·4 mins·

loading

loading






























博客搭建







Blog







Openai







Chatgpt







Linux







Opensource







Hugo









    

    
    
      简介 # 在博客搭建完成之后，我意识到，建站对我来说是一个极低频的工作，除非以后需要更换新的部署方案，否则只有极小的可能性对网站进行大的变动，为了避免我忘记，也为了给有需要的人提供一些力所能及的帮助，故写下此文，如果有错误或误导的内容，请不吝在文末留言，或者邮件联系我～那么就开始吧
    
    
  
  

  









  

    
    markdown test

21 February 2023·696 words·4 mins·

loading

loading






























Hugo







Opensource







Chatgpt







Linux







Markdown









    

    
    
      Features # Support Standard Markdown / CommonMark and GFM(GitHub Flavored Markdown); Full-featured: Real-time Preview, Image (cross-domain) upload, Preformatted text/Code blocks/Tables insert, Code fold, Search replace, Read only, Themes, Multi-languages, L18n, HTML entities, Code syntax highlighting…; Markdown Extras : Support ToC (Table of Contents), Emoji, Task lists, @Links…; Compatible with all major browsers (IE8+), compatible Zepto.
    
    
  
  

  









  

    
    Hello World

21 February 2023·133 words·1 min·

loading

loading






























Drupal







Openai







Chatgpt







Linux







Opensource







Hugo









    

    
    
      Hello world!
    
    
  
  

  








    
    
    
  

  

    
    Install-Drupal10-with-Nginx-on-Ubuntu-22.04

26 January 2024·1065 words·5 mins·

loading

loading






























Drupal







Nginx







Ubuntu







Linux







Opensource









    

    
    
      Along with WordPress, Drupal is another popular CMS with greater flexibility.
    
    
  
  

  









  

    
    Installing ownCloud in Docker with Docker Compose

26 February 2023·245 words·2 mins·

loading

loading






























Docker







Owncloud







Openai







Linux







Opensource







Chatgpt









    

    
    
      In this tutorial, we’ll walk through the steps to install ownCloud in Docker using a Docker Compose file for easy cloud storage and file sharing.

简介#

#

配置方法#

#

Related#

#

简介
#

配置方法
#

Related
#