fx privates Relay
2024.11.07
Private Relay stellt generierte E-Mail-Adressen zur Verwendung anstelle persönlicher E-Mail-Adressen bereit.
Empfänger erhalten weiterhin E-Mails, aber Private Relay verhindert, dass ihre persönlichen E-Mail-Adressen erfasst und dann gekauft, verkauft, gehandelt oder mit anderen Daten kombiniert werden, um sie persönlich zu identifizieren, zu verfolgen und/oder anzusprechen.
Informationen zu Codestilen, Namenskonventionen und anderen Methoden finden Sie in unseren Codierungsstandards.
sudo apt install postgresql libpq-dev python3-devbrew install postgresql libpqsudo dnf install libpq-devel python3-develKlonen und in das Verzeichnis wechseln:
git clone --recurse-submodules https://github.com/mozilla/fx-private-relay.git
cd fx-private-relayErstellen und aktivieren Sie eine virtuelle Umgebung:
Unix-basierte Systeme:
virtualenv env
source env/bin/activateWindows:
python -m venv env
source env/Scripts/activate Wenn Sie Git Bash unter Windows nicht verwenden, geben Sie anstelle von source env/Scripts/activate .envScriptsactivate ein.
Hinweis: Wenn Sie unter Windows arbeiten und eine Fehlermeldung erhalten, dass die Ausführung von Skripts auf Ihrem Computer deaktiviert ist, rufen Sie die Windows-PowerShell auf, geben Sie Set-ExecutionPolicy -Scope CurrentUser -ExecutionPolicy Unrestricted ein und versuchen Sie es dann erneut.
Installieren Sie Python und Node-Anforderungen:
pip install -r requirements.txt cd frontend
npm install
cd ../ Hinweis: Wenn Sie Windows verwenden, kann es bei der Verwendung von Umgebungsvariablen in npm-Skripten zu Problemen kommen. Sie können npm zwingen, git-bash zu verwenden: npm config set script-shell "C:\Program Files\Git\bin\bash.exe" . Dies ist der Standardspeicherort. Ihre Installation kann davon abweichen.
Kopieren Sie .env Datei für decouple :
cp .env-dist .env Fügen Sie einen SECRET_KEY Wert zu .env hinzu:
SECRET_KEY =secret-key-should-be-different-for-every-installDB migrieren:
python manage.py migrateSuperuser erstellen:
python manage.py createsuperuserFühren Sie das Backend aus:
python manage.py runserverund erstellen Sie in einem anderen Terminal das Frontend:
cd frontend
npm run watchDie folgenden Dokumente erleichtern Ihnen den Einstieg in die Entwicklung und umfassen das Erstellen neuer zu übersetzender Zeichenfolgen. Allgemeine Informationen zur Relay-Lokalisierung finden Sie unter Übersetzung und Lokalisierung.
Wir verwenden ein Git-Submodul für übersetzte Nachrichtendateien. Der Installationsschritt --recurse-submodules sollte die Nachrichtendateien bereits in Ihr Arbeitsverzeichnis bringen, Sie möchten aber möglicherweise auch die Übersetzungen nach der Installation aktualisieren. Der einfachste Weg, dies zu tun, ist:
git submodule update --remote So aktualisieren Sie das Submodul automatisch, wenn Sie git pull oder andere Befehle ausführen:
git config --global submodule.recurse true Das Verzeichnis privaterelay/locales ist wie jedes andere ein Git-Repository. Um also Änderungen an den Nachrichten vorzunehmen:
Nehmen Sie während der Arbeit alle erforderlichen Änderungen in privaterelay/locales/en vor.
cd privaterelay/locales/en
git branch message-updates-yyyymmdd
git push -u origin message-updates-yyyymmdd
Anschließend können Sie eine Pull-Anfrage vom Zweig message-updates-yyyymmdd zum main des L10n-Repos öffnen.
Wenn Sie noch nicht bereit sind, einige Zeichenfolgen zur Übersetzung einzureichen, können Sie sie vorläufig zu frontend/pendingTranslations.ftl hinzufügen. Zeichenfolgen in dieser Datei werden angezeigt, bis Zeichenfolgen mit derselben ID zum l10n-Repository hinzugefügt werden.
Ebenso gibt es eine pending_locales/pending.ftl , in der temporäre Backend-Gebietsschemazeichenfolgen gespeichert werden können. Sobald die Zeichenfolgen aus der Pull-Anfrage im l10n-Repository mit dem Relay-Repository zusammengeführt wurden, müssen diese entsprechenden Zeichenfolgen aus pending_locales/pending.ftl entfernt werden, um zu verhindern, dass CircleCI-Tests fehlschlagen.
Um Aktualisierungen der Übersetzungen der App zu übernehmen (z. B. vor einer Veröffentlichung), müssen wir dieses Submodul-Update festschreiben. Wenn also die aktualisierten Übersetzungen bereit sind, in die App übernommen zu werden, können Sie das Submodul wie jede andere Datei git add :
git add privaterelay/localesAnschließend können Sie einen Commit und einen Push durchführen, um das App-Repository auf die aktualisierte Version des Übersetzungssubmoduls festzulegen:
git pushEin automatisierter Prozess aktualisiert das Submodul täglich und übernimmt alle neuen Änderungen und Übersetzungen vom Lokalisierungsteam.
Um die Mozilla-Kontenauthentifizierung auf Ihrem lokalen Server zu aktivieren, können Sie die OAuth-App „Firefox Private Relay local dev“ aufaccounts.stage.mozaws.net verwenden.
Gehen Sie dazu wie folgt vor:
Legen Sie ADMIN_ENABLED=True in Ihrer .env Datei fest
Fahren Sie den Server herunter, falls er ausgeführt wird, und fügen Sie die Admin-Tabellen hinzu mit:
python manage.py migrate Führen Sie den Server aus, jetzt mit /admin Endpunkten:
python manage.py runserverGehen Sie zur Django-Administratorseite, um die Standardsite zu ändern.
Ändern Sie example.com in 127.0.0.1:8000 und klicken Sie auf Speichern.
Gehen Sie zur Admin-Seite der sozialen App „django-allauth“, melden Sie sich mit dem oben erstellten Superuser-Konto an und fügen Sie eine soziale App für Firefox-Konten hinzu:
| Feld | Wert |
|---|---|
| Anbieter | Mozilla-Konten |
| Name | accounts.stage.mozaws.net |
| Kunden-ID | 9ebfe2c2f9ea3c58 |
| Geheimer Schlüssel | Fordern Sie dies über den Slack-Kanal #fx-private-relay-eng |
| Websites | 127.0.0.1:8000 -> Ausgewählte Sites |
Jetzt können Sie sich mit einem FxA bei http://127.0.0.1:8000/ anmelden.
Hinweis: Das Add-on befindet sich in einem separaten Repo. Weitere Informationen zum Einstieg finden Sie hier.
Das Add-on fügt die Firefox-Benutzeroberfläche hinzu, um E-Mail-Adressen im gesamten Web zu generieren und automatisch auszufüllen. Wenn Sie das Add-on lokal ausführen, kann es mit Ihrem lokalen Server ( 127.0.0.1:8000 ) statt mit dem Produktionsserver ( relay.firefox.com ) kommunizieren.
npm run watch überwacht das Verzeichnis frontend/src und erstellt das Frontend, wenn es Änderungen erkennt. Allerdings ist die Erstellung eines Produktions-Builds gerade zeitaufwändig genug, um Ihren Entwicklungsfluss zu unterbrechen. Daher ist es auch möglich, das Frontend auf einem separaten Server zu betreiben, der nur geänderte Module neu kompiliert und keine Produktionsoptimierungen durchführt. Führen Sie dazu anstelle von npm run watch npm run dev aus.
Das Frontend ist jetzt unter http://localhost:3000 verfügbar. Bedenken Sie, dass Ihre lokale Entwicklungsumgebung dadurch weniger der Produktion ähnelt. Insbesondere ist die Authentifizierung normalerweise an den Backend-Server gebunden und muss daher simuliert werden, wenn das Frontend auf einem separaten Server ausgeführt wird. Wenn Sie Änderungen im Zusammenhang mit der Authentifizierung vornehmen, testen Sie diese unbedingt auch mit npm run watch .
Hinweis: Premium-Funktionen werden automatisch für jeden Benutzer aktiviert, dessen E-Mail-Adresse auf mozilla.com , getpocket.com oder mozillafoundation.org endet (siehe PREMIUM_DOMAINS in emails/models.py ). Um die Erfahrung des Kunden nachzuahmen, wird empfohlen, das folgende Verfahren zu befolgen.
Um die Premium-Relay-Funktionen zu ermöglichen, integrieren wir die FXA-Abonnementplattform. Um ein Relay-Premium-Abonnement einzurichten, gehen wir grundsätzlich wie folgt vor:
Aktivieren Sie die Mozilla-Kontoauthentifizierung wie oben beschrieben.
Erstellen Sie ein Produkt und einen Preis in unserem Stripe-Dashboard. (Fragen Sie im Slack-Kanal #subscription-platform nach Zugriff auf unser Stripe-Dashboard.)
Verknüpfen Sie kostenlose Relay-Benutzer mit dem entsprechenden SubPlat-Kaufablauf.
Überprüfen Sie die FXA-Profil-JSON der Benutzer auf ein subscriptions , um zu sehen, ob sie auf eine Premium-Funktion zugreifen können, die nur für Abonnements gilt.
Ausführlich:
Aktivieren Sie die Mozilla-Kontoauthentifizierung wie oben beschrieben.
Gehen Sie zu unserem Stripe-Dashboard. (Fragen Sie im Slack-Kanal #subscription-platform nach Zugriff auf unser Stripe-Dashboard.)
Erstellen Sie ein neues Produkt in Stripe.
Fügen Sie alle erforderlichen product: hinzu.
product: -Präfix haben. So muss beispielsweise webIconURL als product:webIconURL eingegeben werden. capabilities: Metadaten.
capabilities: haben und der Wert ist eine Freiformzeichenfolge, um die „Fähigkeit“ zu beschreiben, die der Benutzer durch den Kauf des Abonnements erhält. Beispiel: capabilities:9ebfe2c2f9ea3c58 mit dem Wert premium-relay .Legen Sie einige Umgebungsvariablen mit Werten aus den obigen Schritten fest:
| Var | Wert |
|---|---|
FXA_SUBSCRIPTIONS_URL | https://accounts.stage.mozaws.net/subscriptions |
PERIODICAL_PREMIUM_PROD_ID | prod_KEq0LXqs7vysQT (von Stripe) |
PREMIUM_PLAN_ID_US_MONTHLY | price_1LiMjeKb9q6OnNsLzwixHuRz (von Stripe) |
PREMIUM_PLAN_ID_US_YEARLY | price_1LiMlBKb9q6OnNsL7tvrtI7y (von Stripe) |
PHONE_PROD_ID | prod_LviM2I0paxH1DZ (von Stripe) |
PHONE_PLAN_ID_US_MONTHLY | price_1LDqw3Kb9q6OnNsL6XIDst28 (von Stripe) |
PHONE_PLAN_ID_US_YEARLY | price_1Lhd35Kb9q6OnNsL9bAxjUGq (von Stripe) |
BUNDLE_PROD_ID | prod_MQ9Zf1cyI81XS2 (von Stripe) |
BUNDLE_PLAN_ID_US | price_1Lwp7uKb9q6OnNsLQYzpzUs5 (von Stripe) |
SUBSCRIPTIONS_WITH_UNLIMITED | "premium-relay" (entspricht dem capabilities , den Sie in Stripe verwendet haben) |
SUBSCRIPTIONS_WITH_PHONE | "relay-phones" (entspricht dem capabilities , den Sie in Stripe verwendet haben) |
Legen Sie in frontend/ ANALYZE=true fest, wenn Sie npm run build ausführen, um einen Bericht zu generieren, der detailliert beschreibt, welche Module den größten Teil der Bundle-Größe beanspruchen. Es wird ein Bericht sowohl für den Client- als auch für den Serverteil des Frontends erstellt. Da wir jedoch nur den Client verwenden, interessiert uns eigentlich nur dieser. Die Berichte werden automatisch in Ihrem Browser geöffnet und sind auch in /frontend/.next/analyze/ zu finden.
ANALYZE=true npm run buildEs gibt ein umfassendes Dokument mit Testfällen für den Kauf von Premium-Relay.
Zur Zahlung können Sie die Test-Kreditkartendaten von Stripe nutzen.
Die Telefonfunktionen werden zusätzlich durch ein Waffel-Flag phones geschützt. In der Phase benötigen Sie eine SRE, um die Markierung zu Ihrem Testbenutzer hinzuzufügen. Auf dem Entwicklungsserver kann ein Entwickler das Flag hinzufügen.
Zusätzlich zu den Anforderungen für die Entwicklung sollten Produktionsumgebungen Folgendes verwenden:
Produktionsumgebungen sollten außerdem einige zusätzliche Umgebungsvariablen festlegen:
DATABASE_URL=postgresql://:@:/
DJANGO_SECURE_HSTS_SECONDS=15768000
DJANGO_SECURE_SSL_REDIRECT=True
