Connect to numera service
Connect to a Numera Service
Configure UI to allow requests
To enable the Numera UI to make requests to a backend service, you'll need to configure both environment variables and security headers.
1. Add the Service's Base URL
Each service must have its (environment-specific) base URL defined in the Numera UI's environment variables. Follow the steps outlined in the Environment Variables guide to add this.
2. Update the Content Security Policy (CSP)
Because of the browser’s Content-Security-Policy (CSP), the service's base URL must also be explicitly allowed.
To do this:
- Add the service's base URL to the
connect-srcdirective of the CSP header. - This is configured in the CloudFront Security Headers Behavior section.
You can find this configuration in the NumeraUi stack in the infrastructure repository:
View source
Setup React Query
If your query client is generated using orval, follow these steps to integrate it with the Numera UI:
- Install the generated client as a dependency
- Add the services base Url to the
baseUrlConfig - Pass the service configuration as
HttpInstanceto theconfigureHttpInstancesfunction inapp.tsx.