admin管理员组

文章数量:1289828

Question edited:

I'm working on an alternative to iframes because WP balks at them and tends to reject plugins that have them (I know this from experience) So, here's the code I have to try to replace an iframe:

add_action('wp_ajax_myAction', array($this, 'myAction_ajax_handler'));
public function myAction_ajax_handler() {
   echo time();
   wp_die();
}

When the admin page is displayed, I have this:

   echo '<body onLoad="loadDoc();">';
   echo '<div id=myDiv></div>';
   ?>
        <script>
            function loadDoc() {
                var xhttp = new XMLHttpRequest();
                xhttp.onreadystatechange = function () {
                    if (this.readyState == 4 && this.status == 200) {
                        document.getElementById("myDiv").innerHTML = this.responseText;
                    }
                };
                xhttp.open("GET", ajaxurl + "?action=myAction", true);
                xhttp.send();
                setTimeout("loadDoc()", 1000);
            }
        </script>
     <?php

It works.

Here's my questions.

Is this the proper way to do this?

Is there a better way to do this instead of polling with setTimeout?

Thanks!

Question edited:

I'm working on an alternative to iframes because WP balks at them and tends to reject plugins that have them (I know this from experience) So, here's the code I have to try to replace an iframe:

add_action('wp_ajax_myAction', array($this, 'myAction_ajax_handler'));
public function myAction_ajax_handler() {
   echo time();
   wp_die();
}

When the admin page is displayed, I have this:

   echo '<body onLoad="loadDoc();">';
   echo '<div id=myDiv></div>';
   ?>
        <script>
            function loadDoc() {
                var xhttp = new XMLHttpRequest();
                xhttp.onreadystatechange = function () {
                    if (this.readyState == 4 && this.status == 200) {
                        document.getElementById("myDiv").innerHTML = this.responseText;
                    }
                };
                xhttp.open("GET", ajaxurl + "?action=myAction", true);
                xhttp.send();
                setTimeout("loadDoc()", 1000);
            }
        </script>
     <?php

It works.

Here's my questions.

Is this the proper way to do this?

Is there a better way to do this instead of polling with setTimeout?

Thanks!

Share Improve this question edited Jun 25, 2021 at 14:45 uPrompt asked Jun 11, 2021 at 17:45 uPromptuPrompt 1729 bronze badges 4
  • In terms of web technologies there's also websockets you could use to stream the log, but that would also need script on the page to handle new data and add it to the log on the page. (There's an old discussion here about how Apache can't do websockets, but I assume that's out of date.) – Rup Commented Jun 13, 2021 at 9:05
  • What about server sent events? Will those work within a wp plugin admin panel? – uPrompt Commented Jun 14, 2021 at 12:59
  • Server sent events with websockets? Yes, everything sent over the web socket will come from the server. I'm not sure what you're asking? – Rup Commented Jun 14, 2021 at 13:00
  • Oops... Dup: Acceptable WP iframe alternative – bosco Commented Jun 26, 2021 at 20:05
Add a comment  | 

1 Answer 1

Reset to default 1

Use JavaScript to poll for new data at an interval and update the DOM as it comes in. Downloading the complete log file at intervals would be very inefficient and quite likely consume a huge amount of bandwidth. Instead, use some server-side code to determine if new data is available and if so return that in the response.

For instance, the client could send some information about the last lines it received - say the time at which it last received new data, and the largest line number it already has. The server can then check if the file's modified time is greater than the time at which the client last received data, and if so, open the file and send any new lines to the client.

WordPress's AJAX handlers would be a fine way to implement the JS<=>WordPress communications. The Plugin Handbook's page on AJAX, and the Codex's "AJAX in Plugins" page are good places to start.

The Mozilla Developer Network has a nice intro on DOM manipulation via JS (among many other guides), but otherwise the subject matter in isolation is outside the scope of this Stack.

本文标签: pluginsWPorg acceptable iframe alternative