je vais essayer une réponse plus simple:

explication du problème

d'abord, comprenons le flux d'événements lorsqu'une page est servie à partir de notre serveur:

• le premier PHP est lancé, il génère le HTML qui est servi au client.
• puis, le HTML est livré au client, après que PHP en a fini avec lui, je tiens à souligner qu'une fois que le code quitte le serveur - PHP est fait avec et ne peut plus y accéder.
• ensuite, le HTML avec JavaScript atteint le client, qui peut exécuter JS sur ce html.

donc vraiment, la chose centrale à retenir ici est que HTTP est apatride . Une fois qu'une requête a quitté le serveur, le serveur ne peut plus y toucher. Donc, cela laisse nos options à:

1. envoyer plus de requêtes du client après la demande initiale est fait.
2. code ce que le serveur avait à dire dans la requête initiale.

Solutions

C'est la question centrale que vous devriez vous poser est:

est-ce que j'écris un site web ou une application?

les sites Web sont principalement basés sur les pages, et les temps de chargement des pages doivent être aussi rapides que possible (par exemple-Wikipedia) . Web les applications sont plus AJAX lourd et effectuer beaucoup de voyages aller - retour pour obtenir le client Informations rapides (par exemple-un tableau de bord de stock).

site web

envoyer plus de requêtes du client après que la requête initiale est faite est lent car il nécessite plus de requêtes HTTP qui ont une overhead significative. De plus, il nécessite asynchrousity car la réalisation D'une requête AJAX nécessite un gestionnaire pour quand il est complet.

je pas vous recommandons de faire une autre demande à moins que votre site est une application pour obtenir des informations à partir du serveur.

vous voulez des temps de réponse rapides qui ont un énorme impact sur les temps de conversion et de charge. Faire des requêtes ajax est lent pour le temps de disponibilité initial dans ce cas et inutile.

Vous avez deux façons de s'attaquer à la question

• définir un cookie - les cookies sont des en-têtes envoyés dans des requêtes HTTP que le serveur et le client peuvent lire.
• encodez la variable comme JSON - JSON semble très proche des objets JavaScript et la plupart les objets JSON sont des variables JavaScript valides.

configurer un cookie est vraiment pas très difficile, il suffit de lui attribuer une valeur:

setcookie("MyCookie", $value); // sets the cookie to the value, remember, do not
                               // set it with HTTP only to true.

ensuite, vous pouvez le lire avec JavaScript en utilisant document.cookie :

voici un parser court roulé à la main, mais la réponse que j'ai liée juste au-dessus de cela a mieux testé:

var cookies = document.cookie.split(";").
    map(function(el){ return el.split("="); }).
    reduce(function(prev,cur){ prev[cur[0]] = cur[1];return prev },{});

cookies["MyCookie"] // value set with php.

Cookies sont bons pour un peu de données. C'est ce que font souvent les services de suivi.

une Fois que nous avons plus de données, nous pouvons l'encoder avec JSON dans une variable JS à la place:

<script>
    var myServerData = <?=json_encode($value)?>; // don't forget to sanitize 
                                                 //server data
</script>

suppose $value est json_encode capable du côté de PHP (il est habituellement). Cette technique est ce que StackOverflow fait avec son chat par exemple (en utilisant seulement .net au lieu de php).

Application

si vous écrivez une application-soudainement le temps de charge initiale n'est pas toujours aussi important que la performance continue de l'application et il commence à payer pour charger les données et le code séparément.

Ma réponse ici explique comment charger des données à l'aide d'AJAX en JavaScript:

function callback(data){
    // what do I do with the response?
}

var httpRequest = new XMLHttpRequest;
httpRequest.onreadystatechange = function(){
    if (httpRequest.readyState === 4) {// request is done
        if (httpRequest.status === 200) {// successfully
            callback(httpRequest.responseText);// we're calling our method
        }
    }
};
httpRequest.open('GET', "/echo/json");
httpRequest.send();

ou avec jQuery:

$.get("/your/url").done(function(data){
    // what do I do with the data?
});

maintenant, le serveur doit juste contenir une route/fichier /your/url qui contient le code qui saisit les données et fait quelque chose avec elle, dans votre cas:

<$php
 ...
 $val = myService->getValue(); // makes an api and db call
 echo json_encode($val); // write it to the output
 $>

