摘要:为了开启这套账户系统和界面,我们需要去添加相关的包。使用,而不是在文件加入开始这段代码只会在客户端执行加入结束添加用户关联功能现在你已经可以创建账户并登录你的应用程序了。例如包含了已登陆用户的用户名。
添加多用户账户
Meteor带来了一套账户系统然后顺便还带了用户界面来让你可以在几分钟之内在你的应用中添加多用户功能
目前,这套UI组件使用Blaze作为默认的UI引擎,在未来,可能会以React的专有组件来将其替换。
为了开启这套账户系统和UI界面,我们需要去添加相关的包。在你的应用目录中,执行下面的命令:
meteor add accounts-ui accounts-password用React来包装一个Blaze组件
为了从accounts-ui这个包中使用Blaze UI组件,我们需要用React的组件来把他包装一下。
来创建一个叫AccountsUIWrapper的新组件吧。
// 新文件 AccountsUIWrapper AccountsUIWrapper = React.createClass({ componentDidMount() { // Use Meteor Blaze to render login buttons this.view = Blaze.render(Template.loginButtons, React.findDOMNode(this.refs.container)); }, componentWillUnmount() { // Clean up Blaze view Blaze.remove(this.view); }, render() { // Just render a placeholder container that will be filled in return ; } });
我们只需要在App组件中定义一下就可以包含这个组件了:
Hide Completed Tasks: "" } // 修改结束
最后,添加语句,使之可以在每个文本之前显示用户名
checked={this.props.task.checked}
onClick={this.toggleChecked} />
// 修改开始
{this.props.task.username}: {this.props.task.text}
// 修改结束
);
}
在你的浏览器中,添加一些任务,然后你会看到你的用户名出现了。那些这一步骤之前的老任务并不会有附上名字。尽管删掉就是了
现在,用户可以登陆,我们也可以跟踪每一个任务的所属用户。让我们来更深层次的思考一下我们刚刚发现的概念。
自动的账户界面这段翻译的不好,最好看原版:https://www.meteor.com/tutorials/react/adding-user-accounts
如果我们的应用有accounts-ui包,我们必须去做的是通过渲染被包含的UI组件来添加登陆下拉框。这个下拉框会检测登陆方法是否被加入到了app中,并适当的展示控制(界面)。在我们这一部分,开启了login方法的只有accounts-password,因此,下拉框展示了password字段。如果你比较喜欢更进一步,你也可以添加accounts-facebook包,这样就可以在你的应用中开启Facebook登陆方式 -- Facebook按钮将会自动的在你的下拉框中出现。
从已登陆用户中获取信息在你的getMeteorData方法中,你可以使用Meteor.user()来确认用户是否已登陆,你也可以通过这个来获取信息。例如:Meteor.user().username包含了已登陆用户的用户名。你也可以用Meteor.userId()来调整当前用户的_id
在下一个步骤,我们将学习如何在服务器端通过数据验证来使我们的应用更加安全
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/86081.html
摘要:在安卓设备上运行安卓应用首先,把上面关于安卓的部分都走完,以确保你的电脑上安装了所有的安卓工具。还有一件事你在真实设备上运行之前,必须得退出安卓模拟器。 在安卓和苹果上运行你的应用 目前Windows平台的Meteor并不支持移动应用的构建,如果你正在使用Windows平台的Meteor,你得跳过这一步了。 现在来看,我们编写我们的应用,测试我们的应用都是在浏览器上,其实Meteor早...
摘要:通过发布订阅模式过滤数据现在我们已经把应用中比较敏感的代码放到了一些方法里面,我们还需要学习安全故事的另一半内容了。当在客户端被调用时传入发布器名称,客户端将会从发布器订阅所有的数据。这个按钮应该只是给任务的所有者来显示。 通过发布订阅模式过滤数据 现在我们已经把应用中比较敏感的代码放到了一些方法里面,我们还需要学习Meteor安全故事的另一半内容了。到现在为止,我们一直是假设整个整个...
摘要:在上,最好的方法就是通过声明方法。这些方法叫做还有,这将会替换执行的方法。我们做这些是为了开启一个我们称之为乐观的的特性。客户端向服务器端发送一个在安全环境下的请求。 方法的安全性 在这个步骤之前,这款应用的任何用户都可以修改数据库的任何部分,在一个非常有意思的小项目或者演示项目中可能已经不错了,但是任何一个真实的应用都需要对这些数据进行权限控制。在Meteor上,最好的方法就是通过声...
摘要:添加,删除,确认完成这些操作,你将会看到你的应用的界面响应非常的快。。这是因为并不会在更新用户界面之前等着服务端的响应数据。 部署你的应用 现在你有了一个可以运行的待办事宜的应用,你可以分享给你的朋友们!Meteor使得发布你的应用到其他人可以使用的互联网变得非常的简单。 同样是在你的应用文件夹的命令行中输入: meteor deploy my_app_name.meteor.com ...
摘要:通过表单添加任务在这个步骤,我们将为用户在列表上添加输入框。在中,这是一种监听浏览器事件的方式,就像是在表单上有提交事件一样。这对一个任务列表来说并不是非常好。在下一步,我们将给待办事宜的列表添加一个非常重要的功能已完成功能和删除功能 通过表单(form)添加任务 在这个步骤,我们将为用户在列表上添加输入框。 首先,在App.jsx文件中App组件上添加表单吧。 Tod...
阅读 1725·2021-11-11 16:55
阅读 2502·2021-08-27 13:11
阅读 3590·2019-08-30 15:53
阅读 2273·2019-08-30 15:44
阅读 1233·2019-08-30 11:20
阅读 987·2019-08-30 10:55
阅读 891·2019-08-29 18:40
阅读 2962·2019-08-29 16:13