This project demonstrates secure communication between a Next.js frontend and a FastAPI backend using Azure Key Vault to manage application secrets. This setup uses client secrets, managed by Azure Key Vault, and JWT tokens to ensure secure interactions between the frontend and backend, without requiring user-specific authentication.

• Overview
• Architecture
• Requirements
• Setup
  • Azure Setup
  • Local Setup
• Usage
• Detailed Explanation
  • Concepts
  • Packages
  • Security Practices
• Contributing
• License

1. Azure Key Vault: Securely stores application secrets.
2. FastAPI: Python-based backend framework for building APIs.
3. Next.js: React-based frontend framework for building server-rendered applications.

• Azure Subscription
• Node.js and npm
• Python 3.6+ and pip
• Azure CLI

1. Login to Azure

   az login

2. Create Azure Key Vault

   az keyvault create --name <YourKeyVaultName> --resource-group <YourResourceGroupName> --location <YourLocation>

3. Add Secrets to Key Vault

   az keyvault secret set --vault-name <YourKeyVaultName> --name "SECRET_KEY" --value "<YourSecretKeyValue>"
   az keyvault secret set --vault-name <YourKeyVaultName> --name "CLIENT_SECRET" --value "<YourClientSecret>"
   az keyvault secret set --vault-name <YourKeyVaultName> --name "AZURE_CLIENT_ID" --value "<YourClientId>"
   az keyvault secret set --vault-name <YourKeyVaultName> --name "AZURE_TENANT_ID" --value "<YourTenantId>"

4. Set Access Policies

   az keyvault set-policy --name <YourKeyVaultName> --spn <appId> --secret-permissions get list

1. Clone the repository

   git clone https://github.com/yoanad/azure-auth-mvp.git
   cd azure-auth-mvp

2. Backend Setup

   • Navigate to the backend directory

     cd backend

   • Create a virtual environment

     python3 -m venv env
     source env/bin/activate

   • Install dependencies

     pip install -r requirements.txt

   • Create a .env file and add the following

     AZURE_KEY_VAULT_URL=https://<your-key-vault-name>.vault.azure.net/
     AZURE_CLIENT_ID=<your-app-id>
     AZURE_CLIENT_SECRET=<your-client-secret>
     AZURE_TENANT_ID=<your-tenant-id>
     

   • Run the FastAPI server

     uvicorn main:app --reload

3. Frontend Setup

   • Navigate to the frontend directory

     cd frontend

   • Install dependencies

     npm install

   • Create a .env.local file and add the following

     NEXT_PUBLIC_API_BASE_URL=https://127.0.0.1:8000
     NEXT_PUBLIC_CLIENT_SECRET=<your-client-secret>
     

   • Run the Next.js server

     npm run dev

1. Navigate to https://localhost:3000.
2. You should see the registration form. Fill out the form to register a new user.
3. The backend will use JWTs and manage secrets using Azure Key Vault.

JSON Web Tokens (JWTs): JWTs are a compact, URL-safe means of representing claims to be transferred between two parties. JWTs are often used in the context of authentication and authorization.

HTTP Cookies: An HTTP cookie is a small piece of data sent from a server to the user's web browser. The browser stores the cookie and sends it back with the next request to the same server.

Token Rotation: Token rotation involves regularly updating tokens to ensure security. This typically includes short-lived access tokens and long-lived refresh tokens.

Azure Key Vault: Azure Key Vault helps safeguard cryptographic keys and secrets used by cloud applications and services. By using Key Vault, you can securely store and tightly control access to tokens, passwords, certificates, API keys, and other secrets.

1. FastAPI: A modern, fast web framework for building APIs.
2. Uvicorn: A lightning-fast ASGI server.
3. Python-JOSE: Provides JWT encoding and decoding capabilities.
4. Python-Dotenv: Reads .env files and sets environment variables.
5. Azure-Identity: Provides Azure Active Directory tokens.
6. Azure-Keyvault-Secrets: Provides access to secrets in Azure Key Vault.

1. Next.js: A React-based framework for server-side rendering.
2. Axios: A promise-based HTTP client.
3. Js-Cookie: A simple, lightweight library for handling cookies.

Use of Azure Key Vault: All secrets are stored and managed within Azure Key Vault to ensure they remain secure. JWT Tokens: Secure access and refresh tokens are used for authenticating users. Environment Variables: Sensitive information is stored in environment variables to prevent exposure. CORS Configuration: Proper CORS configuration ensures that only allowed origins can access the backend.

This project is licensed under the MIT License.