You need two app registrations: one for the frontend SPA and one for the backend confidential client.
- Go to Azure Portal → App Registrations → New registration
- Name:
QueryPal Frontend, Platform: Single-page application - Redirect URI:
http://localhost:5173(dev) / your production URL - Note the Application (client) ID and Directory (tenant) ID
- New registration — Name:
QueryPal Backend, Client type: Confidential client - Add a client secret under Certificates & secrets
- Expose an API:
- Application ID URI:
api://<backend-client-id> - Add scope:
access_as_user - Add the frontend app as an authorized client application
- Application ID URI:
Microsoft Graph→User.ReadAzure Service Management→user_impersonation- Grant admin consent for your organization
Grant the backend application read access to your Cosmos DB account:
- Go to your Cosmos DB account → Access control (IAM)
- Add role assignment:
- Role:
Cosmos DB Account Reader Role - Assign to: your backend app registration (service principal)
- Role:
Update frontend/authConfig.ts:
export const msalConfig = {
auth: {
clientId: "your-frontend-client-id",
authority: "https://login.microsoftonline.com/your-tenant-id",
redirectUri: "http://localhost:5173",
},
};
export const loginRequest = {
scopes: ["User.Read", "api://your-backend-client-id/access_as_user"],
};AZURE_TENANT_ID=your_tenant_id
AZURE_CLIENT_ID=your_backend_client_id
AZURE_CLIENT_SECRET=your_client_secret
ARM_SCOPE=https://management.azure.com/.defaultIn production these are sourced from GCP Secret Manager — see INFRASTRUCTURE.md.