Best way to redirect a page after javascript tracking code has executed

Question

I'm looking for the best way (and also simplest if different) to accomplish this in Drupal 7.

• Users arriving at example.com/special-redirect should be redirected quickly to example.com/newpage

• Nothing needs to be rendered, but before they are redirected to the new URL on our site, I need to make sure our JS tracking script is executed.

• the tracking script is currently loaded into the header from the theme.info file, and needs to run on every page of the site.

I assume that the URL redirect module won't accomplish this (ie. never loads the page).

I'm thinking I have to rely on the javascript method of putting this somewhere:

   <script type="text/javascript">
        window.location = "http://www.yoururl.com";
   </script>

But I'm not sure where I should put this (or a modified one) on the site. It's just for the one page, but would putting it in the html.tpl.php file with and if statement for the NodeID work? I'm also open to moving the tracking script if it makes sense to.

thanks for any advice

Answer 1

You can do something like below:

1. Create a custom module, If not already created (read more).
2. In your custom module, define a custom callback using hook_menu, and add a page callback.
3. In page callback function simply 'echo "script file/code"'. This will prevent Drupal from rendering various template files in your callback. NOTE:* If you use return instead of echo, Drupal will start rendering template files.
4. In your .JS file/code, do required tracking and re-direct user to another page.

Sample Code:

MODULE_NAME.module

/**
 * Implements hook_menu().
 */
function [MODULE_NAME]_menu() {
  $items['custom_url'] = array(
    'title' => 'Test',
    'page callback' => '_[MODULE_NAME]_callback',
    // Check required access.
    'access callback' => TRUE,
  );

  return $items;
}

function _[MODULE_NAME]_callback() {
  $jquery = base_path() . 'misc/jquery.js';
  $script = drupal_get_path('module', 'MODULE_NAME') . '/[MODULE_NAME].js';
  echo '<script src="' . $jquery . '"></script>
    <script src="' . $script . '"></script>';
}

MODULE_NAME.js

(function() {
  $(document).ready(function() {
    // Do your tracking here.
    console.log("Test");
    window.location.href = "http://example.com";
  });
}(jQuery));

---

Edit :

No worries, if you've not created a module before, you can follow steps given in How to Make a Simple Module with a Form and Menu Link to try how it works. The documentation is regarding creating a module which will define a menu callback and form.

Here you can find a detailed guide regarding Creating custom modules.

The code snippet I've provided above includes all basic code as per your requirement, except the tracking code which you need to write inside MODULE_NAME.js file. See the comment saying // Do your tracking here.