de cette façon, notre fichier JS demande les données et le montre plutôt que de demander du code ou de la mise en page. C'est plus propre et commence à porter ses fruits, car la demande est plus élevée. Il est également une meilleure séparation des préoccupations et il permet de tester le code côté client sans aucune technologie côté serveur impliqué qui est un autre plus.

post-scriptum: Vous devez être très conscient de XSS, les vecteurs d'attaque lorsque vous injecter quoi que ce soit à partir de PHP à JavaScript. C'est très difficile d'échapper aux valeurs correctement et il est sensible au contexte. Si vous n'êtes pas sûr de la façon de traiter avec XSS, ou ignorant de lui - s'il vous plaît lire cet article OWASP , celui-ci et cette question .

j'utilise habituellement les attributs data-* en html.

<div class="service-container" data-service="<?php echo $myService->getValue(); ?>">

</div>

<script>
$(document).ready(function() {
    $('.service-container').each(function() {
        var container = $(this);
        var service = container.data('service');

        // service variable now contains the value of $myService->getValue();
    });
});
</script>

cet exemple utilise jQuery mais peut être adapté pour une autre bibliothèque ou JavaScript.

vous pouvez en savoir plus sur la propriété dataset ici: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset

<script>
  var jsvar = <?php echo json_encode($PHPVar); ?>;
</script>

json_encode ():

• PHP 5.2.0 ou plus
• $PHPVar codé UTF-8, Unicode.

utilisez simplement l'une des méthodes suivantes.

<script type="text/javascript">
var js_variable  = '<?php echo $php_variable;?>';
<script>

ou

<script type="text/javascript">
    var js_variable = <?php echo json_encode($php_variable); ?>; 
</script>

j'aime bien la façon dont fonctionne Wordpress avec ses fonctions enqueue et localize , donc en suivant ce modèle, j'ai écrit une classe simple pour mettre un script en page selon les dépendances du script, et pour rendre des données supplémentaires disponibles pour le script.

class mHeader {

    private $scripts = array();

    /**
     * @param string $id        unique script identifier
     * @param string $src   script src attribute
     * @param array  $deps      an array of dependencies ( script identifiers ).
     * @param array  $data      an array, data that will be json_encoded and available to the script.
     */
    function enqueue_script( $id, $src, $deps = array(), $data = array() ) {
        $this->scripts[$id] = array( 'src' => $src, 'deps' => $deps, 'data' => $data );
    }

    private function dependencies( $script ) {
        if ( $script['deps'] ) {
            return array_map( array( $this, 'dependencies' ), array_intersect_key( $this->scripts, array_flip( $script['deps'] ) ) );
        }
    }

    private function _unset( $key, &$deps, &$out ) {
        $out[$key] = $this->scripts[$key];
        unset( $deps[$key] );
    }

    private function flattern( &$deps, &$out = array() ) {

        foreach( $deps as $key => $value ) {            
            empty($value) ? $this->_unset( $key, $deps, $out ) : $this->flattern( $deps[$key], $out );
        }
    }   

    function print_scripts() {

        if ( !$this->scripts ) return;

        $deps = array_map( array( $this, 'dependencies' ), $this->scripts );
        while ( $deps ) 
            $this->flattern( $deps, $js );

        foreach( $js as $key => $script ) {
            $script['data'] && printf( "<script> var %s = %s; </script>" . PHP_EOL, key( $script['data'] ), json_encode( current( $script['data'] ) ) );
            echo "<script id=\"$key-js\" src=\"$script[src]\" type=\"text/javascript\"></script>" . PHP_EOL;
        }
    }
}

appeler à la fonction enqueue_script() est pour ajouter le script, mettre la source et les dépendances sur d'Autres scripts, et les données supplémentaires nécessaires pour le script.

$header = new mHeader();

$header->enqueue_script( 'jquery-ui', '//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js', array( 'jquery' ) );
$header->enqueue_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js' );
$header->enqueue_script( 'custom-script', '//custom-script.min.js', array( 'jquery-ui' ), array( 'mydata' => array( 'value' => 20 ) ) );

$header->print_scripts();

et, print_scripts() méthode de l'exemple ci-dessus enverra cette sortie:

