asked on

Javascript for capturing the referrer and posting it to a script on another server via Ajax?

I'm trying to emulate what Google Analytics does -- where you insert a piece of Javascript code into all pages on your website, and that script then communicates with a remote server (via what I assume to be an ajax call) to write statistical information.

I have a client that wants me to write a piece of javascript for him that he can give to his clients (that they can then place on all pages of their website) that will allow them to gather statistics and post them to a single remote server (which is hosted by my client).

The javascript that I need to write needs to do the following:

1) store the domain / hostname of the website in a variable
2) detect whether or not the "referrer=google" exists within the referrer url
3) detect what keyword url parameter exists within the referrer url (if any) and store it in a variable (ie: keyword=cash)
4) generate a unique date / time stamp and store it in a variable
5) post the domain, keyword value, and date/time stamp to a script that's hosted on another server via ajax (which would then write the info to a database)

Also, since the code will exist on all pages of the website, it will be important that the data only be posted ONCE to the remote server. In other words, the script should probably write some kind of cookie that can be used to supress further execution of the code on the other pages:

if (!cookie exists) {
...
}

How would I go about doing something like this? Could someone maybe provide me with some sample javascript?

Thanks in advance,
- Yvan

Niversoft

It's not possible to use an AJAX call to send data to another server (browser security).

Google Analytics does that by inserting a script element which fetches with well-crafted parameters:

- ga.js analyses the info it needs
- it then inserts an element in the <head> section of the page such as:
<script type="text/javascript" src="https://www.google.com/analytics/reporting/overlay_js?gaso=[encoded_data]"></script>

The server reads the encoded data, likely adds it to its database, then returns other data or script the system may need to continue.

Niversoft

1) store the domain / hostname of the website in a variable
var mydomain = location.hostname

2) detect whether or not the "referrer=google" exists within the referrer url
Something like
var is_google = document.referrer.indexOf("google") > 0;

3) detect what keyword url parameter exists within the referrer url (if any) and store it in a variable (ie: keyword=cash)
You need here to parse the document.referrer string and extract the keyword value, if any. Do you want me to create the code for that?

4) generate a unique date / time stamp and store it in a variable
var timestamp = new Date().valueOf();
This is not unique as several people may access the same page at the same moment. To be really unique the server will need to provide some unique data to complement.

5) post the domain, keyword value, and date/time stamp to a script that's hosted on another server via ajax (which would then write the info to a database)
Using the Analytics solution, something like:

var new_script = document.createElement("script");
new_script.type = "text/javascript";
new_script.src = "http://yourserver.com/results/results.js?domain=" + mydomain + "&isgoogle=" + is_google + "&timestamp=" + timestamp + "&keyword=" + keyword;
document.getElementsByTagName("head")[0].appendChild(new_script);

Your server-side code (I called the script results.js, but it can be results.php or anything you want) will need to parse the url query parameters and do the appropriate action. Even if your server-side code does not generate any content to send back to the webpage, make sure it sets the content-type to "text/javascript". In PHP:
header("Content-Type: text/javascript"); or something similar.

Badotz

Niversoft says:
"It's not possible to use an AJAX call to send data to another server (browser security)."

This is true for the the *client*, but on the *server*, no such restrictions apply. You can Ajax to *any* server, and from that server Ajax to any other server.

I hae never done this, but I see no reason why it cannot be done.

Google should help: "server to server xmlhttpobject"

egoselfaxis

ASKER

Niversoft -- thanks so much for your reply.

So -- is there a reason why I'd need to re-write the head section with the JS file inclusion? Assuming that the client would paste the javascript code right before the closing body tag, ... couldn't I just include the JS file there instead (using document.write) ? Why would it need to be in the head section?

Also -- regarding the the JS file that I'd be including (and that's hosted on yourserver.com) --- would that script be the one that posts to a PHP script that writes the info to the database? Could I perhaps see an example of what that javascript might look like?

Thanks,
- Yvan

ASKER CERTIFIED SOLUTION

Niversoft

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

egoselfaxis

ASKER

I see. So the included "results.PHP" script on the remote server would contain a combination of both javascript and PHP code in it, correct? Just so long as I include a proper header in the file. -- like "header("Content-Type: text/javascript");" ?

Thanks again for all your help.
- yg

Niversoft

The remote PHP script can be PHP only, you don't necessarily have to generate any javascript. You just need to sent the content-type correctly so the browser doesn't generate a warning.

The set-cookie code would be placed just after
document.getElementsByTagName("head")[0].appendChild(new_script);
in my second comment.

egoselfaxis

ASKER

Thanks again for all your help! I think I can take if from here.

Cheers,
- Yvan