Documentation Index Fetch the complete documentation index at: https://docs.getmilana.ai/llms.txt
Use this file to discover all available pages before exploring further.
React
JavaScript
Script Tag
Wrap your app with MilanaProvider to initialize recording automatically on mount: import { MilanaProvider } from "milana-js/react" ;
function App () {
return (
< MilanaProvider
productId = "prd_YOUR_PRODUCT_ID"
clientKey = "key_YOUR_CLIENT_KEY"
sessionInfo = { {
environment: "production" ,
version: "1.0.0" ,
} }
>
< YourApp />
</ MilanaProvider >
);
}
With options < MilanaProvider
productId = "prd_YOUR_PRODUCT_ID"
clientKey = "key_YOUR_CLIENT_KEY"
sessionInfo = { {
environment: "production" ,
version: "1.0.0" ,
metadata: {
plan: "enterprise" ,
region: "us-east" ,
},
} }
options = { {
shouldRecordCanvas: false ,
privacy: {
blockClass: "milana-block" ,
maskTextClass: "milana-mask" ,
maskInputTypes: {
password: true ,
tel: true ,
},
},
} }
>
< YourApp />
</ MilanaProvider >
Deferred initialization To gate Milana behind a feature flag, use deferred initialization. See the Feature-flagged Rollout guide for a complete walkthrough. import { init } from "milana-js" ;
await init ( "prd_YOUR_PRODUCT_ID" , "key_YOUR_CLIENT_KEY" , {
environment: "production" ,
version: "1.0.0" ,
});
With options import { init } from "milana-js" ;
await init (
"prd_YOUR_PRODUCT_ID" ,
"key_YOUR_CLIENT_KEY" ,
{
environment: "production" ,
version: "1.0.0" ,
metadata: {
plan: "enterprise" ,
region: "us-east" ,
},
},
{
shouldRecordCanvas: false ,
privacy: {
blockClass: "milana-block" ,
maskTextClass: "milana-mask" ,
maskInputTypes: {
password: true ,
tel: true ,
},
},
}
);
Deferred initialization To roll out Milana gradually or target specific user segments/flows, see the Feature-flagged Rollout guide. < script >
window . _milanaQueue = window . _milanaQueue || [];
function Milana () { window . _milanaQueue . push ([]. slice . call ( arguments )); }
</ script >
< script async src = "https://cdn.getmilana.ai/milana.js" ></ script >
< script >
Milana ( "init" , "prd_YOUR_PRODUCT_ID" , "key_YOUR_CLIENT_KEY" , {
environment: "production" ,
version: "1.0.0" ,
});
</ script >
With options Milana ( "init" , "prd_YOUR_PRODUCT_ID" , "key_YOUR_CLIENT_KEY" ,
{
environment: "production" ,
version: "1.0.0" ,
metadata: {
plan: "enterprise" ,
region: "us-east" ,
},
},
{
shouldRecordCanvas: false ,
privacy: {
blockClass: "milana-block" ,
maskTextClass: "milana-mask" ,
maskInputTypes: {
password: true ,
tel: true ,
},
},
}
);
Checking the result Enable debug mode from your browser console to see session state, then reload the page: localStorage . setItem ( "milana_debug_mode" , "true" );
// Reload, then check the console for "Milana:" log messages
To disable, run localStorage.removeItem("milana_debug_mode") and reload.
Parameters
Your Milana product ID. Find it on your Settings page. Must start with prd_ and be exactly 30 characters long. Passing an invalid product ID throws an error and prevents initialization.
Your Milana client key. Must start with key_. Find it on your Settings page alongside your product ID.
Session-level information sent with every recording. Show SessionInfo properties
The environment your app is running in, for example "production" or "staging". Used to filter sessions in the dashboard.
Your application’s release version, for example "1.0.0". Visible on session detail pages and available in AI queries.
Any additional key-value pairs to attach to the session at the start. Values can be any JSON-serializable type.
Optional configuration. All fields are optional. options.endpoint
string
default: "https://in.getmilana.ai"
Override the default ingest endpoint. Only change this if instructed by Milana support.
options.shouldRecordCanvas
Enable recording of <canvas> elements. Increases payload size; enable only when canvas content is critical to your analysis.
options.shouldRecordCrossOriginIframes
Enable recording inside cross-origin iframes. Same-origin iframes are recorded automatically. You must also call initCrossOriginIframe() from within each cross-origin iframe. See iframe Recording . options.disableContentEditableRecording
Disable recording of contenteditable elements. Enable this if you use a rich-text editor and do not want its content captured.
shouldDeferInitialization
React only. Skip auto-initialization on mount. Call initialize() from useMilana() later to trigger initialization manually.
Return value
true if the session started and was included in the current sampling rate. false if the session was not sampled, the credentials were invalid, or a network error occurred. Your application is not affected either way — a false result simply means no data will be recorded for this session.