Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Browser History Demo</title> | |
| <style> | |
| body { font-family: sans-serif; text-align: center; margin-top: 50px; } | |
| code { background-color: #eee; padding: 3px 5px; border-radius: 4px; } | |
| .warning { color: red; font-weight: bold; } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Browser History API Demonstration</h1> | |
| <p> | |
| The script on this page can see the number of pages in your | |
| <strong>current tab's session history</strong>. | |
| </p> | |
| <h2>Number of pages in this tab's session: <span id="history-length"></span></h2> | |
| <p class="warning"> | |
| NOTICE: This script CANNOT see the actual URLs of the pages you have visited. | |
| <br> | |
| Accessing that information is blocked by the browser for your privacy. | |
| </p> | |
| <button onclick="history.back()">Go Back</button> | |
| <script> | |
| // Get the element where we will display the history length | |
| const historyLengthElement = document.getElementById('history-length'); | |
| // Access the history.length property and display it | |
| // This is SAFE and does not reveal any private information. | |
| historyLengthElement.textContent = window.history.length; | |
| // The following code is IMPOSSIBLE and will NOT work. | |
| // It is just an example of what browsers prevent. | |
| /* | |
| for (let i = 0; i < history.length; i++) { | |
| // This line would cause a security error if it were possible. | |
| // You CANNOT get the URL from a history entry. | |
| console.log(history.item(i)); // This doesn't exist | |
| console.log(history[i]); // This doesn't work | |
| } | |
| */ | |
| </script> | |
| </body> | |
| </html> |