是否基于被认为有害的服务器端逻辑有条件地回应Javascript代码?

时间:2012-07-25 21:03:52

标签: php javascript jquery html

像这样:

<script>
    setSomeStuffUp();

    <?php if ($otherStuffNeedsToBeDone === true) { ?>

         doSomeOtherStuff();

    <?php } ?>

    breakSomeStuffDown();
</script>

在工作中遇到类似这样的事情 - 完成模板化(Smarty),所以它看起来更清洁 - 但不是很多!还回应了一些用于诸如jQuery选择器之类的模板变量,以及其他一些令人不愉快的位。

这样做的正确方法是什么?通过AJAX将需要用于逻辑的数据作为JSON加载到JS中? HTML数据属性?

关于它的一些东西只是闻起来很糟糕,糟糕,糟糕。

谢谢大家。

5 个答案:

答案 0 :(得分:4)

使用语言X以语言Y生成代码是不好的做法。

尝试解耦&#34;这两种语言,例如:

<script type="text/javascript">
  var data = {
    id: "<?php echo $id ?>",
    ...
  };

  $(document).ready(function(){
     $("#" + data.id).on("click", function(){
       /*do something*/
     });
  });
</script>

这样,PHP只关心填充数据结构,JavaScript只关心消费数据结构。

答案 1 :(得分:3)

从服务器回收配置变量和一些javascript初始化代码通常听起来不是太糟糕,但是如果这样的 js-injection-from-server 部分到处都是,那么你就是对的,这很难看,至少因为这样的代码难以管理。

尝试集中任何类型的初始化,并在静态定义的客户端JavaScript逻辑中完成其余工作。

UPD。 @Oscar Jara正在谈论同样的事情,并提供了一个很好的例子。但是,如果服务器端逻辑通过HTML为JavaScript处理提供数据(毕竟,这就是HTML的用途),甚至可以避免这种情况。

这是一个经常遇到的简单例子。假设您要输出一个将通过JavaScript增强为轮播的图库。

服务器生成的HTML:

<ul id="myGallery">
  <li><img src="img1.jpg /></li>
  <li><img src="img2.jpg /></li>
  <li><img src="img3.jpg /></li>
  ...
</ul>

然后,当DOM准备就绪时,您的静态JavaScript代码会初始化轮播:

// when DOM ready...
AwesomeCarousel.init($('#myGallery'));

这里服务器准备的数据就是这段带有图像列表的HTML,无需生成明确加载每个图像的JavaScript。您可以通过data-*属性传递任意数据。

答案 2 :(得分:2)

就个人而言,我在很多情况下都在JS中使用PHP。有时它是用JSON数据,页面ID或类似的东西填充变量。就我而言,PHP旨在编写页面上显示的代码,而JS则设计为在内容存在后与用户进行交互。

我确实得到了你所说的,因为这可能是更简洁的方法。你提到了AJAX,它可能更干净,肯定会帮助输出文档的流程。唯一的问题是你必须向服务器发出第二个请求以获得一些非常简单和卑鄙的变量。几毫秒并不是很大,但在生产网站中,您可能不希望发出额外的请求并阻塞服务器资源。

响应最干净的方式,如果这是一个很大的交易...我会用该代码创建一个单独的JS文件,然后使用服务器包含该单个文件(如果需要)。同样,我不这样做,但我认为它在模板中看起来最干净。

答案 3 :(得分:2)

如果你想真正离开那里,你可以让HTML页面请求一个.js文件,加上他们的session-id或者他们是谁的其他指标,将.js调用作为PHP调用,根据会话需要动态构建JS,然后将其作为.js文件类型输出回浏览器。

但这是很多工作。

如果您想要的东西闻起来更少,请让PHP在文件末尾转储一个JSON字符串:

var cfg_string = "{\"username\":\"Norguard\", \"new_messages\":[......]}";  // client

$cfg_obj = array(); // whole lot o'PHP
$json_encoded_cfg = json_encode($cfg_obj);
echo "var cfg_string = {$json_encoded_cfg};" //server-side

然后在客户端解析它以增加安全性......

...或者直接在模板中创建地图:

$cfg_string = "var dataMap = {";
foreach ($cfg_obj as $key => $val) {
   // print key:val all pretty-like,
   // handle commas (ie: no trailing comma at the end), indent with tabs or spaces
   // if you want, count the number of items so that the object closes ({})
   // without any newline operator, if there are no config settings 
}
echo $cfg_string;

这些都是干净且不引人注意的,并且将一切都分开。 无论您的初始化/加载代码是什么,配置数据/文本都可以在上面,并作为参数传递给该init-logic。

答案 4 :(得分:1)

如果你所做的只是将数据从服务器端语言传递给JavaScript代码,那就没问题了。那里有很多CMS包。

我并不认为有必要在服务器端有条件地生成JavaScript代码。也许有一个用例,但JavaScript本身就是一种语言,那么为什么不把逻辑放在JavaScript代码中呢?