<script id="jquery-js" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js" type="text/javascript"></script>
<script id="jquery-ui-js" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js" type="text/javascript"></script>
<script> var mydata = {"value":20}; </script>
<script id="custom-script-js" src="//custom-script.min.js" type="text/javascript"></script>

indépendamment du fait que le script 'jquery' est interrogé après le 'jquery-ui', il est imprimé avant parce qu'il est défini dans 'jquery-ui' qu'il dépend de 'jquery'. Les données supplémentaires pour le 'script personnalisé' sont à l'intérieur d'un nouveau bloc de script et sont placées en face de celui-ci, il contient l'objet mydata qui contient des données, maintenant disponibles personnaliser le script'.

myPlugin.start($val); // tried this, didn't work    

cela ne fonctionne pas parce que $val n'est pas défini en ce qui concerne javascript, i.e.. le php n'a rien produit pour $val . Essayez d'afficher la source dans votre navigateur et voici ce que vous verrez:

myPlugin.start(); // tried this, didn't work    

et

<?php myPlugin.start($val); ?> // this didn't work either

cela ne fonctionne pas parce que php va essayer de traiter myPlugin comme une constante et quand cela échoue, il va essayer de le traiter comme la chaîne 'myPlugin' qu'il va essayer pour concaténer avec la sortie de la fonction php start() et puisque cela n'est pas défini, il produira une erreur fatale

