Pass from PHP to Javascript - php

I have a little problem here, and no tutorials have been of help, since I couldn't find one that was directed at this specific problem.
I have 2 hosting accounts, one on a server that supports PHP. And the other on a different server that does not support PHP.
SERVER A = PHP Support, and
SERVER B = NO PHP Support.
On server a I have a php script that generates a random image. And On server b, i have a html file that includes a javascript that calls that php function on server a. But no matter how I do it, it never works.
I have the following code to retrieve the result from the php script:
<script language="javascript" src="http://www.mysite.com/folder/file.php"></script>
I know I'm probably missing something, but I've been looking for weeks! But haven't found any information that could explain how this is done. Please help!
Thank you :)
UPDATE
The PHP script is:
$theimgs= array ("images/logo.png", "images/logo.png", "images/logo.png", "images/logo.png", "images/logo.png");
function doitnow ( $imgs) {
$total = count($imgs);
$call = rand(0,$total-2);
return $imgs[$call];
}
echo '<img src="'.doitnow($theimgs).'" alt="something" />';

<img src="http://mysite.com/folder/file.php" alt="" /> ?

It's not clear, why you include a PHP file as JavaScript. But try following:
Modify your PHP Script so that it returns a image file directly. I'll call that script image.php. For further information, look for the PHP function: header('Content-type: image/jpeg')
In your JavaScript file use image.php as you would any normal image.
Include the JavaScript on server B as a *.js file.
UPDATE:
It's still not clear, why you need JavaScript.
Try as image.php:
$theimgs= array ("images/logo.png", "images/logo.png", "images/logo.png", "images/logo.png", "images/logo.png");
function doitnow ( $imgs) {
$total = count($imgs);
$call = rand(0,$total-2);
return $imgs[$call];
}
$host = $_SERVER['HTTP_HOST'];
$uri = rtrim(dirname($_SERVER['PHP_SELF']), '/\\');
$extra = 'mypage.php';
header("Location: http://$host$uri/" . doitnow($theimgs));
And on server b:
<img src="www.example.org/image.php"/>

You didn't specify, but I assume the two servers have different domain/hostnames. You may be running into a browser security model problem (same origin policy).
If that's the case, you need to use JSONP.

You may be using outdated sources to learn, since the language attribute is deprecated and you should use type="text/javascript" instead. It's also not clear what kind of output does the .php script produce. If it's image data, why are you trying to load it as a script and not an image (i.e., with the <img> tag)?
Update: The script is returning HTML, which means it should be loaded using Ajax, but you can't do that if it's on a different domain due to the same origin policy. The reason nothing is working now is that scripts loaded using the <script> tag aren't interpreted as HTML. To pass data between servers, you should try JSONP instead.

It seems that server A generates an HTML link to a random image (not an image). The URL is relative to wherever you insert it:
<img src="images/logo.png" alt="something" />
That means that you have an images subdirectory everywhere you are using the picture. If not, please adjust the URL accordingly. Forget about JavaScript, PHP or AJAX: this is just good old HTML.
Update
The PHP Script displays pics randomly.
Pics are hosted on server A, and they
are indeed accessible and readable
from the internet. The PHP Script has
been tested by itself, and works.
If these statements are true, Māris Kiseļovs' answer should work. So either your description of the problem is inaccurate or you didn't understand the answer...

Related

jQuery load php file as text?

