Last active
March 2, 2024 12:23
-
-
Save wellwind/f3b9c668a02c1449f7e320b35fbbc893 to your computer and use it in GitHub Desktop.
FaroWebSDK from CDN
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<title>My App</title> | |
<script> | |
(async function () { | |
const faroLoaded = () => { | |
const faro = window.GrafanaFaroWebSdk.faro; | |
const { trace, context } = faro.api.getOTEL(); | |
const input = { | |
traceparent: "00-0af7651916cd43dd8448eb211c80319c-b7ad6b7169203331-01", | |
}; | |
let activeContext = propagation.extract(context.active(), input); | |
let tracer = trace.getTracer("app-name"); | |
let span = tracer.startSpan( | |
'spanName', | |
{ | |
attributes: {}, | |
}, | |
activeContext | |
); | |
// Set the created span as active in the deserialized context. | |
trace.setSpan(activeContext, span); | |
span.end(); | |
// faro.api | |
// .getOTEL() | |
// ?.trace.getTracer("QQQQQ") | |
// .startActiveSpan("mike-span", (span) => { | |
// setTimeout(() => { | |
// console.log("end"); | |
// span.end(); | |
// }, 3000); | |
// }); | |
}; | |
const loadScript = async (path) => { | |
return new Promise((resolve, reject) => { | |
var script = document.createElement("script"); | |
script.src = path; | |
script.onload = resolve; | |
script.onerror = reject; | |
document.head.appendChild(script); | |
}); | |
}; | |
await loadScript("faro-web-sdk.iife.min.js"); | |
window.GrafanaFaroWebSdk.initializeFaro({ | |
url: "https://faro-collector-prod-ap-southeast-1.grafana.net/collect/d002b93ec5eb29d3eb7c78819a987811", | |
app: { | |
name: "grafana_faro", | |
version: "1.0.0", | |
environment: "production", | |
}, | |
}); | |
await loadScript("faro-web-tracing.iife.min.js"); | |
window.GrafanaFaroWebSdk.faro.instrumentations.add( | |
new window.GrafanaFaroWebTracing.TracingInstrumentation() | |
); | |
faroLoaded(); | |
})(); | |
</script> | |
</head> | |
<body> | |
hello world | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment