Meteor:使用Iron Router的用户配置文件页面

Question

我正在努力创建一个用户配置文件页面,使用位于的铁路由器localhost:3000/:username.配置文件页面应具有以下特征:

• 公共视图 - 任何人都可以看到有关用户的基本信息
• 私人视图 - 如果客户在登录时访问他或她自己的个人资料页面,则会显示他或她的敏感用户数据,并且他们具有编辑功能
• 加载视图 - 在提取用户配置文件数据时,显示加载屏幕
• 找不到视图 - 如果在URL中输入了无效的用户名,则返回未找到的页面.

公共视图和私有视图应存在于同一 URL路径中.根据客户端的凭据,他们会看到一个或另一个没有重定向到其他页面.未找到的页面也不应该重定向,这样如果输入无效的用户名,用户仍然可以在浏览器URL栏中看到无效的URL.

我的router.js文件:

this.route('profile', {
    controller: 'ProfileController',
    path: '/:username'
  });

在内ProfileController,我正在努力拼凑以下内容:

• onBeforeAction - 显示加载屏幕; 确定用户名是否存在(即URL是否有效)
  • 显示未找到的视图,私人个人资料或公开个人资料
• waitOn- username在删除加载屏幕之前等待检索数据
• onAfterAction - 删除加载屏幕

谢谢!

Answer 1

幸运的是,您正在寻找的每个特征都可以在插件中找到,因此您甚至不必潜入定义自己的挂钩.

请注意我正在使用iron:router@1.0.0-pre2,这对于跟上最新的东西非常重要,目前只有两个小怪癖,我希望很快能得到解决.

让我们从用户配置文件发布开始,它将用户名作为参数.

server/collections/users.js

Meteor.publish("userProfile",function(username){
    // simulate network latency by sleeping 2s
    Meteor._sleepForMs(2000);
    // try to find the user by username
    var user=Meteor.users.findOne({
        username:username
    });
    // if we can't find it, mark the subscription as ready and quit
    if(!user){
        this.ready();
        return;
    }
    // if the user we want to display the profile is the currently logged in user...
    if(this.userId==user._id){
        // then we return the corresponding full document via a cursor
        return Meteor.users.find(this.userId);
    }
    else{
        // if we are viewing only the public part, strip the "profile"
        // property from the fetched document, you might want to
        // set only a nested property of the profile as private
        // instead of the whole property
        return Meteor.users.find(user._id,{
            fields:{
                "profile":0
            }
        });
    }
});

让我们继续使用配置文件模板,这里没什么太花哨的,我们将用户名显示为公共数据,如果我们正在查看私有配置文件,则显示我们假设存储的用户真实姓名profile.name.

client/views/profile/profile.html

<template name="profile">
    Username: {{username}}<br>
    {{! with acts as an if : the following part won't be displayed
        if the user document has no profile property}}
    {{#with profile}}
        Profile name : {{name}}
    {{/with}}
</template>

然后我们需要在全局路由器配置中为配置文件视图定义路由:

lib/router.js

// define the (usually global) loading template
Router.configure({
    loadingTemplate:"loading"
});

// add the dataNotFound plugin, which is responsible for
// rendering the dataNotFound template if your RouteController
// data function returns a falsy value
Router.plugin("dataNotFound",{
    notFoundTemplate: "dataNotFound"
});

Router.route("/profile/:username",{
    name:"profile",
    controller:"ProfileController"
});

请注意,iron:router现在要求您lib/在客户端和服务器可用的共享目录(通常是项目根目录中的dir)中定义路由和路由控制器.

现在最棘手的部分,ProfileController定义:

lib/controllers/profile.js

ProfileController=RouteController.extend({
    template:"profile",
    waitOn:function(){
        return Meteor.subscribe("userProfile",this.params.username);
    },
    data:function(){
        var username=Router.current().params.username;
        return Meteor.users.findOne({
            username:username
        });
    }
});

当iron:router检测到您正在使用waitOn的RouteController它现在会自动添加默认的loading勾负责渲染loadingTemplate,而认购还没有准备好.

我现在要解决我在回答问题时谈到的两个小错误.

首先,官方iron:router指南(你一定要阅读)http://eventedmind.github.io/iron-router/提到你应该传递给dataNotFound插件的选项名称是dataNotFoundTemplate截至28-09-2014工作,你需要使用遗留名称notFoundTemplate,这可能会在几天内得到修复.

对于我data在控制器中的函数代码也是如此:我通常使用反直觉语法Router.current().params来访问路由参数,而这通常this.params是适当的常规语法.这是另一个尚未解决的问题.https://github.com/EventedMind/iron-router/issues/857