Question

secrets.meteor.com是一个简单的应用程序，其中每个用户键入一些内容，并在提交时通过应用程序实时发送消息，供所有人查看，然后将其删除以显示下一条消息。

为实现这一目标，究竟采取了哪些措施？对于这个愚蠢的问题，我感到很遗憾，但我已经广泛研究了这是如何制作的，并且什么也没看到。每个消息是一个传递函数然后执行和删除吗？

警告 secrets.meteor.com没有清理使用输入!!如果您输入<script>alert('hi')</script>，则会看到提醒，这意味着任何人都可以在您的计算机上运行javascript。如果您真的想查看该网站，可以在隐身窗口中打开它。

Answer 1

使用流星可以很容易地完成。你不必做太多事情。

- javascript文件

 if (Meteor.isClient) {
  Template.yourTemplate.events({
    'submit form': function(event){
      event.preventDefault();
      var message= event.target.messageInput.value;
      console.log(message)
      Session.set('messagetoDisplay', message);
    }
  });

  Template.yourTemplate.helpers({
    message: function(){
      return  Session.get('messagetoDisplay');
    }
  })
}

--- html模板。

<body>
{{>yourTemplate}}

</body>
<template name="yourTemplate">
    {{message}}

    <form>
        <input type="text" name="messageInput">
        <input type="submit" value="submit">
    </form>
</template>

Answer 2

这是一个完整的答案，实际上展示了多台计算机的反应性。

Working Demo in MeteorPad

<强> LIB / collections.js

Secrets = new Mongo.Collection("secrets");

<强>的客户机/ templates.js

Template.body.helpers({
  secret: function () {
    return Secrets.findOne({}, { sort: { date: -1} });
  }
});

Template.body.events({
  'submit form': function (e) {
    // prevent page action
    e.preventDefault();

    // get value
    var message = event.target.mySecret.value;

    // insert into database
    Secrets.insert({
      text: message,
      date: new Date()
    });

    // clear form
    event.target.mySecret.value = "";
  }
});

<强> main.html中

<body>
  {{secret.text}}

  <form>
    <input type="text" name="mySecret" placeholder="Say Something..." />
    <input type="submit" value="Post It"/>
  </form>

</body>

什么用于像secrets.meteor这样的东西？

2 个答案:

Working Demo in MeteorPad