から変数やデータを渡す方法 PHP JavaScriptへの

Question

PHPには変数があり、JavaScriptコードにはその値が必要です。変数をPHPからJavaScriptに変換するにはどうすればよいですか。

このようなコードがあります。

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

私はvalを必要とし、以下の行に沿って見えるJavaScriptコードを持っています。

<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>

Answer 1

実際にこれを行うにはいくつかのアプローチがあります。他のものよりもオーバーヘッドが必要なものもあれば、他のものよりも優れていると考えられるものもあります。

順不同：

1. AJAXを使用して、サーバーから必要なデータを取得します。
2. データをどこかのページにエコーし、JavaScriptを使用してDOMから情報を取得します。
3. データをJavaScriptに直接エコーします。

この投稿では、上記の各メソッドを調べ、それぞれの長所と短所、およびそれらの実装方法を確認します。

1. AJAXを使用して、サーバーから必要なデータを取得します

サーバー側とクライアント側のスクリプトは完全に分離されているため、この方法が最適と見なされます。

長所

• レイヤー間のより良い分離-明日PHPの使用をやめ、サーブレット、REST AP​​I、またはいくつかに移動したい場合他のサービスでは、JavaScriptコードの多くを変更する必要はありません。
• 読みやすい-JavaScriptはJavaScript、PHPはPHPです。 2つの言語を混在させることなく、両方の言語でより読みやすいコードを取得できます。
• 非同期データ転送を許可します-PHPから情報を取得するのは、時間/リソースがかかる場合があります。情報を待ち、ページをロードし、いつでも情報にアクセスしたくない場合があります。
• データはマークアップに直接見つかりません-これは、マークアップに追加データがないことを意味し、JavaScriptのみがそれを認識できることを意味します。

短所

• Latency-AJAXはHTTPリクエストを作成し、HTTPリクエストはネットワーク上で実行され、ネットワークレイテンシが発生します。
• State-別のHTTPリクエストを介してフェッチされたデータには、HTMLドキュメントをフェッチしたHTTPリクエストからの情報は含まれません。この情報が必要になる場合があります（たとえば、フォーム送信に応じてHTMLドキュメントが生成される場合）。必要な場合は、何らかの方法で情報を転送する必要があります。ページにデータを埋め込むことを除外している場合（この手法を使用している場合）、競合状態の可能性のあるCookie /セッションに制限されます。

実装例

AJAXでは、2つのページが必要です。1つはPHPが出力を生成する場所、もう1つはJavaScriptがその出力を取得する場所です。

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（または実際のページの名前は何でも）

<!-- 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 -->

上記の2つのファイルの組み合わせは、ファイルの読み込みが完了すると42を警告します。

読み物

• XMLHttpRequest-MDNを使用
• XMLHttpRequestオブジェクト参照-MDN （
• 非同期呼び出しから応答を返すにはどうすればよいですか？

2.データをページのどこかにエコーし、JavaScriptを使用してDOMから情報を取得します

この方法はAJAXよりも好ましくありませんが、それでも利点があります。 JavaScriptに直接PHPがないという意味で、PHPとJavaScriptの間はまだ比較的分離されています。

長所

• Fast-DOM操作はしばしば迅速であり、多くのデータを比較的迅速に保存およびアクセスできます。

短所

• 潜在的に意味のないマークアップ-通常は、情報を取得するのが簡単なため、何らかの情報を格納するために何らかの<input type=hidden>を使用しますinputNode.valueの外ですが、そうすることは、HTMLに無意味な要素があることを意味します。 HTMLには、ドキュメントに関するデータの<meta>要素があり、HTML 5では、特定の要素に関連付けることができるJavaScriptでの読み取り専用のデータにdata-*属性が導入されています。
• ソースを汚します-PHPが生成するデータはHTMLソースに直接出力されます。 HTMLソース。
• 構造化データを取得するのが難しい-構造化データは有効なHTMLである必要があります。そうでない場合は、文字列をエスケープして自分で変換する必要があります。
• PHPをデータロジックに密結合します-プレゼンテーションでPHPが使用されるため、分離できません二人はきれいに。

