Server-side Actions When Importing JavaScript

When JavaScript is imported from a file on the server, the browser makes a request and the server responds with the JavaScript.

Yet, more can happen. Other actions can take place before the server delivers the JavaScript.

Generally, JavaScript is imported from an external file with code somewhat like this.

<script src="https://example.com/file.js"></script>

The file being imported does not need to have a .js extension. It can have a .php extension, instead. Example:

<script src="https://example.com/file.php"></script>

With that, the PHP script runs and does whatever it is coded to do. To finish its run, the PHP script replies with JavaScript as the browser requested.

When the PHP script runs, the PHP code can do anything that PHP can do. Here are a few to stimulate your imagination.

• Log the page load. Include referral information, if available.

• Create a variable with a value to insert within the JavaScript that is sent to the browser.

• Log browser information such as browser type, whether or not an ad blocker is enabled, whether it sent a do-not-track request, and other information.

• Insert up-to-the-minute database info into the JavaScript sent to the browser.

The example script does the first two of that list. The code logs the page load and it creates a variable with the person's IP address. The IP address variable is then inserted into the JavaScript.

The example's purpose is to illustrate a way to do it — rather than presenting a utility that you can't get along without.

Here is the PHP script. One modification may be desired. Notes follow.

<?php
// Export Custom JavaScript example.
// October 31, 2021
// Will Bontrager Software LLC

// To specify JavaScript content.
header('Content-type:text/javascript');

// Store the IP address in variable $IPaddress
$IPaddress = $_SERVER['REMOTE_ADDR'];

// The page load log file location (CSV-formatted file).
$PageLoadLogFile = __DIR__.'/logfile.csv';

// Log the page load.
$logline = array();
$logline[] = date('r');
$logline[] = $IPaddress;
$logline[] = str_replace('"','""',$_SERVER['HTTP_REFERER']);
$logline[] = str_replace('"','""',$_SERVER['HTTP_USER_AGENT']);
file_put_contents($PageLoadLogFile,'"'.implode('","',$logline)."\"\n",FILE_APPEND);

// The JavaScript.
echo <<<JAVASCRIPT
var thisIPaddress = "$IPaddress";
alert("The IP address is " + thisIPaddress);
JAVASCRIPT;
?>

Notes —

Looking at the source code of the PHP script, notice this line.

header('Content-type:text/javascript');

It tells the browser that JavaScript content is on the way.

Further along, you'll see where the site visitor's IP address is stored in the $IPaddress variable.

After that, the location of the log file is specified.

You may wish to modify the log file location. If not modified, the file will be located in the same directory where this script is installed with file name logfile.csv.

Half a dozen lines follow. These format the data for logging and update the log file with the data CSV formatted.

Then you get to the JavaScript that the PHP script will send to the browser, customized with the user's IP address.

For this illustration, the JavaScript is only two lines. The intent is to show how a PHP variable can be used within the JavaScript.

1. The first line of JavaScript assigns the value of the PHP variable $IPaddress to the JavaScript variable thisIPaddress.

2. The second line spawns an alert box stating what the IP address is.

When done examining the PHP script, save it as file.php or other *.php file name.

Upload file.php to your server and note its URL. The URL will be used in this script tag instead of https://example.com/file.php

<script src="https://example.com/file.php"></script>

With the script tag on your web page, the PHP script will run before replying with the JavaScript that the browser requested.

This article first appeared with an issue of the Possibilities newsletter.

Will Bontrager