Last active
February 2, 2023 04:15
-
-
Save exprodrigues/18a1a4838056723231db5fed10cb10a8 to your computer and use it in GitHub Desktop.
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
| <?php | |
| if (isset($_GET['seek'])) { | |
| $seek = $_GET['seek']; | |
| $lines = []; | |
| $handle = fopen('error_log', 'rb'); | |
| if ($seek > 0) { | |
| fseek($handle, $seek); | |
| } | |
| while (($line = fgets($handle, 4096)) !== false) { | |
| $lines[] = $line; | |
| } | |
| $seek = ftell($handle); | |
| header("Content-Type: application/json"); | |
| echo json_encode(['seek' => $seek, 'lines' => $lines]); | |
| exit(); | |
| } | |
| ?><!DOCTYPE html> | |
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <title>Logs</title> | |
| <style type="text/css"> | |
| body { | |
| margin: 0; | |
| padding: 0; | |
| } | |
| #app { | |
| font-family: monospace; | |
| font-size: 12px; | |
| white-space: pre-wrap; | |
| color: #333; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="app"> | |
| <div v-for="line in lines">{{ line }}</div> | |
| </div> | |
| <script src="https://unpkg.com/vue/dist/vue.min.js"></script> | |
| <script src="https://unpkg.com/axios/dist/axios.min.js"></script> | |
| <script> | |
| const app = new Vue({ | |
| el: '#app', | |
| data: { | |
| lines: [], | |
| seek: 0 | |
| }, | |
| mounted () { | |
| this.load(); | |
| setInterval(this.load, 3000); | |
| }, | |
| methods: { | |
| load () { | |
| axios.get(`logs.php?seek=${this.seek}`) | |
| .then(response => { | |
| this.lines = [...response.data.lines.reverse(), ...this.lines]; | |
| this.seek = response.data.seek; | |
| }); | |
| } | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
don't hardcode the name
logs.php, make the code name-independent, replace line 60 withaxios.get(`?seek=${this.seek}`), and the browser will fill in the blanks, wether it belogs.phporphp-tail-log.php(as is the name of this paste), oranythingelse.php.furthermore, don't use setInterval for this - if you're on a slow connection, and use setInterval, it will start downloading several copies of the same logs simultaneously! (if its slow enough, will keep doing this until you reach the browser's max socket limit!) - call it once to start it, and have it make a setTimeout() for itself.