用WordPress+StaticPress环境生成的静态内容能够在5分钟内托管到FireBase上
这篇文章是《在GCP Marketplace上建立WordPress环境只需5分钟》的续篇。
我想做的事。
-
- WordPressを作って静的コンテンツのサイトを作成したいが、
-
- WordPressの自体を使った更新は頻度が少ない
-
- サイト自体はアクセスが多いのでスケーラビリティや耐障害性を担保したい
- 運用楽にしたい
我在使用GCE和Firebase试了一下。
WordPress环境的设置
在VM中创建StaticHTML的输出目录。
> cd /var
> sudo mkdir -m 777 static_press
更改StaticPress的配置
以下是在中文中的原生释义：
从StaticPress > StaticPress Options中的选项
-
- Site URLを”http://XX.XX.XX.XXX/static” -> “http://XX.XX.XX.XXX”へ変更する
Save Dir を先ほど作成したディレクトリ+/publicに変更する
回到WordPress的管理界面，点击StaticPress > Rebuild按钮。
Firebase的配置
Firebase配置
创建项目
安装firebase-tools
回到GCE(wordpress-VM)的控制台，安装node和firebase-tools。
> curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
> sudo apt-get install -y nodejs
> sudo npm install -g firebase-tools
通过CLI登录到Firebase
> firebase login --no-localhost
? Allow Firebase to collect anonymous CLI usage and error reporting information? Yes
Visit this URL on any device to log in:
https://accounts.google.com/o/oauth2/auth?client_id=563584335869-fgrhgmd47bqnekij5i8b5pr03ho849e6.apps.googleusercontent.com&scope=email%20openid%20https%3A%2F%2Fwww.googleapis.com%2Fa
uth%2Fcloudplatformprojects.readonly%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Ffirebase%20https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fcloud-platform&response_type=code&state=630274769&
redirect_uri=urn%3Aietf%3Awg%3Aoauth%3A2.0%3Aoob
复制显示的URL，用浏览器打开并进行Google认证。
? Paste authorization code here: 4/uABuWLhpEPpPTPf-PUyByjJbRvSocMT-fOwGQpnwetAoRAf_KSxumyo
✔ Success! Logged in as tcr.yoshimura@karabiner.tech
Firebase项目的初始化
> cd /var/static_press
> sudo chmod -777 public
> firebase init
请使用下方向键将光标移到Hosting，然后用空格勾选并按下回车键确认。
tcr_yoshimura@wordpress-1-vm:/var/www/html/static$ firebase init
######## #### ######## ######## ######## ### ###### ########
## ## ## ## ## ## ## ## ## ## ##
###### ## ######## ###### ######## ######### ###### ######
## ## ## ## ## ## ## ## ## ## ##
## #### ## ## ######## ######## ## ## ###### ########
You're about to initialize a Firebase project in this directory:
/var/www/html/static
Before we get started, keep in mind:
* You are currently outside your home directory
? Which Firebase CLI features do you want to setup for this folder? Press Space to select features, then Enter to confirm your choices.
◯ Database: Deploy Firebase Realtime Database Rules
◯ Firestore: Deploy rules and create indexes for Firestore
◯ Functions: Configure and deploy Cloud Functions
❯◉ Hosting: Configure and deploy Firebase Hosting sites
◯ Storage: Deploy Cloud Storage security rules
选择您创建的Firebase项目并按“Enter”键。
=== Project Setup
First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.
? Select a default Firebase project for this directory:
[don't setup a default project]
❯ wordpress-sample-d437f (wordpress-sample)
[create a new project]
是否使用public目录？静态
是否将其设置为SPA？否
是否覆盖static/404.html？否
是否覆盖static_index.html？否
=== Hosting Setup
Your public directory is the folder (relative to your project directory) that
will contain Hosting assets to be uploaded with firebase deploy. If you
have a build process for your assets, use your build's output directory.
? What do you want to use as your public directory? static
? Configure as a single-page app (rewrite all urls to /index.html)? No
? File static/404.html already exists. Overwrite? No
i Skipping write of static/404.html
? File static/index.html already exists. Overwrite? No
i Skipping write of static/index.html
i Writing configuration info to firebase.json...
i Writing project information to .firebaserc...
i Writing gitignore file to .gitignore...
✔ Firebase initialization complete!
将应用程序部署到Firebase平台上。
tcr_yoshimura@wordpress-1-vm:/var/static_press$ firebase deploy
=== Deploying to 'wordpress-sample-d437f'...
i deploying hosting
i hosting[wordpress-sample-d437f]: beginning deploy...
i hosting[wordpress-sample-d437f]: found 733 files in static
✔ hosting[wordpress-sample-d437f]: file upload complete
i hosting[wordpress-sample-d437f]: finalizing version...
✔ hosting[wordpress-sample-d437f]: version finalized
i hosting[wordpress-sample-d437f]: releasing new version...
✔ hosting[wordpress-sample-d437f]: release complete
✔ Deploy complete!
Project Console: https://console.firebase.google.com/project/wordpress-sample-d437f/overview
Hosting URL: https://wordpress-sample-d437f.firebaseapp.com
已经被展示出来。
在Firebase上托管内容，因此即使关闭GCE实例（即WordPress），内容仍然可访问。
总结
在GCP和Firebase上（理論上）可以在10分钟内发布一个静态内容网站！
