report-from-website is a pure JavaScript library that allows you to capture essential state information (like the URL, user agent, timestamp) and send it to a backend API. It's typically used for error reporting or logging user activity in the background.
The library is designed to be easy to use and can be integrated into any web project (including Angular, React, or plain HTML).
- Capture the current URL of the page.
- Capture the user agent (browser details).
- Capture a timestamp of when the report is triggered.
- Send data to a custom endpoint via a POST request.
- Capture a screenshot of the current page using html2canvas.
To include this library in your project, you can either download the raw JavaScript file or install it via npm (if published).
- Download
report-from-website.jsfrom the dist/ folder and include it in your project.
npm install report-from-website<script src="path/to/report-from-website.js"></script>import ReportFromWebsite from 'report-from-website'; // If installed via npm
// Initialize the report functionality
const report = new ReportFromWebsite('#reportButton', '/custom/log'); // URL is optionalAdd a button to your HTML that will trigger the report:
<button id="reportButton">Send a Report</button>When the button is clicked, the library will send the data to the provided URL (default is /error/log). You can replace the default URL with any custom endpoint.
HTML Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Report From Website Example</title>
<script src="path/to/report-from-website.js"></script> <!-- Library script -->
</head>
<body>
<button id="reportButton">Send a Report</button>
<script>
// Initialize the library with the button selector and optional URL for reporting
const report = new ReportFromWebsite('#reportButton', 'https://yourwebsite.com/error/log');
</script>
</body>
</html>const express = require('express');
const app = express();
const port = 3000;
app.use(express.json({ limit: '50mb' })); // Ekran görüntüsünün büyük olabileceğini dikkate alarak
app.post('/error/log', (req, res) => {
console.log('Received report data:', req.body); // Gelen veriyi kontrol et
// Eğer screenshot varsa, base64 resmini işleyebilirsiniz (örneğin kaydedebilir ya da işleyebilirsiniz)
if (req.body.screenshot) {
console.log('Screenshot data received:', req.body.screenshot);
}
res.status(200).json({ message: 'Report received successfully!' });
});
app.listen(port, () => {
console.log(`Server running at http://localhost:${port}`);
});MIT License. See LICENSE for more information.
Contributions are welcome! Please fork this repository, make changes, and submit a pull request.
Feel free to reach out if you have any questions or need support. Thank you for using report-from-website!