Portée des variables PHP dans Javascript

Version imprimable

25/10/2011, 12h20
CinePhil

Portée des variables PHP dans Javascript

Bonjour,
Je travaille un peu sur un projet commencé par d'autres et je suis à peu près noob en Javascript. Désolé si mes questions sont basiques mais après recherche sur le forum et parcours de quelques messages, rien ne m'a guidé.

Grosso modo, je reprends du code qui mélange du PHP, du CSS, du HTML et du Javascript, tout en faisant quand même appel à des fichiers CSS et JS.

J'ai voulu réorganiser un peu tout ça en isolant tout le CSS et tout le Javascript dans des fichiers .css et .js.

Le problème est que certaines portions de code Javascript utilisent des variables PHP.

Après moult essais et pas mal de recherches sur le net, il semble impossible d'externaliser dans un fichier Javascript les fonctions Javascript utilisant du code PHP afin que le code Javascript n'apparaisse pas dans le code source de la page HTML (je trouve ça moche !).

Vrai ou faux ?
25/10/2011, 12h29
zevince

si c'est un fichier .js, par défaut, ton serveur web ne le passera pas à php et le servira, tel quel, non interprété..

Tu peux configurer ton serveur web pour exécuter php aussi sur les .js, mais ça risque d’être un peu lourd..

Par contre tu peux tester en appelant ton fichier
"scripts.js.php" et l’appeler dans ton html comme un fichier js externe normal

Code:

<script type="text/javascript" src="/js/scripts.js.php"></script>

ca devrait marcher.. Peut-être auras tu besoin de rajouter un header approprié pour que le script php soit bien reconnu comme js :

Code:

header("content-type: application/x-javascript");

Encore que normalement, vu que tu précise le type dans ton appel, ca ne devrait pas être nécessaire..

A tester !
25/10/2011, 19h25
CinePhil

J'ai essayé ce genre de manip mais rien n'y fait.
Je vais simplement séparer le code dans des fichiers ;js mais les appeler par require dans le PHP pour qu'ils soient intégrés à la page générée par PHP et qu'ils bénéficient des variables PHP comme actuellement.
Ce sera déjà mieux que d'avoir tout mélangé dans le même fichier.

Merci de ta réponse.
25/10/2011, 20h12
SpaceFrog

Citation:

J'ai essayé ce genre de manip mais rien n'y fait.

Pourtant ça fonctionne parfaitement ...

soit mettre le fichier css ou js avec une extension .php
- et mettre le src des balises avec l'extension .php
- ou faire un rewrite rule poru que les .css pointent sur des .php

soit indiquer au serveur d'interpréter les fichiers .css et .js avec php

Ce sont des techinques éprouvées ...
25/10/2011, 21h51
CinePhil

Ça a fonctionné pour le CSS mais pas pour le Javascript alors je change de stratégie pour le JS
26/10/2011, 15h33
Willpower
Citation:

Envoyé par CinePhil

Ça a fonctionné pour le CSS mais pas pour le Javascript alors je change de stratégie pour le JS

Qu'entends-tu par ça ne fonctionne pas en js ? Tu n'as pas les variables php ou tu n'as pas de fichier du tout ?

Perso en header je met juste ça :
Code:

1 2 3 4 5 <?php header("Content-type: text/javascript"); ?> //mon code javascript ici
Et dans ma page html, rien de plus qu'avant sauf que ma balise script a pour source la page php.

Code:

<script type="text/javascript" src="http://www.monsite.com/monscript.php" ></script>

edit: sinon je me souviens qu'à l'époque ou j'utilisais des hebergeurs gratuits, l'un d'eux plantait mes fichiers externes ".php" car il rajoutait des balises html pour faire des stats.
26/10/2011, 15h36
SpaceFrog

css javascript les deux fonctionnent
26/10/2011, 16h08
snypi

Une solution pour faire tourner du php dans le js, à noter dans le htaccess.

Citation:

