PHP bir değişken var, ve JavaScript kodunu kullanarak, kendi değer ihtiyacım var. Nasıl JavaScript için PHP benim değişken alabilir miyim?

Şuna benzer bir kod var:

<$php
     ...
     $val = $myService->getValue(); // makes an api and db call
$>

val gereken JavaScript kodu var ve bu çizgiler görünüyor:

<script>
    myPlugin.start($val); // tried this, didn't work
    <?php myPlugin.start($val); ?> // this didn't work either
    myPlugin.start(<?=$val?> // this works sometimes, but sometimes it fails
</script>

Aslında bunu yapmak için birçok yöntem vardır. Biraz daha yükü diğerlerinden daha gerektirir, ve bazıları diğerlerinden daha iyi olarak kabul edilir.

Özel bir sırada:

1. AJAX sunucudan ihtiyacınız olan verileri almak için kullanın.
2. Sayfa verileri bir yerde yankı ve JavaScript DOM bilgileri almak için kullanın.
3. Verileri doğrudan JavaScript Echo.

Bunları uygulamak için nasıl yanı sıra bu yazı, yukarıdaki yöntemlerin her muayene ve her artılarını ve eksilerini göreceğiz.

1. AJAX sunucudan ihtiyacınız olan verileri almak için kullanın

Bu yöntem en iyi, çünkü kabul edilirsunucu tarafı ve istemci tarafı komut tamamen ayrıdır.

Artıları

• Katmanları arasında daha iyi bir ayrımYarın PHP kullanarak durdurmak ve bir sunucu uygulaması, bir REST API, ya da başka bir servise taşımak istiyorsanız, JavaScript kodu pek bir değişiklik yok.
• Daha okunabilir- JavaScript JavaScript, PHP PHP. İki karışmadan, her iki dilde daha okunabilir kodu almak.
• Zaman uyumsuz veri aktarımı sağlar- PHP bilgi almak, zaman, kaynaklar, pahalı olabilir. Bazen sadece bilgi için bekle, sayfayı yüklemek ve bilgileri her zaman ulaşmak istemez.
• Doğrudan veri biçimlendirme bulunamadı- Bu biçimlendirme herhangi bir ek veri temiz tutulur anlamına gelir, ve sadece JavaScript görüyor.

İnş

• Gecikme- AJAX, bir HTTP isteği oluşturur, ve HTTP istekleri ağ taşınan ve ağ gecikmeleri var.
• Devlet- Veri ayrı bir HTTP isteği ile getirilen HTML belgesi getirilen bir HTTP isteği için herhangi bir bilgi içermez. Bu bilgiyi (HTML belgesi bir form teslimi için yanıt olarak oluşturulan gibi) gerekebilir ve eğer yaparsan, bir şekilde transfer karşısında olacak. Veri gömme sayfasında dışladı varsa, bu tekniği kullanarak eğer varsa) daha sonra ise Yarış koşullara tabi olabilir hangi oturumlar/çerezler için sınırlar.

Uygulama Örneği

AJAX ile, iki sayfaya ihtiyacınız, bir PHP çıktısını oluşturur ve ikinci JavaScript çıktı alır

get-data.php

/* Do some operation here, like talk to the database, the file-session
 * The world beyond, limbo, the city of shimmers, and Canada.
 * 
 * AJAX generally uses strings, but you can output JSON, HTML and XML as well. 
 * It all depends on the Content-type header that you send with your AJAX
 * request. */

echo json_encode(42); //In the end, you need to echo the result. 
                      //All data should be json_encode()d.

                      //You can json_encode() any value in PHP, arrays, strings,
                      //even objects.

index.php (ya da gerçek sayfa gibi adı ne olursa olsun)

<!-- snip -->
<script>
    function reqListener () {
      console.log(this.responseText);
    }

    var oReq = new XMLHttpRequest(); //New request object
    oReq.onload = function() {
        //This is where you handle what to do with the response.
        //The actual data is found on this.responseText
        alert(this.responseText); //Will alert: 42
    };
    oReq.open("get", "get-data.php", true);
    //                               ^ Don't block the rest of the execution.
    //                                 Don't wait until the request finishes to 
    //                                 continue.
    oReq.send();
