Getting PHP variable in Javascript code

Question

I'm trying to use PHP variables in Javascript but I couldn't. After over 2000 lines of writing different JS functions I was fine avoiding that but now I really needed it. I'm a bit lost on all the ways to go about this but nothing really worked. Here is my sequence:

index.html file:

...
<script src="myfunctions.js" />
....

myfunctions.js file:

....
function test() {
    var x = <?php echo $_conf['user_id'];?>
    console.log(x);
}

I was trying to rename the .js file into .php file and add

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

at the beginning - that didn't work. I was trying to make .htaccess file with

AddType application/x-httpd-php .js

But that didn't work either. I'm probably missing just a tiny thing. I just need someone fresh and bright to point it out.

echo is not Javascript. At the very least, try return instead. — bart
– bart, Commented Nov 12, 2013 at 20:52

Castiblanco · Accepted Answer · 2013-11-12 21:34:52Z

2

You can do something like this within your JS code.

var php_var = "<?php echo $_conf['user_id'];?>"

edited Nov 12, 2013 at 21:34

answered Nov 12, 2013 at 20:39

Castiblanco

1,1984 gold badges13 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Michael Berkowski Over a year ago

Get that extra echo out of there, and close the ?>

Nelson Galdeman Graziano · Accepted Answer · 2013-11-12 20:40:25Z

1

Your javascript file should be named as "javascript.php" (just put the name you want, the only important thing is the .php

You have an index.php

Write in your index.php

include("javascript.php");

Then in your javascript.php

<script>
function test(){
     var variable = "<? echo $conf['user_id'] ?>";
     alert(variable);
}
<script>

PS: Yo don't need any header.

answered Nov 12, 2013 at 20:40

Nelson Galdeman Graziano

5624 silver badges17 bronze badges

3 Comments

kmatheny Over a year ago

This appears to be the only completely correct answer. Changing the file extension(s), and adding var something=

user164863 Over a year ago

I agree that this one is the correct answer in fact this one only worked. But I have noticed one thing - all the functions in javascript.php file now became visible on the page, i.e. if I save that page on a disk I see all the functions while when it was .js file a user didn't have access to those. Would that be a problem for security?

mcrumley Over a year ago

The user can always access your javascript code, even in a .js file. It won't be saved in the file if they download it, but they will still know the URL and can download it separately.

Marc B · Accepted Answer · 2013-11-12 20:41:56Z

1

Since you're doing this via a <script> tag, your PHP script MUST output valid Javascript code, as if you'd literally type your variable assignment in manually. That means doing something like:

HTML/JS:

<script src="myscript.php"></script>

PHP:

<?php
$myvar = 'foo';
?>

var myvar = <?php echo json_encode($myvar); ?>;

Which in the end, will produce somethign that will function exactly as if you'd manually typed in the following:

<script>
var myvar = 'foo';
</script>

Note the use of json_encode(). Using this ensures that whatever you're outputting from PHP will become syntactically valid Javascript.

answered Nov 12, 2013 at 20:41

Marc B

362k44 gold badges433 silver badges508 bronze badges

2 Comments

Nelson Galdeman Graziano Over a year ago

Why json ? Isn't needed.... you can just use var myvar = '<? echo "whatever"; ?>'; I use it every time...

Marc B Over a year ago

it's a safety measure. consider $name = "Miles O'Brien" and echoing that into a JS block. Boom. Syntax Error. Kiss your script block goodbye.

anubhava · Accepted Answer · 2013-11-12 20:46:43Z

1

You're not assigning PHP value to a Javascript variable. Try:

var v = "<?php echo $_conf['user_id'];?>";

edited Nov 12, 2013 at 20:46

answered Nov 12, 2013 at 20:39

anubhava

790k67 gold badges603 silver badges671 bronze badges

1 Comment

anubhava Over a year ago

@NelsonGaldemanGraziano: Thanks, bad copy/paste from question. Corrected.

Ignacio Vazquez-Abrams · Accepted Answer · 2013-11-12 20:40:26Z

0

index.html

 ..
<script src="myfunctions.js.php" />
 ...

myfunctions.js.php

<?php
header('Content-Type: text/javascript');
 ...
?>
var val = <?php echo json_encode($val); ?>;
 ...

answered Nov 12, 2013 at 20:40

Ignacio Vazquez-Abrams

804k160 gold badges1.4k silver badges1.4k bronze badges

Comments

ConstantineUA · Accepted Answer · 2013-12-15 17:46:42Z

0

Other possible solution is to assign server-side data to attributes in html and read them in javascript. For example index.html could contain something like this:

<div id="user-profile" data-user-id="<?php echo $conf['user_id']; ?>"></div>

and in js file you can get them while necessary(example with jQuery):

var userID = $('#user-profile').attr('data-user-id');

Of course you should adjust your server-side settings to process html files.

answered Dec 15, 2013 at 17:46

ConstantineUA

1,0511 gold badge9 silver badges19 bronze badges

Collectives™ on Stack Overflow

Getting PHP variable in Javascript code

6 Answers 6

1 Comment

3 Comments

2 Comments

1 Comment

index.html

myfunctions.js.php

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

1 Comment

3 Comments

2 Comments

1 Comment

index.html

myfunctions.js.php

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related