Run PHP inside JavaScript files
When coding in JavaScript, it can very useful to be able to use PHP inside the .js files, for example for retrieving data from your database. Here is a snippet to allow the use of PHP inside .js files.

AddType application/x-httpd-php .js
AddHandler x-httpd-php5 .js

<FilesMatch "\.(js|php)$">
SetHandler application/x-httpd-php
</FilesMatch>

Source: http://www.kavoir.com/2010/07/how-to...ipt-files.html

1 pièce(s) jointe(s)

Merci pour le lien snypi.
Si je comprends bien ceci :

Citation:

Another solution for this is to make your server parse all files ending in .js. Just create a .htaccess if it doesn’t exist in the directory in which you wish to include and run PHP code inside all .js files.

Il faut mettre le .htaccess avec le code donné dans le répertoire contenant les .js ?

EDIT :
Je viens de faire un test, avec tous les fichiers dans le même répertoire pour simplifier :

.htaccess :

Code:

1
2
3
4
5
6
7
8
AddType application/x-httpd-php .css
 
AddType application/x-httpd-php .js
AddHandler x-httpd-php5 .js
 
<FilesMatch "\.(js|php)$">
SetHandler application/x-httpd-php
</FilesMatch>

styles.css :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
header( 'Content-type: text/css');
session_start();
?>
body {
	background: <?php echo $_SESSION['bg']['body']; ?>;
	font-style: normal;
}
#container {
	background: <?php echo $_SESSION['bg']['container']; ?>;
	color: <?php echo $_SESSION['txt']['police']; ?>;
	border: 10px solid <?php echo $_SESSION['txt']['border']; ?>;
}
 
#texte
{
	font-style: <?php echo $style_texte; ?>;
}

test.js :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
<?php
header("Content-type: application/x-javascript");
session_start();
?>
 
function afficherVariable()
{
	var varsess = '<? echo $_SESSION["variable_session"]; ?>';
	var variable = '<php echo $une_variable; ?>';
 
	alert(varsess + ' : ' + variable);
}

index.php :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<?php
session_start();
$_SESSION['bg']['body'] = 'blue';
$_SESSION['bg']['container'] = 'yellow';
$_SESSION['txt']['police'] = 'red';
$_SESSION['txt']['border'] = 'green';
$_SESSION["variable_session"] = 'ma variable session';
$style_text = 'italic';
$une_variable = 'une valeur';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title>Test</title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link rel="stylesheet" href="styles.css" type="text/css" media="screen" />
	<script type="application/x-javascript" src="test.js" charset="utf-8"></script>
</head>
<body>
	<div id="container"><span id="texte">Bonjour</span><br />
		<a href=javascript:afficherVariable()>Afficher les variables</a>
	</div>
</body>
</html>

Voici le résultat :
http://www.developpez.net/forums/att...1&d=1319704812

=> La variable session est récupérée mais pas la variable ordinaire, pour le CSS comme pour le Javascript.

27/10/2011, 13h04
Willpower

bon et ma(notre) solution alors ? (juste en renomant tes fichiers .js en .php).

le fichier ne fonctionne plus du tout ? ou uniquement tes variables qui ne fonctionnent pas ? as-tu un message d'erreur dans la console ?

as-tu bien mis le header php content-type "text/javascript" ?
27/10/2011, 22h24
snypi

mille excuse au lieu de mettre "une solution" j'aurais du écrire " une piste"
:)
quand je regarde la configuration de ta réorganisation effectivement j'opterai pour un fichier js.php pour regrouper les code js.
et si pas trop de variable css à modifier je les mettrais dans une balise style du index.php
28/10/2011, 09h52
CinePhil

Bon ben dans ce cas je reste sur la solution que j'ai adoptée :
Séparation du code Javascript dans des fichiers .js et require du fichier .js dans le programme PHP.

On va dire que c'est résolu, même si ça ne me satisfait qu'à moitié.

Merci à tous.