> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
> Ce guide explique comment intégrer Auth0 à une application Django en Python à l’aide du SDK Authlib.
# Ajoutez la connexion à votre application Django
export const AuthCodeGroup = ({children, dropdown}) => {
const [processedChildren, setProcessedChildren] = useState(children);
useEffect(() => {
let unsubscribe = null;
function init() {
unsubscribe = window.autorun(() => {
const processChildren = node => {
if (typeof node === "string") {
let processedNode = node;
for (const [key, value] of window.rootStore.variableStore.values.entries()) {
const escapedKey = key.replaceAll(/[.*+?^${}()|[\]\\]/g, (String.raw)`\$&`);
processedNode = processedNode.replaceAll(new RegExp(escapedKey, "g"), value);
}
return processedNode;
} else if (Array.isArray(node)) {
return node.map(processChildren);
} else if (node && node.props && node.props.children) {
return {
...node,
props: {
...node.props,
children: processChildren(node.props.children)
}
};
}
return node;
};
setProcessedChildren(processChildren(children));
});
}
if (window.rootStore) {
init();
} else {
window.addEventListener("adu:storeReady", init);
}
return () => {
window.removeEventListener("adu:storeReady", init);
unsubscribe?.();
};
}, [children]);
return {processedChildren} ;
};
export const QuickstartButtons = ({githubLink}) => {
const text = {
viewOnGithub: "Voir sur GitHub",
loginAndDownload: "Télécharger l’exemple"
};
const parseGithubUrl = url => {
try {
const urlObj = new URL(url);
const pathParts = urlObj.pathname.split("/").filter(Boolean);
if (pathParts.length >= 4 && pathParts[2] === "tree") {
const repoName = pathParts[1];
const branch = pathParts[3];
const path = pathParts.slice(4).join("/") || undefined;
return {
repo: repoName,
branch,
path
};
}
console.warn("Impossible d’analyser l’URL GitHub :", url);
return null;
} catch (error) {
console.error("Erreur lors de l’analyse de l’URL GitHub :", error);
return null;
}
};
const handleDownload = async () => {
const params = parseGithubUrl(githubLink);
if (!params) {
console.error("Format d’URL GitHub non valide");
return;
}
try {
await window.Auth0DocsUI?.getSample(params);
} catch (error) {
console.error("Impossible de télécharger l’exemple :", error);
}
};
return ;
};
export const LoggedInForm = ({sampleApp}) => {
const LS_APPS_KEY = "auth_demo_apps";
const LS_APP_CFG_KEY = "auth_demo_app_cfg";
const CHANNEL = "auth_flows_sync_v1";
const mkChannel = () => new BroadcastChannel(CHANNEL);
function uid() {
return Math.random().toString(36).slice(2) + Date.now().toString(36);
}
function loadApps() {
const raw = localStorage.getItem(LS_APPS_KEY);
if (raw) return JSON.parse(raw);
const seeded = [{
id: "{yourClientId}",
name: "Application par défaut"
}];
localStorage.setItem(LS_APPS_KEY, JSON.stringify(seeded));
return seeded;
}
function saveApps(apps) {
localStorage.setItem(LS_APPS_KEY, JSON.stringify(apps));
}
function loadCfg() {
const raw = localStorage.getItem(LS_APP_CFG_KEY);
return raw ? JSON.parse(raw) : {};
}
function saveCfg(cfg) {
localStorage.setItem(LS_APP_CFG_KEY, JSON.stringify(cfg));
}
const RightChevron = ({className = "w-5 h-5", ...props}) =>
;
const LightningIcon = () =>
;
const LayersIcon = () =>
;
const GithubIcon = () =>
;
function IconTile({children}) {
return
{children}
;
}
function Card({className = "", children}) {
return {children}
;
}
function Button({variant = "primary", type = "button", onClick, children}) {
const base = "inline-flex items-center justify-center gap-2 h-10 px-4 rounded-xl font-medium transition";
let styles = "";
if (variant === "primary") {
styles = "mint-bg-indigo-600 text-white hover:mint-bg-indigo-700";
} else if (variant === "outline") {
styles = "border border-zinc-300 dark:border-zinc-700 mint-bg-transparent hover:mint-bg-zinc-50 dark:hover:mint-bg-zinc-800";
} else if (variant === "ghost") {
styles = "hover:mint-bg-zinc-100 dark:hover:mint-bg-zinc-800";
}
return
{children}
;
}
function Input({id, label, value, onChange, placeholder, name}) {
return
{label}
;
}
function Select({label, value, onChange, options}) {
return
{label}
onChange(e.target.value)}>
{options.map(o =>
{o.name}
)}
;
}
function Toast({open, onClose, children}) {
useEffect(() => {
if (!open) return;
const t = setTimeout(onClose, 2200);
return () => clearTimeout(t);
}, [open, onClose]);
return ;
}
function Flows() {
const [route, setRoute] = useState("menu");
const [apps, setApps] = useState(loadApps());
const [cfg, setCfg] = useState(loadCfg());
const [selected, setSelected] = useState(apps[0]?.id || "");
const [toast, setToast] = useState(false);
const [bc] = useState(() => mkChannel());
useEffect(() => {
if (!apps.find(a => a.id === selected)) {
setSelected(apps[0]?.id || "");
}
}, [apps, selected]);
useEffect(() => {
const onMsg = e => {
const {type, payload} = e.data || ({});
switch (type) {
case "NAV":
setRoute(payload.route);
break;
case "SELECT":
setSelected(payload.appId);
break;
case "APPS_UPDATED":
setApps(loadApps());
break;
case "CFG_UPDATED":
setCfg(loadCfg());
setToast(true);
break;
default:
break;
}
};
bc.addEventListener("message", onMsg);
return () => bc.removeEventListener("message", onMsg);
}, [bc]);
const nav = nextRoute => {
setRoute(nextRoute);
bc.postMessage({
type: "NAV",
payload: {
route: nextRoute
}
});
};
const selectApp = appId => {
setSelected(appId);
bc.postMessage({
type: "SELECT",
payload: {
appId
}
});
};
const onCreate = name => {
const id = uid();
const next = [...apps, {
id,
name: name || "Untitled"
}];
setApps(next);
saveApps(next);
bc.postMessage({
type: "APPS_UPDATED"
});
selectApp(id);
nav("integrate");
};
const onSaveCfg = (appId, data) => {
const next = {
...cfg,
[appId]: data
};
setCfg(next);
saveCfg(next);
setToast(true);
bc.postMessage({
type: "CFG_UPDATED"
});
};
return
{route === "menu" &&
nav("create")} onIntegrate={() => nav("integrate")} />}
{route === "create" && nav("menu")} onSave={onCreate} />}
{route === "integrate" && onSaveCfg(selected, data)} onCancel={() => nav("menu")} />}
setToast(false)}>
Successfully saved your changes.
;
}
function Menu({onCreate, onIntegrate}) {
return ;
}
function CreateForm({onSave, onCancel}) {
const [name, setName] = useState("");
return ;
}
function IntegrateForm({apps, selected, onSelect, saved, onSave, onCancel}) {
const [callbacks, setCallbacks] = useState(saved?.callbacks ?? "");
const [logouts, setLogouts] = useState(saved?.logouts ?? "");
const [origins, setOrigins] = useState(saved?.origins ?? "");
useEffect(() => {
setCallbacks(loadCfg()[selected]?.callbacks ?? "");
setLogouts(loadCfg()[selected]?.logouts ?? "");
setOrigins(loadCfg()[selected]?.origins ?? "");
}, [selected]);
return
Sélectionnez votre application
;
}
return
;
};
export const SignUpForm = () => {
const [isAuthenticated, setIsAuthenticated] = useState(false);
const [storeReady, setStoreReady] = useState(false);
useEffect(() => {
let unsubscribe = null;
function init() {
setStoreReady(true);
unsubscribe = window.autorun(() => {
const authenticated = window.rootStore?.sessionStore?.isAuthenticated || false;
setIsAuthenticated(authenticated);
});
}
if (window.rootStore) {
init();
} else {
window.addEventListener("adu:storeReady", init);
}
return () => {
window.removeEventListener("adu:storeReady", init);
unsubscribe?.();
};
}, []);
function LoggedInForm({sampleApp}) {
const LS_APPS_KEY = "auth_demo_apps";
const LS_APP_CFG_KEY = "auth_demo_app_cfg";
const CHANNEL = "auth_flows_sync_v1";
const mkChannel = () => new BroadcastChannel(CHANNEL);
function uid() {
return Math.random().toString(36).slice(2) + Date.now().toString(36);
}
function loadApps() {
const raw = localStorage.getItem(LS_APPS_KEY);
if (raw) return JSON.parse(raw);
const seeded = [{
id: "{yourClientId}",
name: "Application par défaut"
}];
localStorage.setItem(LS_APPS_KEY, JSON.stringify(seeded));
return seeded;
}
function saveApps(apps) {
localStorage.setItem(LS_APPS_KEY, JSON.stringify(apps));
}
function loadCfg() {
const raw = localStorage.getItem(LS_APP_CFG_KEY);
return raw ? JSON.parse(raw) : {};
}
function saveCfg(cfg) {
localStorage.setItem(LS_APP_CFG_KEY, JSON.stringify(cfg));
}
const RightChevron = ({className = "w-5 h-5", ...props}) =>
;
const LightningIcon = () =>
;
const LayersIcon = () =>
;
const GithubIcon = () =>
;
function IconTile({children}) {
return
{children}
;
}
function Card({className = "", children}) {
return {children}
;
}
function Button({variant = "primary", type = "button", onClick, children}) {
const base = "inline-flex items-center justify-center gap-2 h-10 px-4 rounded-xl font-medium transition";
let styles = "";
if (variant === "primary") {
styles = "mint-bg-indigo-600 text-white hover:mint-bg-indigo-700";
} else if (variant === "outline") {
styles = "border border-zinc-300 dark:border-zinc-700 mint-bg-transparent hover:mint-bg-zinc-50 dark:hover:mint-bg-zinc-800";
} else if (variant === "ghost") {
styles = "hover:mint-bg-zinc-100 dark:hover:mint-bg-zinc-800";
}
return
{children}
;
}
function Input({id, label, value, onChange, placeholder, name}) {
return
{label}
;
}
function Select({label, value, onChange, options}) {
return
{label}
onChange(e.target.value)}>
{options.map(o =>
{o.name}
)}
;
}
function Toast({open, onClose, children}) {
useEffect(() => {
if (!open) return;
const t = setTimeout(onClose, 2200);
return () => clearTimeout(t);
}, [open, onClose]);
return ;
}
function Flows() {
const [route, setRoute] = useState("menu");
const [apps, setApps] = useState(loadApps());
const [cfg, setCfg] = useState(loadCfg());
const [selected, setSelected] = useState(apps[0]?.id || "");
const [toast, setToast] = useState(false);
const [bc] = useState(() => mkChannel());
useEffect(() => {
if (!apps.find(a => a.id === selected)) {
setSelected(apps[0]?.id || "");
}
}, [apps, selected]);
useEffect(() => {
const onMsg = e => {
const {type, payload} = e.data || ({});
switch (type) {
case "NAV":
setRoute(payload.route);
break;
case "SELECT":
setSelected(payload.appId);
break;
case "APPS_UPDATED":
setApps(loadApps());
break;
case "CFG_UPDATED":
setCfg(loadCfg());
setToast(true);
break;
default:
break;
}
};
bc.addEventListener("message", onMsg);
return () => bc.removeEventListener("message", onMsg);
}, [bc]);
const nav = nextRoute => {
setRoute(nextRoute);
bc.postMessage({
type: "NAV",
payload: {
route: nextRoute
}
});
};
const selectApp = appId => {
setSelected(appId);
bc.postMessage({
type: "SELECT",
payload: {
appId
}
});
};
const onCreate = name => {
const id = uid();
const next = [...apps, {
id,
name: name || "Sans titre"
}];
setApps(next);
saveApps(next);
bc.postMessage({
type: "APPS_UPDATED"
});
selectApp(id);
nav("integrate");
};
const onSaveCfg = (appId, data) => {
const next = {
...cfg,
[appId]: data
};
setCfg(next);
saveCfg(next);
setToast(true);
bc.postMessage({
type: "CFG_UPDATED"
});
};
return
{route === "menu" &&
nav("create")} onIntegrate={() => nav("integrate")} />}
{route === "create" && nav("menu")} onSave={onCreate} />}
{route === "integrate" && onSaveCfg(selected, data)} onCancel={() => nav("menu")} />}
setToast(false)}>
Successfully saved your changes.
;
}
function Menu({onCreate, onIntegrate}) {
return ;
}
function CreateForm({onSave, onCancel}) {
const [name, setName] = useState("");
return ;
}
function IntegrateForm({apps, selected, onSelect, saved, onSave, onCancel}) {
const [callbacks, setCallbacks] = useState(saved?.callbacks ?? "");
const [logouts, setLogouts] = useState(saved?.logouts ?? "");
const [origins, setOrigins] = useState(saved?.origins ?? "");
useEffect(() => {
setCallbacks(loadCfg()[selected]?.callbacks ?? "");
setLogouts(loadCfg()[selected]?.logouts ?? "");
setOrigins(loadCfg()[selected]?.origins ?? "");
}, [selected]);
return
Sélectionnez votre application
;
}
return
;
}
function SignUpFormInternal() {
return
Créez un{" "}
compte Auth0
{" "}
ou{" "}
console.log("log in")}>
connectez-vous
{" "}
à votre compte existant pour vous intégrer directement à votre propre tenant.
console.log("sign up")} className="bg-primary dark:bg-primary-light text-white dark:text-black px-4 py-2 rounded-md mt-4 font-medium" style={{
width: "140px"
}}>
S'inscrire
;
}
return <>;
};
export const SideMenuSectionItem = ({id, children}) => {
return ;
};
export const SideMenu = ({sections, children}) => {
const [visibleSection, setVisibleSection] = useState(sections[0]?.id ?? null);
const checkVisibility = () => {
let currentVisible = null;
const viewportHeight = window.innerHeight;
const scrollY = window.scrollY;
sections.forEach(({id}) => {
const section = document.getElementById(id);
if (section) {
const rect = section.getBoundingClientRect();
const sectionTop = rect.top + scrollY;
const sectionBottom = sectionTop + rect.height;
const multiplier = viewportHeight > 1600 ? 0.34 : 0.22;
if (scrollY + viewportHeight * multiplier >= sectionTop && scrollY <= sectionBottom) {
currentVisible = id;
}
}
});
if (currentVisible && currentVisible !== visibleSection) {
setVisibleSection(currentVisible);
}
};
useEffect(() => {
const throttledCheck = () => {
setTimeout(checkVisibility, 100);
};
checkVisibility();
window.addEventListener("scroll", throttledCheck);
return () => {
window.removeEventListener("scroll", throttledCheck);
};
}, [sections, visibleSection]);
useEffect(() => {
sections.forEach(({id}) => {
const section = document.getElementById(id);
const sideMenuItem = document.getElementById(`side-menu-item-${id}`);
if (section) {
if (id === visibleSection) {
section.classList.add("active-section");
} else {
section.classList.remove("active-section");
}
}
if (sideMenuItem) {
if (id === visibleSection) {
sideMenuItem.classList.add("active-side-menu-item");
} else {
sideMenuItem.classList.remove("active-side-menu-item");
}
}
});
}, [visibleSection, sections]);
return
{children.map(child => {
if (child.props.id === visibleSection) {
return child;
}
return null;
})}
;
};
export const Section = ({id, title, stepNumber, children, isSingleColumn = false}) => {
return
{}
{children}
;
};
export const Content = ({title, children}) => {
return
{title &&
{title} }
{children}
;
};
export const Recipe = ({children, isSingleColumn = false}) => {
return
{children}
;
};
Auth0 vous permet d'ajouter l'authentification et d'accéder aux renseignements du profil utilisateur dans votre application. Ce guide
explique comment intégrer Auth0 à une application Python [Django](https://www.djangoproject.com/) à l'aide du SDK [Authlib](https://authlib.org/).
Pour utiliser les services Auth0, vous devez avoir une application configurée dans le Auth0 Dashboard. L’application Auth0 est l’endroit où vous configurerez le fonctionnement de l’authentification pour le projet que vous développez.
### Configurer une application
Utilisez le sélecteur interactif pour créer une nouvelle application Auth0 ou sélectionner une application existante qui représente le projet que vous souhaitez intégrer. Chaque application dans Auth0 reçoit un client ID unique alphanumérique que le code de votre application utilisera pour appeler les API Auth0 au moyen du SDK.
Tous les paramètres que vous configurez à l’aide de ce Quickstart seront automatiquement mis à jour pour votre Application dans le [Dashboard](https://manage.auth0.com/dashboard/us/auth0-dsepaid/), où vous pourrez gérer vos Applications par la suite.
Si vous préférez explorer une configuration complète, vous pouvez plutôt consulter un exemple d’application.
### Configurer les URL de rappel
Une URL de rappel est une URL de votre application vers laquelle vous souhaitez qu’Auth0 redirige les utilisateurs après leur authentification. Si elle n’est pas définie, les utilisateurs ne seront pas redirigés vers votre application après s’être connectés.
Si vous suivez notre projet d’exemple, définissez cette valeur sur
`http://localhost:3000/callback`.
### Configurer les URL de déconnexion
Une URL de déconnexion est une URL de votre application vers laquelle vous souhaitez qu’Auth0 redirige les utilisateurs après leur déconnexion. Si elle n’est pas définie, les utilisateurs ne pourront pas se déconnecter de votre application et recevront une erreur.
Si vous suivez notre projet d’exemple, définissez cette valeur sur `http://localhost:3000`.
Pour cette intégration, vous ajouterez plusieurs dépendances, dont la bibliothèque Authlib. Créez un
fichier `requirements.txt` dans le répertoire de votre projet et incluez ce qui suit :
```text lines theme={null}
authlib ~= 1.0
django ~= 4.0
python-dotenv ~= 0.19
requests ~= 2.27
```
Exécutez la commande suivante dans votre shell afin que ces dépendances soient disponibles :
```text lines theme={null}
pip install -r requirements.txt
```
Ensuite, créez un fichier `.env` dans le répertoire de votre projet. Ce fichier contiendra les clés de votre client et d’autres
détails de configuration.
```text lines theme={null}
AUTH0_CLIENT_ID={yourClientId}
AUTH0_CLIENT_SECRET={yourClientSecret}
AUTH0_DOMAIN={yourDomain}
```
Si vous avez déjà configuré une application Django, passez à l’étape suivante. Pour un nouveau projet d’application, exécutez la
commande suivante :
```text lines theme={null}
django-admin startproject webappexample
```
Accédez au nouveau dossier du projet :
```text lines theme={null}
cd webappexample
```
Ouvrez le fichier `webappexample/settings.py` pour vérifier les valeurs de `.env`.
Au début du fichier, ajoutez les importations `os` et `dotenv`.
Ensuite, sous la définition de `BASE_DIR`, ajoutez la variable `TEMPLATE_DIR`.
Ensuite, repérez la variable `TEMPLATES` et mettez à jour la valeur `DIRS` pour y ajouter notre
chaîne `TEMPLATE_DIR`. Cela détermine le chemin des fichiers de gabarit, que vous créerez à une
étape ultérieure. Conservez tout autre contenu de ce tableau tel quel.
À la fin de ce fichier, ajoutez le code pour charger la configuration Auth0.
Pour commencer à créer votre application, ouvrez le fichier `webappexample/views.py` dans votre IDE.
Importez toutes les bibliothèques nécessaires à votre application.
Vous pouvez maintenant configurer Authlib pour gérer l’authentification de votre application avec Auth0.
Pour en savoir plus sur les options de configuration offertes par la méthode OAuth `register()` d’Authlib, consultez [sa documentation.](https://docs.authlib.org/en/latest/client/frameworks.html#using-oauth-2-0-to-log-in)
Dans cet exemple, vous ajouterez quatre routes à votre application : les routes login, callback, logout et index.
* `login` - Lorsque les visiteurs de votre application accèdent à la route `/login`, ils sont redirigés vers Auth0 pour
lancer le flux d’authentification.
* `callback` - Une fois que vos utilisateurs ont terminé de se connecter avec Auth0, ils reviennent à votre application
par la route `/callback`. Cette route enregistre la session de l’utilisateur et lui évite
d’avoir à se reconnecter lors de sa prochaine visite.
* `logout` - La route `/logout` déconnecte les utilisateurs de votre application. Cette route efface
la session de l’utilisateur dans votre application et redirige vers le point de terminaison de déconnexion d’Auth0 pour s’assurer que la session n’est plus
conservée. Ensuite, l’application redirige l’utilisateur vers votre route d’accueil.
* `index` - La route d’accueil affichera les détails d'un utilisateur authentifié ou permettra aux visiteurs de se connecter.
Remplacez le contenu de votre fichier `webappexample/urls.py` par le code à droite afin de relier
ces nouvelles routes.
Cela associera les routes `/login`, `/callback`, `/logout` et `/`
aux gestionnaires appropriés.
Ensuite, vous créerez un fichier de gabarit utilisé dans la route de la page d’accueil.
Créez un nouveau sous-répertoire nommé `templates` dans le dossier `webappexample`, puis créez
un fichier `index.html`.
Le fichier `index.html` contiendra le code du gabarit pour afficher les informations de l’utilisateur s’il est connecté, ou lui présenter
un bouton de connexion s’il est déconnecté.
Vous êtes prêt à lancer votre application ! Dans le répertoire de votre projet, ouvrez un shell et utilisez :
```text lines theme={null}
python3 manage.py migrate
python3 manage.py runserver 3000
```
Votre application devrait maintenant être prête à être ouverte depuis votre navigateur à l’adresse [http://localhost:3000](http://localhost:3000).
##### Checkpoint
Rendez-vous à l’adresse [http://localhost:3000](http://localhost:3000/) pour vérifier. Vous devriez y trouver un bouton de connexion qui redirige vers
Auth0 pour vous connecter, puis vous ramène à votre application pour voir les renseignements de votre profil.
## Prochaines étapes
Excellent travail ! Si vous avez suivi toutes les étapes jusqu'ici, vous devriez maintenant avoir la connexion, la déconnexion et les renseignements du profil utilisateur opérationnels dans votre application.
Ceci conclut notre tutoriel de démarrage rapide, mais il reste encore beaucoup à explorer. Pour en savoir plus sur ce que vous pouvez faire avec Auth0, consultez :
* [Auth0 Dashboard](https://manage.auth0.com/dashboard/us/dev-gja8kxz4ndtex3rq) - Apprenez à configurer et à gérer votre tenant Auth0 et vos applications
* [Auth0 Marketplace](https://marketplace.auth0.com/) - Découvrez les intégrations que vous pouvez activer pour étendre les fonctionnalités d’Auth0
```html webappexample/templates/index.html lines theme={null}
Auth0 Example
{% if session %}
Welcome {{session.userinfo.name}}!
Logout
{% else %}
Welcome Guest
Login
{% endif %}
```
```py webappexample/settings.py lines theme={null}
import os
from pathlib import Path
from dotenv import load_dotenv, find_dotenv
# Construire les chemins dans le projet comme ceci : BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMPLATE_DIR = os.path.join(BASE_DIR, "webappexample", "templates")
# ... other settings ...
TEMPLATES = [
{
# Laisser les autres lignes telles quelles ; on met seulement à jour `DIRS`.
"DIRS": [TEMPLATE_DIR],
},
]
# ... other settings ...
# Charger le fichier de définition d'environnement
ENV_FILE = find_dotenv()
if ENV_FILE:
load_dotenv(ENV_FILE)
# Charger les paramètres de l'application Auth0 en mémoire
AUTH0_DOMAIN = os.environ.get("AUTH0_DOMAIN")
AUTH0_CLIENT_ID = os.environ.get("AUTH0_CLIENT_ID")
AUTH0_CLIENT_SECRET = os.environ.get("AUTH0_CLIENT_SECRET")
```
```py webappexample/urls.py lines theme={null}
from django.urls import path
from . import views
urlpatterns = [
path("", views.index, name="index"),
path("login", views.login, name="login"),
path("logout", views.logout, name="logout"),
path("callback", views.callback, name="callback"),
]
```
```py webappexample/views.py highlight={1-18} lines theme={null}
import json
from authlib.integrations.django_client import OAuth
from django.conf import settings
from django.shortcuts import redirect, render, redirect
from django.urls import reverse
from urllib.parse import quote_plus, urlencode
oauth = OAuth()
oauth.register(
"auth0",
client_id=settings.AUTH0_CLIENT_ID,
client_secret=settings.AUTH0_CLIENT_SECRET,
client_kwargs={
"scope": "openid profile email",
},
server_metadata_url=f"https://{settings.AUTH0_DOMAIN}/.well-known/openid-configuration",
)
def login(request):
return oauth.auth0.authorize_redirect(
request, request.build_absolute_uri(reverse("callback"))
)
def callback(request):
token = oauth.auth0.authorize_access_token(request)
request.session["user"] = token
return redirect(request.build_absolute_uri(reverse("index")))
def logout(request):
request.session.clear()
return redirect(
f"https://{settings.AUTH0_DOMAIN}/v2/logout?"
+ urlencode(
{
"returnTo": request.build_absolute_uri(reverse("index")),
"client_id": settings.AUTH0_CLIENT_ID,
},
quote_via=quote_plus,
),
)
def index(request):
return render(
request,
"index.html",
context={
"session": request.session.get("user"),
"pretty": json.dumps(request.session.get("user"), indent=4),
},
)
```
```py webappexample/views.py highlight={1-18} lines theme={null}
import json
from authlib.integrations.django_client import OAuth
from django.conf import settings
from django.shortcuts import redirect, render, redirect
from django.urls import reverse
from urllib.parse import quote_plus, urlencode
oauth = OAuth()
oauth.register(
"auth0",
client_id=settings.AUTH0_CLIENT_ID,
client_secret=settings.AUTH0_CLIENT_SECRET,
client_kwargs={
"scope": "openid profile email",
},
server_metadata_url=f"https://{settings.AUTH0_DOMAIN}/.well-known/openid-configuration",
)
def login(request):
return oauth.auth0.authorize_redirect(
request, request.build_absolute_uri(reverse("callback"))
)
def callback(request):
token = oauth.auth0.authorize_access_token(request)
request.session["user"] = token
return redirect(request.build_absolute_uri(reverse("index")))
def logout(request):
request.session.clear()
return redirect(
f"https://{settings.AUTH0_DOMAIN}/v2/logout?"
+ urlencode(
{
"returnTo": request.build_absolute_uri(reverse("index")),
"client_id": settings.AUTH0_CLIENT_ID,
},
quote_via=quote_plus,
),
)
def index(request):
return render(
request,
"index.html",
context={
"session": request.session.get("user"),
"pretty": json.dumps(request.session.get("user"), indent=4),
},
)
```
```html webappexample/templates/index.html lines theme={null}
Auth0 Example
{% if session %}
Welcome {{session.userinfo.name}}!
Logout
{% else %}
Welcome Guest
Login
{% endif %}
```
```py webappexample/settings.py lines theme={null}
import os
from pathlib import Path
from dotenv import load_dotenv, find_dotenv
# Construire les chemins dans le projet comme ceci : BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMPLATE_DIR = os.path.join(BASE_DIR, "webappexample", "templates")
# ... other settings ...
TEMPLATES = [
{
# Laisser les autres lignes telles quelles ; on met seulement à jour `DIRS`.
"DIRS": [TEMPLATE_DIR],
},
]
# ... other settings ...
# Charger le fichier de définition d'environnement
ENV_FILE = find_dotenv()
if ENV_FILE:
load_dotenv(ENV_FILE)
# Charger les paramètres de l'application Auth0 en mémoire
AUTH0_DOMAIN = os.environ.get("AUTH0_DOMAIN")
AUTH0_CLIENT_ID = os.environ.get("AUTH0_CLIENT_ID")
AUTH0_CLIENT_SECRET = os.environ.get("AUTH0_CLIENT_SECRET")
```
```py webappexample/urls.py lines theme={null}
from django.urls import path
from . import views
urlpatterns = [
path("", views.index, name="index"),
path("login", views.login, name="login"),
path("logout", views.logout, name="logout"),
path("callback", views.callback, name="callback"),
]
```
```py webappexample/views.py highlight={20-52} lines theme={null}
import json
from authlib.integrations.django_client import OAuth
from django.conf import settings
from django.shortcuts import redirect, render, redirect
from django.urls import reverse
from urllib.parse import quote_plus, urlencode
oauth = OAuth()
oauth.register(
"auth0",
client_id=settings.AUTH0_CLIENT_ID,
client_secret=settings.AUTH0_CLIENT_SECRET,
client_kwargs={
"scope": "openid profile email",
},
server_metadata_url=f"https://{settings.AUTH0_DOMAIN}/.well-known/openid-configuration",
)
def login(request):
return oauth.auth0.authorize_redirect(
request, request.build_absolute_uri(reverse("callback"))
)
def callback(request):
token = oauth.auth0.authorize_access_token(request)
request.session["user"] = token
return redirect(request.build_absolute_uri(reverse("index")))
def logout(request):
request.session.clear()
return redirect(
f"https://{settings.AUTH0_DOMAIN}/v2/logout?"
+ urlencode(
{
"returnTo": request.build_absolute_uri(reverse("index")),
"client_id": settings.AUTH0_CLIENT_ID,
},
quote_via=quote_plus,
),
)
def index(request):
return render(
request,
"index.html",
context={
"session": request.session.get("user"),
"pretty": json.dumps(request.session.get("user"), indent=4),
},
)
```
```html webappexample/templates/index.html lines theme={null}
Auth0 Example
{% if session %}
Welcome {{session.userinfo.name}}!
Logout
{% else %}
Welcome Guest
Login
{% endif %}
```
```py webappexample/settings.py lines theme={null}
import os
from pathlib import Path
from dotenv import load_dotenv, find_dotenv
# Construire les chemins dans le projet comme ceci : BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMPLATE_DIR = os.path.join(BASE_DIR, "webappexample", "templates")
# ... other settings ...
TEMPLATES = [
{
# Laisser les autres lignes telles quelles ; on met seulement à jour `DIRS`.
"DIRS": [TEMPLATE_DIR],
},
]
# ... other settings ...
# Charger le fichier de définition d'environnement
ENV_FILE = find_dotenv()
if ENV_FILE:
load_dotenv(ENV_FILE)
# Charger les paramètres de l'application Auth0 en mémoire
AUTH0_DOMAIN = os.environ.get("AUTH0_DOMAIN")
AUTH0_CLIENT_ID = os.environ.get("AUTH0_CLIENT_ID")
AUTH0_CLIENT_SECRET = os.environ.get("AUTH0_CLIENT_SECRET")
```
```py webappexample/urls.py lines theme={null}
from django.urls import path
from . import views
urlpatterns = [
path("", views.index, name="index"),
path("login", views.login, name="login"),
path("logout", views.logout, name="logout"),
path("callback", views.callback, name="callback"),
]
```
```py webappexample/urls.py lines theme={null}
from django.urls import path
from . import views
urlpatterns = [
path("", views.index, name="index"),
path("login", views.login, name="login"),
path("logout", views.logout, name="logout"),
path("callback", views.callback, name="callback"),
]
```
```html webappexample/templates/index.html lines theme={null}
Auth0 Example
{% if session %}
Welcome {{session.userinfo.name}}!
Logout
{% else %}
Welcome Guest
Login
{% endif %}
```
```py webappexample/settings.py lines theme={null}
import os
from pathlib import Path
from dotenv import load_dotenv, find_dotenv
# Construire les chemins dans le projet comme ceci : BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMPLATE_DIR = os.path.join(BASE_DIR, "webappexample", "templates")
# ... other settings ...
TEMPLATES = [
{
# Laisser les autres lignes telles quelles ; on met seulement à jour `DIRS`.
"DIRS": [TEMPLATE_DIR],
},
]
# ... other settings ...
# Charger le fichier de définition d'environnement
ENV_FILE = find_dotenv()
if ENV_FILE:
load_dotenv(ENV_FILE)
# Charger les paramètres de l'application Auth0 en mémoire
AUTH0_DOMAIN = os.environ.get("AUTH0_DOMAIN")
AUTH0_CLIENT_ID = os.environ.get("AUTH0_CLIENT_ID")
AUTH0_CLIENT_SECRET = os.environ.get("AUTH0_CLIENT_SECRET")
```
```py webappexample/views.py highlight={1-18} lines theme={null}
import json
from authlib.integrations.django_client import OAuth
from django.conf import settings
from django.shortcuts import redirect, render, redirect
from django.urls import reverse
from urllib.parse import quote_plus, urlencode
oauth = OAuth()
oauth.register(
"auth0",
client_id=settings.AUTH0_CLIENT_ID,
client_secret=settings.AUTH0_CLIENT_SECRET,
client_kwargs={
"scope": "openid profile email",
},
server_metadata_url=f"https://{settings.AUTH0_DOMAIN}/.well-known/openid-configuration",
)
def login(request):
return oauth.auth0.authorize_redirect(
request, request.build_absolute_uri(reverse("callback"))
)
def callback(request):
token = oauth.auth0.authorize_access_token(request)
request.session["user"] = token
return redirect(request.build_absolute_uri(reverse("index")))
def logout(request):
request.session.clear()
return redirect(
f"https://{settings.AUTH0_DOMAIN}/v2/logout?"
+ urlencode(
{
"returnTo": request.build_absolute_uri(reverse("index")),
"client_id": settings.AUTH0_CLIENT_ID,
},
quote_via=quote_plus,
),
)
def index(request):
return render(
request,
"index.html",
context={
"session": request.session.get("user"),
"pretty": json.dumps(request.session.get("user"), indent=4),
},
)
```
```html webappexample/templates/index.html lines theme={null}
Auth0 Example
{% if session %}
Welcome {{session.userinfo.name}}!
Logout
{% else %}
Welcome Guest
Login
{% endif %}
```
```py webappexample/settings.py lines theme={null}
import os
from pathlib import Path
from dotenv import load_dotenv, find_dotenv
# Construire les chemins dans le projet comme ceci : BASE_DIR / 'subdir'.
BASE_DIR = Path(__file__).resolve().parent.parent
TEMPLATE_DIR = os.path.join(BASE_DIR, "webappexample", "templates")
# ... other settings ...
TEMPLATES = [
{
# Laisser les autres lignes telles quelles ; on met seulement à jour `DIRS`.
"DIRS": [TEMPLATE_DIR],
},
]
# ... other settings ...
# Charger le fichier de définition d'environnement
ENV_FILE = find_dotenv()
if ENV_FILE:
load_dotenv(ENV_FILE)
# Charger les paramètres de l'application Auth0 en mémoire
AUTH0_DOMAIN = os.environ.get("AUTH0_DOMAIN")
AUTH0_CLIENT_ID = os.environ.get("AUTH0_CLIENT_ID")
AUTH0_CLIENT_SECRET = os.environ.get("AUTH0_CLIENT_SECRET")
```
```py webappexample/urls.py lines theme={null}
from django.urls import path
from . import views
urlpatterns = [
path("", views.index, name="index"),
path("login", views.login, name="login"),
path("logout", views.logout, name="logout"),
path("callback", views.callback, name="callback"),
]
```
```py webappexample/views.py highlight={1-18} lines theme={null}
import json
from authlib.integrations.django_client import OAuth
from django.conf import settings
from django.shortcuts import redirect, render, redirect
from django.urls import reverse
from urllib.parse import quote_plus, urlencode
oauth = OAuth()
oauth.register(
"auth0",
client_id=settings.AUTH0_CLIENT_ID,
client_secret=settings.AUTH0_CLIENT_SECRET,
client_kwargs={
"scope": "openid profile email",
},
server_metadata_url=f"https://{settings.AUTH0_DOMAIN}/.well-known/openid-configuration",
)
def login(request):
return oauth.auth0.authorize_redirect(
request, request.build_absolute_uri(reverse("callback"))
)
def callback(request):
token = oauth.auth0.authorize_access_token(request)
request.session["user"] = token
return redirect(request.build_absolute_uri(reverse("index")))
def logout(request):
request.session.clear()
return redirect(
f"https://{settings.AUTH0_DOMAIN}/v2/logout?"
+ urlencode(
{
"returnTo": request.build_absolute_uri(reverse("index")),
"client_id": settings.AUTH0_CLIENT_ID,
},
quote_via=quote_plus,
),
)
def index(request):
return render(
request,
"index.html",
context={
"session": request.session.get("user"),
"pretty": json.dumps(request.session.get("user"), indent=4),
},
)
```
Créez un{" "}
compte Auth0
{" "}
ou{" "}
console.log("log in")}>
connectez-vous
{" "}
à votre compte existant pour vous intégrer directement à votre propre tenant.