et

 myPlugin.start(<?=$val?> // this works sometimes, but sometimes it fails

bien que cela soit le plus susceptible de fonctionner, puisque le php produit du javascript valide avec les arguments attendus, s'il échoue, il y a de fortes chances que myPlugin ne soit pas encore prêt. Vérifiez votre ordre d'exécution.

aussi, vous devriez noter que la sortie php est non sécurisée et doit être filtré avec json_encode()

MODIFIER

parce que je n'ai pas remarqué la parenthèse manquante dans myPlugin.start(<?=$val?> : - \

comme @Second Rikudo le souligne, pour que cela fonctionne correctement $val devrait contenir la parenthèse finale par exemple: $val="42);"

signifie que le php va maintenant produire myPlugin.start(42); et fonctionnera comme prévu lorsqu'il sera exécuté par le javascript

essayez cette

<?php
    echo "<script> var x = ". json_encode($phpVariable)."</script>";
?>

--

- après avoir essayé pendant un certain temps Bien que cela fonctionne , mais il ralentit les performances. comme php est un script côté serveur tandis que javascript est un côté utilisateur.

je suis sorti avec une méthode facile pour assigner des variables JavaScript en utilisant PHP.

il utilise les attributs de données HTML5 pour stocker des variables PHP et ensuite son assigné à JavaScript sur la charge de page.

tutoriel complet peut être trouvé ici

exemple:

<?php

$variable_1 = "QNimate";
$variable_2 = "QScutter";

?>
    <span id="storage" data-variable-one="<?php echo $variable_1; ?>" data-variable-two="<?php echo $variable_2; ?>"></span>
<?php

que le Sien est le code JS

var variable_1 = undefined;
var variable_2 = undefined;

window.onload = function(){
    variable_1 = document.getElementById("storage").getAttribute("data-variable-one");
    variable_2 = document.getElementById("storage").getAttribute("data-variable-two");
}

voici un, je ne vois pas posté comme une option. il est similaire à l'utilisation d'ajax, mais clairement différentes.

d'abord, définissez la source d'un script directement dans un fichier PHP.

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

vous pouvez même renvoyer une variable vers le fichier PHP comme dans cet exemple:

<script type="text/javascript" src="url_to_your_php_file.php?var1=value1" /></script>

puis dans " your_php_file.php":

<?php
// THIS IS A SIMPLE EXAMPLE
// it demonstrates one method of using the src attribute to link
// to a PHP file which can generate javascripts dynamically
// and share data between PHP and javascript
// you may take this learning example and develop it further
// relying on your own coding skills for validating data
// and avoiding errors, of course
header( 'content-type: text/javascript' );

// if you pass a $_GET variable from the javascript
// you should add code to validate your $_GET variable(s)

// you can add code to query a database
// using $_GET['var1'] or some other criteria

// you can add simple variable assignments
$value = 'some value';

// for the OP's needs (assumes the class object has been defined)
$val = $myService->getValue();

?>
function name() {
    // pay attention because you need to use quotes properly
    // and account for possible quotes in the variable strings
    // to avoid both php and javascript errors
    // example assumes $val has been returned as a string
    // validate $val as needed using your method of choice
    var example1 = '<?php echo '"' . $val . '"'; ?>';
    var example2 = '<?php echo '"' . $value . '"'; ?>';
    var example3 = '<?php echo '"some other data"'; ?>';
    alert( example1 + ' / ' + example2 );
}
<?php
// you may even want to include additional files (.php or .js, etc)
@include 'local_path_to_some_other_js_file.js';
@include 'local_path_to_some_other_php_file.php';

exit;
?>

voici le truc:

1. voici votre 'PHP' pour utiliser cette variable:

   <?php 
       $name = 'PHP variable';
       echo '<script>';
       echo 'var name = ' . json_encode($name) . ';';
       echo '</script>';
   ?>
   

2. Maintenant vous avez une variable JS appelée 'name' , et voici votre 'Javascript' pour utiliser cette variable:

   <script>
        console.log("i am everywhere " + name);
   </script>
   

disons que votre variable est toujours entier, dans ce cas c'est plus facile

<?PHP
$number = 4;

echo '<script>';
echo 'var number = ' . $number . ';';
echo 'alert(number);';
echo '</script>';

?>

sortie :

<script>var number = 4;alert(number);</script>

disons que votre variable n'est pas un entier, mais si vous essayez la méthode ci-dessus vous obtiendrez quelque chose comme ceci:

<script>var number = abcd;alert(number);</script>

mais en javascript c'est une erreur de syntaxe.

donc en php Nous avons une fonction appelée json_encode qui code la chaîne pour un objet json.

<?PHP
$number = 'abcd';

echo '<script>';
echo 'var number = ' . json_encode($number) . ';';
echo 'alert(number);';
echo '</script>';

?>

depuis abcd dans json c'est "abcd" , donc il ressemble à ceci:

<script>var number = "abcd";alert(number);</script>

vous pouvez utiliser la même méthode pour les tableaux:

<?PHP
$details = [
'name' => 'supun',
'age' => 456,
'weight' => '55'
];

echo '<script>';
echo 'var details = ' . json_encode($details) . ';';
echo 'alert(details);';
echo 'console.log(details);';
echo '</script>';

?>

et votre javascript ressemble à ceci:

<script>var details = {"name":"supun","age":456,"weight":"55"};alert(details);console.log(details);</script>

sortie console

après de nombreuses recherches, j'ai trouvé la méthode la plus facile de passer toutes sortes de variables facilement.

dans votre script php, vous avez deux variables, et vous essayez de les envoyer à vos scripts js:

$php_var1 ="Hello world;
$php_var2 ="Helloow";
echo '<script>';
echo 'var js_variable1= ' . json_encode($php_var1) . ';';
echo 'var js_variable2= ' . json_encode($php_var2) . ';';
echo '</script>';

dans l'un de vos javascript appelé sur votre page, appelez simplement le vars.

J'espère avoir aidé quelqu'un !

je suppose que les données à transmettre sont une chaîne.

comme d'autres commentateurs l'ont déclaré, AJAX est une solution possible, mais les inconvénients l'emportent sur les avantages: il a une latence et il est plus difficile de programmer (il a besoin du code pour récupérer la valeur à la fois côté serveur et côté client), quand une fonction d'échappement plus simple devrait suffire.

donc, nous sommes de retour pour nous échapper. json_encode($string) œuvres si vous encoder la chaîne source UTF-8 d'abord dans le cas où il n'est pas déjà, parce que json_encode nécessite des données UTF-8. Si la chaîne est en ISO-8859-1, alors vous pouvez simplement utiliser json_encode(utf8_encode($string)) ; sinon vous pouvez toujours utiliser iconv pour faire la conversion en premier.

mais il y a un grand gotcha. Si vous l'utilisez dans des événements, vous devez exécuter htmlspecialchars() sur le résultat afin de le faire code correct. Et ensuite, vous devez soit faire attention à utiliser des guillemets doubles pour entourer l'événement, ou toujours ajouter ENT_QUOTES pour htmlspecialchars. Par exemple:

<?php
    $myvar = "I'm in \"UTF-8\" encoding and I have <script>script tags</script> & ampersand!";
    // Fails:
    //echo '<body onload="alert(', json_encode($myvar), ');">';
    // Fails:
    //echo "<body onload='alert(", json_encode($myvar), ");'>";
    // Fails:
    //echo "<body onload='alert(", htmlspecialchars(json_encode($myvar)), ");'>";

    // Works:
    //echo "<body onload='alert(", htmlspecialchars(json_encode($myvar), ENT_QUOTES), ");'>";
    // Works:
    echo '<body onload="alert(', htmlspecialchars(json_encode($myvar)), ');">';

    echo "</body>";

cependant, vous ne pouvez pas utiliser htmlspecialchars sur le code JS régulier (code inclus dans <script> ... </script> tags). Cela rend l'utilisation de cette fonction sujette à des erreurs, en oubliant htmlspecialchars le résultat lors de l'écriture du code d'événement.

il est possible d'écrire une fonction qui n'a pas ce problème, et peut être utilisée à la fois dans les événements et dans le code JS régulier, aussi longtemps que vous enfermez vos événements toujours entre guillemets simples ou doubles guillemets. Voici ma proposition, exigeant qu'ils soient en double guillemets (ce que je préfère):

<?php

// Optionally pass the encoding of the source string, if not UTF-8
function escapeJSString($string, $encoding = 'UTF-8')
{
    if ($encoding != 'UTF-8')
        $string = iconv($encoding, 'UTF-8', $string);
    $flags = JSON_HEX_TAG|JSON_HEX_AMP|JSON_HEX_APOS|JSON_HEX_QUOT|JSON_UNESCAPED_SLASHES;
    $string = substr(json_encode($string, $flags), 1, -1);
    return "'$string'";
}

la fonction nécessite PHP 5.4+. Exemple d'utilisation:

<?php
    $myvar = "I'm in \"UTF-8\" encoding and I have <script>script tags</script> & ampersand!";
    // Note use of double quotes to enclose the event definition!
    echo '<body onload="alert(', escapeJSString($myvar), ');">';
    // Example with regular code:
    echo '<script>alert(', escapeJSString($myvar), ');</script>';
    echo '</body>';

selon votre code

<$php
     $val = $myService->getValue(); // makes an api and db call
     echo '<span id="value">'.$val.'</span>';
$>

Maintenant vous pouvez obtenir la valeur en utilisant DOM, utilisez innerHTML de span id, dans ce cas vous n'avez pas besoin de faire un appel au serveur, ou ajax ou autre chose.

votre page va l'imprimer en utilisant php, et vous javascript va obtenir la valeur en utilisant DOM.

C'est comme ça que je le fais (il y a plusieurs façons):

1. Convertissez les données en JSON
2. Appel AJAX recevoir JSON fichier
3. Convertir JSON en Javascript objet

exemple:

étape 1

<?php

   $servername = "localhost";
   $username = "";
   $password = "";
   $dbname="";
   $conn = new mysqli($servername, $username, $password,$dbname);

   if ($conn->connect_error) {
      die("Connection failed: " . $conn->connect_error);
   } 

   $sql = "SELECT id, name ,image FROM phone";
   $result = $conn->query($sql);

   while($row =$result->fetch_assoc()){ 
      $v[]=$row;    
   }

  echo json_encode($v);

  $conn->close();
?>

étape 2

function showUser(fnc) {
   var xhttp = new XMLHttpRequest();

   xhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
         // STEP 3    
         var p=JSON.parse(this.responseText);}
       }
    }

    <?php 
    $your_php_variable= 22;
    echo "<script type='text/javascript'>var your_javascript_variable = $your_php_variable;</script>";  
    ?>

et ça marchera. Il s'agit simplement d'assigner une variable javascript et de passer ensuite la valeur d'une variable php existante. Depuis php écrit le javascript lignes ici, il a la valeur de la variable php et peut passer directement.

pour ceux qui ont un problème en utilisant le code ci-dessous et il continue d'afficher <?php echo $username?> ou quelque chose comme ça.Allez éditer le httpd.conf dans la section mime_module par add this ' AddType application / x-httpd-php .HTML. htm' car il peut être désactivé par défaut.

   <?php
        $username = 1;
    ?>

    <script type="text/javascript">
        var myData = <?php echo $username ?>;
        console.log(myData);
        alert(myData);
    </script>