実装例

これにより、ユーザーには表示されないがJavaScriptには表示される何らかの要素を作成するという考え方です。

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.データをJavaScriptに直接エコーする

これがおそらく最も理解しやすいでしょう。

長所

• 非常に簡単に実装できます-これを実装して理解するのに必要なことはほとんどありません。
• ソースをダーティにしません-変数はJavaScriptに直接出力されるため、DOMは影響を受けません。

短所

• PHPをデータロジックに密結合します-プレゼンテーションでPHPが使用されるため、分離できません二人はきれいに。

実装例

実装は比較的簡単です。

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

がんばろう！

Answer 2

私はより簡単な答えを試してみます：

問題の説明

まず、サーバーからページが提供されるときのイベントの流れを理解しましょう。

• 最初にPHPが実行され、クライアントに提供されるHTMLが生成されます。
• 次に、HTMLがクライアントに配信されます。PHPが完了したら、コードがサーバーを離れると、PHPが完了し、次のことができることを強調します。もうアクセスしません。
• 次に、JavaScriptを含むHTMLがクライアントに到達し、クライアントはそのHTMLでJavaScriptを実行できます。

したがって、ここで覚えておくべき重要なことは、HTTPがステートレスであることです。リクエストがサーバーを離れると、サーバーはそれにアクセスできません。そのため、オプションは次のようになります。

1. クライアントからさらにリクエストを送信しますafter最初のリクエストが完了しました。
2. 最初のリクエストでサーバーが言わなければならないことをエンコードします。

解決策

それがあなた自身に問うべき核心的な質問です：

ウェブサイトまたはアプリケーションを書いていますか？

ウェブサイトは主にページベースであり、ページの読み込み時間は可能な限り速くする必要があります（たとえば-Wikipedia）。 WebアプリケーションはAJAXにより重く、クライアントとの高速な情報を取得するために多くのラウンドトリップを実行します（たとえば、ストックダッシュボード）。

ウェブサイト

最初のリクエストが完了した後、クライアントからより多くのリクエストを送信すると、slowになります。これは、オーバーヘッドが大きいHTTPリクエストがさらに必要になるためです。さらに、AJAXリクエストを作成するには、完了時にハンドラが必要になるため、asynchronousityが必要です。

not別のリクエストを行うことをお勧めしますサイトがアプリケーションでない限りサーバーからその情報を取得します。

hugeが変換時間と読み込み時間に影響する高速の応答時間が必要です。この場合、Ajaxリクエストの初期アップタイムは遅く、不要です。

問題に取り組むには2つの方法があります

• Cookieを設定します-Cookieは、サーバーとクライアントの両方が読み取ることができるHTTP要求で送信されるヘッダーです。
• 変数をJSONとしてエンコードする-JSONはJavaScriptオブジェクトに非常に近く、most JSONオブジェクトは有効なJavaScript変数です。

Cookieの設定 は実際にはそれほど難しくなく、値を割り当てるだけです。

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

次に、 JavaScriptで読むdocument.cookieを使用して：

これは短い手巻きのパーサーですが、このすぐ上にリンクした答えは、よりよくテストされたものです。

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.

クッキーは少量のデータに適しています。これは、追跡サービスがよく行うことです。

データが増えたら、代わりにJavaScript変数内のJSONでエンコードできます。

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

$valueがPHP側のjson_encodeableであると仮定します（通常はそうです）。この手法は、たとえば、Stack Overflowがチャットで行うことです（PHPの代わりに.NETのみを使用）。

応用

アプリケーションを作成している場合-突然、初期ロード時間はアプリケーションの継続的なパフォーマンスほど重要ではなく、データとコードを別々にロードすることで成果が出始めます。

