Private Relay 提供產生的電子郵件地址來取代個人電子郵件地址。
收件人仍然會收到電子郵件,但 Private Relay 會防止他們的個人電子郵件地址被收集,然後被購買、出售、交易或與其他資料結合以個人識別、追蹤和/或定位他們。
請參閱我們的程式碼風格、命名約定和其他方法的編碼標準。
sudo apt install postgresql libpq-dev python3-dev
brew install postgresql libpq
sudo dnf install libpq-devel python3-devel
克隆並更改到目錄:
git clone --recurse-submodules https://github.com/mozilla/fx-private-relay.git
cd fx-private-relay
創建並啟動虛擬環境:
基於 Unix 的系統:
virtualenv env
source env/bin/activate
視窗:
python -m venv env
source env/Scripts/activate
如果您不在 Windows 上使用 Git Bash,請鍵入.envScriptsactivate
,而不是鍵入source env/Scripts/activate
。
注意:如果您在 Windows 上執行並收到錯誤訊息,指出電腦上已停用執行腳本,請進入 Windows powershell 並鍵入Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy Unrestricted
,然後再試一次。
安裝 Python 和 Node 需求:
pip install -r requirements.txt
cd frontend
npm install
cd ../
注意:如果您在 Windows 上執行,則可能會遇到在 npm 腳本中使用環境變數的問題。您可以強制 npm 使用 git-bash: npm config set script-shell "C:\Program Files\Git\bin\bash.exe"
。這是預設位置,您的安裝可能會有所不同。
複製.env
檔以進行decouple
配置:
cp .env-dist .env
將SECRET_KEY
值新增至.env
:
SECRET_KEY =secret-key-should-be-different-for-every-install
遷移資料庫:
python manage.py migrate
創建超級用戶:
python manage.py createsuperuser
運行後端:
python manage.py runserver
並在不同的終端中建構前端:
cd frontend
npm run watch
以下文件將幫助您開始開發,包括建立要翻譯的新字串。有關中繼本地化的一般信息,請參閱翻譯和本地化。
我們使用 git 子模組來翻譯訊息檔案。安裝的--recurse-submodules
步驟應該已經將訊息檔案帶入您的工作目錄中,但您可能還想在安裝後更新翻譯。最簡單的方法是:
git submodule update --remote
若要在執行git pull
或其他指令時自動更新子模組:
git config --global submodule.recurse true
privaterelay/locales
目錄是一個與其他目錄相同的 git 儲存庫,因此要變更訊息:
工作時在privaterelay/locales/en
中進行所需的任何更改。
cd privaterelay/locales/en
git branch message-updates-yyyymmdd
git push -u origin message-updates-yyyymmdd
然後,您可以開啟從message-updates-yyyymmdd
分支到 l10n 儲存庫main
分支的拉取請求。
如果您還沒有準備好提交一些字串進行翻譯,您可以暫時將它們新增至frontend/pendingTranslations.ftl
。該文件中的字串將一直顯示,直到具有相同 ID 的字串被添加到 l10n 儲存庫中。
同樣,有一個可儲存臨時後端區域設定字串的pending_locales/pending.ftl
。一旦 l10n 儲存庫中拉取請求中的字串合併到 Relay 儲存庫中,就需要從pending_locales/pending.ftl
中刪除這些對應的字串,以避免 CircleCI 測試失敗。
要提交應用程式翻譯的更新(例如,在發布之前),我們需要提交此子模組更新。因此,如果更新的翻譯已準備好提交到應用程式中,您可以像任何其他檔案一樣git add
子模組:
git add privaterelay/locales
然後,您可以提交並推送以將應用程式儲存庫設定為翻譯子模組的更新版本:
git push
自動化流程每天更新子模組,引入本地化團隊的任何新變更和翻譯。
若要在本機伺服器上啟用 Mozilla 帳戶驗證,您可以使用accounts.stage.mozaws.net 上的「Firefox Private Relay local dev」OAuth 應用程式。
為此:
在.env
檔中設定ADMIN_ENABLED=True
如果伺服器正在運行,請關閉伺服器,並使用以下命令新增管理表:
python manage.py migrate
現在使用/admin
端點運行伺服器:
python manage.py runserver
前往 django 管理頁面更改預設網站。
將example.com
更改為127.0.0.1:8000
,然後按一下「儲存」。
前往 django-allauth 社交應用程式管理頁面,使用您在上面建立的超級使用者帳戶登錄,然後為 Firefox 帳戶新增社交應用程式:
場地 | 價值 |
---|---|
提供者 | Mozilla 帳戶 |
姓名 | accounts.stage.mozaws.net |
客戶編號 | 9ebfe2c2f9ea3c58 |
秘鑰 | 從#fx-private-relay-eng Slack 頻道請求此內容 |
站點 | 127.0.0.1:8000 -> 選擇的站點 |
現在您可以使用 FxA 登入 http://127.0.0.1:8000/。
注意:此附加元件位於單獨的儲存庫中。有關入門的更多信息,請參閱它。
該插件添加了 Firefox UI 以在網路上產生和自動填寫電子郵件地址。在本地運行插件允許它與本地伺服器( 127.0.0.1:8000
)而不是生產伺服器( relay.firefox.com
)進行通訊。
npm run watch
監視frontend/src
目錄並在偵測到變更時建立前端。然而,創建生產版本非常耗時,足以中斷您的開發流程。因此,也可以在單獨的伺服器上運行前端,該伺服器僅重新編譯更改的模組,而不應用生產最佳化。為此,請執行npm run dev
,而不是npm run watch
。
前端現在可以在 http://localhost:3000 上使用。請記住,這確實會使您的本地開發環境與生產環境不太相似;特別是,身份驗證通常綁定到後端伺服器,因此在單獨的伺服器上運行前端時需要進行模擬。如果您進行與身分驗證相關的任何更改,請確保也使用npm run watch
對其進行測試。
注意:任何電子郵件地址以mozilla.com
、 getpocket.com
或mozillafoundation.org
結尾的使用者都會自動啟用進階功能(請參閱emails/models.py
中的PREMIUM_DOMAINS
)。為了模仿客戶的體驗,建議遵循以下流程。
為了啟用高級中繼功能,我們與 FXA 訂閱平台整合。在較高層面上,為了設定 Relay 高級訂閱,我們:
如上所述啟用 Mozilla 帳戶身份驗證。
在我們的 Stripe 儀表板中建立產品和價格。 (在 #subscription-platform Slack 頻道中詢問以存取我們的 Stripe 儀表板。)
將 Relay 的免費用戶連結到適當的 SubPlat 購買流程。
檢查用戶的 FXA 設定檔 json 中的subscriptions
字段,看看他們是否可以存取僅限訂閱的高級功能。
詳細:
如上所述啟用 Mozilla 帳戶身份驗證。
前往我們的 Stripe 儀表板。 (在 #subscription-platform Slack 頻道中詢問以存取我們的 Stripe 儀表板。)
在 Stripe 中建立新產品。
新增所有必需的product:
元資料。
product:
前綴。因此,例如, webIconURL
必須輸入為product:webIconURL
。新增capabilities:
元資料。
capabilities:
,並且該值是一個自由格式的字串,用於描述購買訂閱為使用者提供的「功能」。例如, capabilities:9ebfe2c2f9ea3c58
其值為premium-relay
。使用上述步驟中的值設定一些環境變數:
瓦爾 | 價值 |
---|---|
FXA_SUBSCRIPTIONS_URL | https://accounts.stage.mozaws.net/subscriptions |
PERIODICAL_PREMIUM_PROD_ID | prod_KEq0LXqs7vysQT (來自 Stripe) |
PREMIUM_PLAN_ID_US_MONTHLY | price_1LiMjeKb9q6OnNsLzwixHuRz (來自 Stripe) |
PREMIUM_PLAN_ID_US_YEARLY | price_1LiMlBKb9q6OnNsL7tvrtI7y (取自 Stripe) |
PHONE_PROD_ID | prod_LviM2I0paxH1DZ (來自 Stripe) |
PHONE_PLAN_ID_US_MONTHLY | price_1LDqw3Kb9q6OnNsL6XIDst28 (來自 Stripe) |
PHONE_PLAN_ID_US_YEARLY | price_1Lhd35Kb9q6OnNsL9bAxjUGq (來自 Stripe) |
BUNDLE_PROD_ID | prod_MQ9Zf1cyI81XS2 (來自 Stripe) |
BUNDLE_PLAN_ID_US | price_1Lwp7uKb9q6OnNsLQYzpzUs5 (來自 Stripe) |
SUBSCRIPTIONS_WITH_UNLIMITED | "premium-relay" (與您在 Stripe 中使用的capabilities 值相符) |
SUBSCRIPTIONS_WITH_PHONE | "relay-phones" (與您在 Stripe 中使用的capabilities 值相符) |
在frontend/
中,執行npm run build
時設定ANALYZE=true
以產生詳細說明哪些模組佔用了大部分套件大小的報告。將為前端的客戶端和伺服器部分產生一份報告,但由於我們只使用客戶端,因此我們實際上只對此感興趣。報告將自動在您的瀏覽器中打開,也可以在/frontend/.next/analyze/
中找到。
ANALYZE=true npm run build
有一個用於購買高級繼電器的綜合測試用例文件。
您可以使用 Stripe 的測試信用卡詳細資料進行付款。
華夫旗phones
進一步保護了手機的功能。在階段中,您需要一個 SRE 來將標誌新增至您的測試使用者。在開發伺服器上,開發人員可以添加該標誌。
除了開發環境的要求外,生產環境也應該使用:
生產環境也應該設定一些額外的環境變數:
DATABASE_URL=postgresql://:@:/
DJANGO_SECURE_HSTS_SECONDS=15768000
DJANGO_SECURE_SSL_REDIRECT=True