Is it possible to load a php file as text with jquery?
$('#loader').load('somefile.php', function(e){
console.log(e);
});
This always interprets/execute the php file but I'm looking for a way to only load it as text, without to resort to renaming my php file as .txt
Is it possible?
Cheers
It is not possible without making any server side modification. The web server will always interpret the php file and return the output. However does not matter what solution you find it'll be very dangereous since you'll be dumping content of your php file to public.
Possible solutions with server side modifications:
Create a PHP file that dumps the content of a file, which name is specified by a url argument
Rename the file (I know the op does not want this, just included since it's an option)
As #nicholas-young suggested, get rid of the PHP tags.
I'm not sure why you need this type of need but I want to emphasize that this might not be a good idea in most of the cases since you'll be make a working PHP file available to public. If you can explain more why you need this we might offer better solutions.
Update:
Create a dumper.php that requires authorization and call this file from the javascript side with passing the filename that you want to be dumped as a parameter (dumper.php?file=index.php)
echo file_get_contents($_GET['file']);
It is of course not possibile.
.load will make an HTTP request to yourwebsite.com/somefile.php hence you will obtain the result of your script not the PHP code inside it.
If you really need the raw code inside your javascript as a string you should output it from the php itself:
<script>
var yourCode = <?=json_encode(file_get_contents('somefile.php')) ?>;
</script>
NO! Would be a major security problem if possible. The header will not matter. If making request towards php file, it will execute prior to delivery.
Use some parameter to print out contents from file instead. But do it in the file itself.

Equivalent of PHP's dirname(__FILE__) in JavaScript?

as I already mentioned in the title, I'm looking for a JS-function for getting the same result like I get with this PHP code:
dirname(dirname(__FILE__))
Thanks in advance!
I don't think it is possible because php dirname operates on apache server on local machine. It has access to the filesystem. But javascript operates on browser layer which can't operate with filesystem. I think so you should use ajax and proccess result how you need it. I think so its best solution for you.
I needed a solution to write code like this:
$("#div").load(ROOT_URL + "my/path/to/script.php");
Solution: a PHP script generates one JS-file of all needed JS-files and adds the ROOT_URL to the top of the generated file:
$js = 'ROOT_URL = "' . ROOT_URL . '"; ' . $js;
file_put_contents("file.js", $js);
Now I'm able to use the ROOT_URL (set in a PHP config-file) in JS-code as well. I hope I could help.
You can have PHP output the script. Yes, that's right, you probably can't make php process js files (unless you are in full control of the server). But it doesn't matter. Just make sure that the MIME type is correct, both in the headers PHP returns and the script tag. That way, you can have PHP insert the any values you want in the script, including it's own path.
In script.php:
header("Content-type: text/javascript");
echo 'var myvar = '.$something;
//where $something can be $_SERVER['REQUEST_URI'], __FILE__ or whatever you need.
//You could even use information from session variables, or query the database.
//In fact, this way you can have GET parameters in your javascript.
//Make sure you are not creating a vulnerability with the exposed information.
//Then put the rest of the script as usual. You could even include it*.
*: include
In HTML:
<script type="text/javascript" src="script.php"></script>
Yes, I know I'm repeating the MIME type, do it this way to maximize browser compatibility.
There's no analogue of __FILE__ in browser Javascript; the code does not have direct access to the URL from which it was loaded. But with certain assumptions you can figure it out, as in the answer here.
Once you have the URL of the script (I assume in a variable called scriptURL below) you can set about finding the grandparent URL. This can get tricky with URLs, so it's probably safest to let the URL-savvy bits of Javascript parse the URL for you and get just the pathname component before you start with the string-munging:
var a = document.createElement('a')
a.href = scriptURL
var scriptPath = a.pathname
Then it's unfortunately down to string manipulation; here's one somewhat clunky solution:
var components = scriptPath.split(/\//)
while (components.length > 0 && !components[components.length-1])
components.length -= 1;
var twoDirsUp = components.slice(0,components.length-2).join('/')
And then you can convert the result back into a full URL using the anchor element trick in reverse:
a.pathname = twoDirsUp;
var grandParentUrl = a.href
Why not load what you want from absolute URL?
If you have inse your block of codes: /my/script/to/load.js browser will load the correct file if you are in yoursite.com or whatever like yoursite.com/a/b/c/d/e/f
A little off topic, but if you just want to get the similar of dirname($_SERVER['REQUEST_URI']) for javascript, you can do
window.location.href.substr(0, window.location.href.length - window.location.href.split('/').pop().length)
I use something like that to free from the paths in javascript
var __DIR__ = window.location.pathname.match('(.*\/).*')[1] + 'NameOfThisFolder';
first
window.location.pathname.match('(.*\/).*')[1]
return the current path without the file name or other stuff.
rootFolder/folder1/folder2/
then I add the name of this folder ('NameOfThisFolder').
In this way, I can make for instance ajax request in current page from a page that was called in turn from an ajax request without worry about the path

Loading Javascript through PHP

From a tutorial I read on Sitepoint, I learned that I could load JS files through PHP (it was a comment, anyway). The code for this was in this form:
<script src="js.php?script1=jquery.js&scipt2=main.js" />
The purpose of using PHP was to reduce the number of HTTP requests for JS files. But from the markup above, it seems to me that there are still going to be the same number of requests as if I had written two tags for the JS files (I could be wrong, that's why I'm asking).
The question is how is the PHP code supposed to be written and what is/are the advantage(s) of this approach over the 'normal' method?
The original poster was presumably meaning that
<script src="js.php?script1=jquery.js&scipt2=main.js" />
Will cause less http requests than
<script src="jquery.js" />
<script src="main.js" />
That is because js.php will read all script names from GET parameters and then print it out to a single file. This means that there's only one roundtrip to the server to get all scripts.
js.php would probably be implemented like this:
<?php
$script1 = $_GET['script1'];
$script2 = $_GET['script2'];
echo file_get_contents($script1); // Load the content of jquery.js and print it to browser
echo file_get_contents($script2); // Load the content of main.js and print it to browser
Note that this may not be an optimal solution if there is a low number of scripts that is required. The main issue is that web browser does not load an infinitely number of scripts in parallel from the same domain.
You will need to implement caching to avoid loading and concatenating all your scripts on every request. Loading and combining all scripts on every request will eat very much CPU.
IMO, the best way to do this is to combine and minify all script files into a big one before deploying your website, and then reference that file. This way, the client just makes one roundtrip to the server, and the server does not have any extra load upon each request.
Please note that the PHP solution provided is by no means a good approach, it's just a simple demonstration of the procedure.
The main advantage of this approach is that there is only a single request between the browser and server.
Once the server receives the request, the PHP script combines the javascript files and spits the results out.
Building a PHP script that simply combines JS files is not at all difficult. You simply include the JS files and send the appropriate content-type header.
When it gets more difficult is based on whether or not you want to worry about caching.
I recommend you check out minify.
<script src="js.php?script1=jquery.js&scipt2=main.js" />
That's:
invalid (ampersands have to be encoded)
hard to expand (using script[]= would make PHP treat it as an array you can loop over)
not HTML compatible (always use <script></script>, never <script />)
The purpose of using PHP was to reduce the number of HTTP requests for JS files. But from the markup above, it seems to me that there are still going to be the same number of requests as if I had written two tags for the JS files (I could be wrong, that's why I'm asking).
You're wrong. The browser makes a single request. The server makes a single response. It just digs around in multiple files to construct it.
The question is how is the PHP code supposed to be written
The steps are listed in this answer
and what is/are the advantage(s) of this approach over the 'normal' method?
You get a single request and response, so you avoid the overhead of making multiple HTTP requests.
You lose the benefits of the generally sane cache control headers that servers send for static files, so you have to set up suitable headers in your script.
You can do this like this:
The concept is quite easy, but you may make it a bit more advanced
Step 1: merging the file
<?php
$scripts = $_GET['script'];
$contents = "";
foreach ($scripts as $script)
{
// validate the $script here to prevent inclusion of arbitrary files
$contents .= file_get_contents($pathto . "/" . $script);
}
// post processing here
// eg. jsmin, google closure, etc.
echo $contents();
?>
usage:
<script src="js.php?script[]=jquery.js&script[]=otherfile.js" type="text/javascript"></script>
Step 2: caching
<?php
function cacheScripts($scriptsArray,$outputdir)
{
$filename = sha1(join("-",$scripts) . ".js";
$path = $outputdir . "/" . $filename;
if (file_exists($path))
{
return $filename;
}
$contents = "";
foreach ($scripts as $script)
{
// validate the $script here to prevent inclusion of arbitrary files
$contents .= file_get_contents($pathto . "/" . $script);
}
// post processing here
// eg. jsmin, google closure, etc.
$filename = sha1(join("-",$scripts) . ".js";
file_write_contents( , $contents);
return $filename;
}
?>
<script src="/js/<?php echo cacheScripts(array('jquery.js', 'myscript.js'),"/path/to/js/dir"); ?>" type="text/javascript"></script>
This makes it a bit more advanced. Please note, this is semi-pseudo code to explain the concepts. In practice you will need to do more error checking and you need to do some cache invalidation.
To do this is a more managed and automated way, there's assetic (if you may use php 5.3):
https://github.com/kriswallsmith/assetic
(Which more or less does this, but much better)
Assetic
Documentation
https://github.com/kriswallsmith/assetic/blob/master/README.md
The workflow will be something along the lines of this:
use Assetic\Asset\AssetCollection;
use Assetic\Asset\FileAsset;
use Assetic\Asset\GlobAsset;
$js = new AssetCollection(array(
new GlobAsset('/path/to/js/*'),
new FileAsset('/path/to/another.js'),
));
// the code is merged when the asset is dumped
echo $js->dump();
There is a lot of support for many formats:
js
css
lot's of minifiers and optimizers (css,js, png, etc.)
Support for sass, http://sass-lang.com/
Explaining everything is a bit outside the scope of this question. But feel free to open a new question!
PHP will simply concatenate the two script files and sends only 1 script with the contents of both files, so you will only have 1 request to the server.
Using this method, there will still be the same number of disk IO requests as if you had not used the PHP method. However, in the case of a web application, disk IO on the server is never the bottle neck, the network is. What this allows you to do is reduce the overhead associated with requesting the file from the server over the network via HTTP. (Reduce the number of messages sent over the network.) The PHP script outputs the concatenation of all of the requested files so you get all of your scripts in one HTTP request operation rather than multiple.
Looking at the parameters it's passing to js.php it can load two javascript files (or any number for that matter) in one request. It would just look at its parameters (script1, script2, scriptN) and load them all in one go as opposed to loading them one by one with your normal script directive.
The PHP file could also do other things like minimizing before outputting. Although it's probably not a good idea to minimize every request on the fly.
The way the PHP code would be written is, it would look at the script parameters and just load the files from a given directory. However, it's important to note that you should check the file type and or location before loading. You don't want allow a people a backdoor where they can read all the files on your server.

How to create a tracking script with js and php?

I want to create a simple tracking script to give to my clients. Something similar with GA but very basic.
The requirements are
give the clients a single and simple js script like google Analytics does
make most of the logic inside the js file loaded by 3th party sites from the main site
collect in PHP the information and store it
What I can't figure yet is what are the ways to do this?
Google from what I see is loading a gif file, stores the information and parses the logs.
If I do something similar sending the data to a php file Ajax cross site policy will stop me, from what I remember.
So what is a clean way to do this ? ( I don't need code just the logic behind it )
Method a - web bug:
Give the user this:
<img src="http://www.yourserver.com/yourtracking.php?associateid=3rdpartyid" width="1" height="1" />
have the php return header("content-type:image/gif"); and serve them a gif file for their effort.
Method b - script
Create a php file that can parse parameters and have it return content-type:text/javascript
Have them load it like this:
<script type="text/javascript" src="http://www.yourserver.com/yourtracking.php?associateid=3rdpartyid"></script>
If you want to you can do additional stuff like
<script type="text/javascript">
var associateId = "12345";
var trackingPage="homepage";
</script>
<script type="text/javascript" src="http://www.yourserver.com/yourtracking.php?associateid=3rdpartyid"></script>
then in the php have code like this (watch the nested quotes)
$str = 'var url = "http://www.yourserver.com/moretracking.php?associateid="+associateId+';
$str .= '"&page="+trackingPage+"&ref="+escape(document.referrer);\n';
$str .= 'document.write(\'<img src="\'+url+\'"/>\');';
echo $str;
You may read this (found googling) about cross domain ajax and its possible solutions... http://snook.ca/archives/javascript/cross_domain_aj/
Well, i use some php code that is included in my script that logs Ip Addresses and as much information i can get from a server-side perspective. It saves it in a MySql Database. I also use a Ajax script to post data to a php script, the data in this case is Screen Heigth and thing you only can get client-side.

Problem with AJAX and PHP

I have a small problem, I want to load data from a PHP file and put them on a DIV.
Here's the Jquery code
// Store the username in a variable
var jq_username = $("#txt_checkuser").val();
// Prepare the link variable
var link = 'user.php?action=check&username=' + jq_username;
$('div #checkuser_hint').load(link);
So it works! but instead of loading the result (compiled PHP) it loads the PHP code.
If I write the long URL "http://localhost/project..." it doesn't load anything!
Any idea how to do that?
I think you might be accessing your javascript file as a file on your local filesystem, a request to the same directory would go through the filesystem and not through your webserver, processing the PHP into the desired output. This also explains why http://localhost/project for the AJAX call doesn't work: Javascript might be enforcing the same-origin policy on you.
Verify that you're actually accessing this javascript file through http://localhost/ (as opposed to something like file://C:/My PHP Files/ ).
Does the page return anything when you use your browser?
Are you sure it should not be 'div#checkuser_hint' instead of 'div #checkuser_hint' ?
And this looks like the correct way according to the documentation.
var link = 'user.php';
$('div#checkuser_hint').load(link, {'action':'check', 'username':jq_username});
Are you able to access the script manually on your own? (try accessing it via your browser: htp://localhost/...) It may be the case that you're missing your opening <?php and/or closing ?> in the script-file itself.

Categories