私の答え here は、JavaScriptでAJAXを使用してデータをロードする方法を説明します。

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();

またはjQueryで：

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

ここで、サーバーには、データを取得してそれを処理するコードを含む/your/urlルート/ファイルを含めるだけでよいのです。

<$php
     ...
     $val = myService->getValue(); // Makes an API and database call
     echo json_encode($val); // Write it to the output
 $>

このように、JavaScriptファイルはコードやレイアウトを要求するのではなく、データを要求して表示します。これはよりクリーンで、アプリケーションが高くなるにつれて成果を上げ始めます。また、懸念事項をより適切に分離し、サーバー側のテクノロジーを使用せずにクライアント側のコードをテストすることもできます。

追記：PHPから何かを注入するとき、XSS攻撃ベクトルに注意する必要があります非常に JavaScript。 very値を適切にエスケープするのは難しく、コンテキスト依存です。 XSSの処理方法がわからない場合、またはXSSを知らない場合は、 このOWASP記事 、 this one 、および this question をお読みください。

Answer 3

私は通常htmlでdata- *属性を使います。

<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>

この例ではjQueryを使用していますが、他のライブラリやVanilla Javascriptにも適用できます。

データセットプロパティの詳細については、こちらをご覧ください。 https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset

Answer 4

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

json_encode（）には以下が必要です。

• PHP 5.2.0以上
• $PHPVarはUTF-8、Unicodeとしてエンコードされています。

Answer 5

次のいずれかの方法を使用してください。

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

_または_

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

Answer 6

これを試して

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

-

- しばらく試した後は動作しますが、パフォーマンスが低下します。 JavaScriptはユーザー側ですがphpはサーバー側のスクリプトです。

Answer 7

私はWordpressがその enqueue および localize 関数を使って動作する方法がとても好きなので、そのモデルに従って、スクリプトの依存関係に従ってスクリプトをページに追加し、追加データを作成するための簡単なクラスを書きました。スクリプトで利用可能です。

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;
        }
    }
}

enqueue_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();

そして、上記の例のprint_scripts()メソッドはこの出力を送信します。

<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>

スクリプト 'jquery'が 'jquery-ui'の後にエンキューされているという事実に関係なく、 'jquery-ui'で定義されているので 'jquery'に依存しているため、前に印刷されます。 'custom-script'の追加データは新しいスクリプトブロック内にあり、その前に配置されます。追加データを保持するmydataオブジェクトが含まれています。これは 'custom-script'で使用可能になりました。

Answer 8

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

$valはjavascriptに関する限り未定義であるため、うまくいきません。 phpは$valに対して何も出力しませんでした。ブラウザでソースを表示してみてください。

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

そして

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

PhpはmyPluginを定数として扱おうとし、それが失敗するとそれを文字列'myPlugin'として扱おうとしますが、これはphp関数start()の出力と連結しようとします。致命的なエラーを引き起こす

そして

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

これは最もうまくいく可能性がありますが、phpは期待される引数で有効なjavascriptを生成しているので、失敗した場合、おそらくmyPluginはまだ準備ができていないためです。実行順序を確認してください。

また、PHPの出力は安全ではなく、json_encode()でフィルタリングする必要があることにも注意してください。

_編集_

myPlugin.start(<?=$val?>に括弧がないことに気付かなかったので： - \

@Second Rikudoが指摘しているように、正しく機能するためには$valに右括弧を含める必要があります。例：$val="42);"

これは、phpがmyPlugin.start(42);を生成し、JavaScriptによって実行されたときに期待通りに動作することを意味します。

Answer 9

私はPHPを使ってJavaScript変数を割り当てる簡単な方法を思いついた。

HTML5データ属性を使用してPHP変数を格納してから、ページロード時にJavaScriptに割り当てます。

完全なチュートリアルを見つけることができます ここ

例：

<?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

Hersは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");
}

Answer 10

