Browser
ByteHide Logger works in all modern browsers with console logging capabilities. File logging is not available in browser environments.
Installation
Via CDN
HTML
<script src="https://cdn.jsdelivr.net/npm/@bytehide/logger@latest/dist/browser.min.js"></script><script src="https://cdn.jsdelivr.net/npm/@bytehide/logger@latest/dist/browser.min.js"></script>Via npm
Bash
npm install @bytehide/loggernpm install @bytehide/loggerJavaScript
import { Log } from '@bytehide/logger';import { Log } from '@bytehide/logger';Basic Setup
JavaScript
// Configure logger
Log.configure({
projectToken: 'your-project-token',
logLevel: 'info',
consoleOutput: true
});
// Start logging
Log.info('Application loaded');// Configure logger
Log.configure({
projectToken: 'your-project-token',
logLevel: 'info',
consoleOutput: true
});
// Start logging
Log.info('Application loaded');Browser-Specific Features
User Session Tracking
JavaScript
Log.identify(userId, userEmail);
Log.info('User action performed', {
context: { action: 'button-click', page: window.location.pathname }
});Log.identify(userId, userEmail);
Log.info('User action performed', {
context: { action: 'button-click', page: window.location.pathname }
});Error Handling
JavaScript
window.addEventListener('error', (event) => {
Log.error('Unhandled error occurred', {
context: {
filename: event.filename,
lineno: event.lineno,
colno: event.colno
}
}, event.error);
});window.addEventListener('error', (event) => {
Log.error('Unhandled error occurred', {
context: {
filename: event.filename,
lineno: event.lineno,
colno: event.colno
}
}, event.error);
});React Integration
JavaScript
import { Log } from '@bytehide/logger';
function App() {
useEffect(() => {
Log.configure({
projectToken: process.env.REACT_APP_BYTEHIDE_TOKEN
});
}, []);
const handleClick = () => {
Log.info('Button clicked', {
context: { component: 'App', action: 'click' }
});
};
return <button onClick={handleClick}>Click me</button>;
}import { Log } from '@bytehide/logger';
function App() {
useEffect(() => {
Log.configure({
projectToken: process.env.REACT_APP_BYTEHIDE_TOKEN
});
}, []);
const handleClick = () => {
Log.info('Button clicked', {
context: { component: 'App', action: 'click' }
});
};
return <button onClick={handleClick}>Click me</button>;
}Limitations
Browser Limitations
- No file logging: Browsers cannot write to the file system
- Console only: All logs output to browser console
- Network requests: Logs are sent to ByteHide cloud service
- CORS considerations: Ensure proper CORS configuration