5

I know it doesn't necessarily make any sense, but is there a way to run javascript on the client, find the screen width/height of the active browser, and then pass those variables to a PHP script?

All the common knowledge is usually PHP >> Javascript, never trust the client I suppose, and I can't find a way at the moment.

This is for a .php file, so blocks easily, but I cannot seem to do the reverse.

I am working on creating a JSON object, but then realized I still have the same wall to climb.

Thanks.

I am finding the interactions between technologies somewhat challenging as an amateur, but it makes me feel powerful to know. Maybe soon I'll be able to stop exceptions just with my hands. Well, the matrix reference fails, because that is what people do on a second tier literal level.

Danedo
  • 2,193
  • 5
  • 29
  • 37
  • what do you want to accomplish passing those variables? – amosrivera Apr 03 '11 at 01:17
  • The php script is usually already terminated when the browser receives the answer so the only way is to use AJAX or an embedded file with the resolution info passed as parameters. Like a 1x1 tracking pixel. – Eliasdx Apr 03 '11 at 01:19

3 Answers3

5

You can do this:

<script>
document.getElementById('hidden-field').value = screen.width + ',' + screen.height;
</script>

<input id="hidden-field" name="dimensions" value="" />

and submit the form. You could use AJAX to send that data instead, a cookie, an image, etc. I personally would use AJAX.

But yes, this is a case where you'll need to just trust the client at face value. However, if you are doing something with that data (like creating an image or something) you should still validate that the value makes sense so you don't end up trying to create an image that is 100 million pixels wide, etc.

Matthew
  • 47,584
  • 11
  • 86
  • 98
  • +1 for the last piece of advice. I always vouch for security, and that's a great thought (although a bit unrelated). – Christian Apr 03 '11 at 01:26
2
<script type="text/javascript">
    document.write('<img src="index.php?width='+screen.width+'&height='+screen.height+'"/>');
</script>

(oh lookie here, no AJAX :))

By the way, I highly advice not to use document.write, instead either use window.onload or something better from your preferred JS library (such as jQuery(document).ready(function(){ jQuery(document.body).append("the-image-as-in-my-example"); }) in jQuery).

Christian
  • 27,509
  • 17
  • 111
  • 155
2

Fast one with jQuery

$(function(){
 $.ajax({
   url: 'file.php',
   type: 'POST',
   data: {h: screen.height, w: screen.width}
 });
});
arma
  • 4,084
  • 10
  • 48
  • 63