1. データを _ json _ に変換します。
2. _ ajax _ を呼び出して _ json _ fileを受け取る
3. _ json _ を Javascript objectに変換

例：

ステップ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();
?>

ステップ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);
      }
   }
}

Answer 11

これは私がオプションとして投稿されているのを見ないものです。これはajaxを使用するのと似ていますが、明らかに異なります。

まず、スクリプトのソースを直接PHPファイルに設定します。

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

この例のように、変数をPHPファイルに戻すこともできます。

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

それから "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;
?>

Answer 12

これがトリックです：

1. ここにあなたの 'PHP' がその変数を使うためのものです：

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

2. 'name'という名前のJS変数があります。その変数を使用するための 'Javascript' がここにあります。

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

Answer 13

多くの調査の結果、私はあらゆる種類の変数を簡単に渡す最も簡単な方法を見つけました。

サーバースクリプトには2つの変数があり、それらをクライアントスクリプトに送信しようとしています。

$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>';

ページで呼び出されたJavaScriptのいずれかで、単にそれらの変数を呼び出します。

Answer 14

変数が常に整数であるとしましょう。その場合、これはより簡単です。

<?PHP
$number = 4;

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

?>

出力 ：

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

あなたの変数が整数ではないとしましょう、しかしあなたが上記の方法を試みるならば、あなたはこのような何かを得るでしょう：

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

しかしJavaScriptではこれは構文エラーです。

そのため、phpでは、文字列をjsonオブジェクトにエンコードする関数呼び出しjson_encodeがあります。

<?PHP
$number = 'abcd';

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

?>

jsonのabcd以降は"abcd"なので、次のようになります。

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

配列にも同じ方法を使用できます。

<?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>';

?>

そしてあなたのJavaScriptはこのようになります：

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

コンソール出力

Answer 15

送信するデータは文字列だと思います。

他のコメンターが述べているように、AJAXが1つの可能な解決策を上回っています：それは待ち時間を持ち、プログラムするのがより困難です（サーバーとクライアントの両方の値を取得するコードが必要です）より単純なエスケープ関数で十分なはずです。

だから、私たちは脱出に戻りました。 json_encode($string)は動作します if json_encodeはUTF-8データを必要とするので、ソース文字列をUTF-8としてエンコードします（まだそうでない場合）。文字列がISO-8859-1のものであるならば、あなたは単にjson_encode(utf8_encode($string))を使うことができます。それ以外の場合は、常に最初に変換を行うためにiconvを使用できます。

しかし、大きな問題があります。あなたがイベントでそれを使っているのなら、正しいコードにするために結果に対してhtmlspecialchars()を実行する必要があります。そして、イベントを囲むために二重引用符を使用するように注意するか、常にhtmlspecialcharsにENT_QUOTESを追加する必要があります。例えば：

<?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>";

ただし、通常のJSコード（<script>...</script>タグで囲まれたコード）にhtmlspecialcharsを使用することはできません。それは、イベントコードを書くときに結果をhtmlspecialcharsすることを忘れることによって、この関数を誤って使用することを引き起こします。

イベントを常に一重引用符または常に二重引用符で囲む限り、その問題がなく、イベントと通常のJSコードの両方で使用できる関数を作成することは可能です。これが私の提案です。二重引用符で囲む必要があります（私が好む）。

<?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'";
}

この関数にはPHP 5.4以降が必要です。使用例

<?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>';

Answer 16

あなたのコードに従って

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

DOMを使用して値を取得したり、span IDのinnerHTMLを使用したりできるようになりました。この場合は、サーバーへの呼び出し、またはajaxなどの操作は不要です。

あなたのページはphpを使ってそれを印刷し、あなたはjavascriptはDOMを使って価値を得るでしょう。

Answer 17

<?php

    $val = $myService->getValue(); // Makes an API and database call

    echo "
        <script>
            myPlugin.start({$val});
        </script> ";

?>