</script>
<!-- snip -->

İki dosya yukarıdaki kombinasyon dosya yükleme tamamlandığında 42 uyaracaktır.

Okuma malzemesi biraz daha fazla

• Using XMLHttpRequest - MDN
• XMLHttpRequest object reference - MDN
• How to return the response from an Ajax call?

2. Sayfa verileri bir yerde yankı ve JavaScript DOM bilgileri almak için kullanın

Bu yöntem, AJAX için daha az tercih edilir, ama yine de kendine göre avantajları var. HalanispetenPHP yok bu bir anlamda doğrudan JavaScript içinde PHP ve JavaScript arasında ayrılmış.

Artıları

• Hızlı- DOM işlemleri genellikle hızlı ve çok miktarda veri nispeten hızlı bir şekilde mağaza erişebilirsiniz.

İnş

• Potansiyel Olarak Unsemantic Biçimlendirme- Genellikle, ne olur ki kullandığınız bir çeşit <input type=hidden> mağaza bilgileri, çünkü kolay elde edilen bilgileri inputNode.value ama ne kadar anlamı var anlamsız bir öğesi HTML. HTML belgesi hakkında veri için <meta> öğe vardır, ve HTML 5 özellikle belirli unsurları ile ilişkili olabilir JS ile okuma için veri data-* öznitelikleri tanıttı.
• Dirties. Kaynak- PHP oluşturduğu veri doğrudan HTML kaynak, daha büyük ve daha az odaklanmış bir HTML kaynak olsun anlam işitilir.
• Daha yapılandırılmış veri almak için- Yapılandırılmış veri geçerli HTML olmak zorunda olacak, aksi halde kaçmak ve dizeleri kendini dönüştürmek zorunda kalacaksın.
• Sıkıca çiftler veri mantığınıza PHPPHP sunum kullanıldığı için, iki temiz bir şekilde ayıramazsınız.

Uygulama Örneği

Bu, fikir kullanıcıya görüntülenmez, ancak görünür JavaScript olan eleman bir tür oluşturmak için.

index.php

<!-- snip -->
<div id="dom-target" style="display: none;">
    <?php 
        $output = "42"; //Again, do some operation, get the output.
        echo htmlspecialchars($output); /* You have to escape because the result
                                           will not be valid HTML otherwise. */
    ?>
</div>
<script>
    var div = document.getElementById("dom-target");
    var myData = div.textContent;
</script>
<!-- snip -->

3. Verileri doğrudan JavaScript Echo

Bu muhtemelen anlamak için en kolay ve kullanımı en korkunç olur. Ne yaptığınızı bilmiyorsanız, bunu yapma.

Artıları

• Çok kolay uygulanabilir- Çok az, bunu uygulamak için gereken, ve anlamak.
• Kirli olmayan kaynak- Değişkenler DOM etkilememek doğrudan JavaScript işitilir.

İnş

• Güvensiz- PHP hiçbir önemsiz JavaScript kaçış işlevleri vardır, ve uygulamak için önemsiz değiller. Kullanıcı girişlerini kullanarak özellikleson dereceikinci kademe enjeksiyon karşı savunmasız.Tartışmalıyorumlara bakın
• Sıkıca çiftler veri mantığınıza PHPPHP sunum kullanıldığı için, iki temiz bir şekilde ayıramazsınız.
• Yapılandırılmış veri zordur- Muhtemelen JSON yapabilirsin... biraz. Ama XML ve HTML özel dikkat gerektirir.

Uygulama Örneği

Uygulama nispeten basittir:

<!-- snip -->
<script>
    var data = <?php echo json_encode("42"); ?>; //Don't forget the extra semicolon!
</script>
<!-- snip -->

İyi şanslar!