流星账户资料

Meteor Accounts Profile

我希望我的用户拥有包含姓名和头像的个人资料。我无法使它正常工作。 (实际上,我是在继承一些代码)。我需要有人告诉我如何修改以下代码,以便我可以使我的用户个人资料名称与注册页面中的用户名相同。

说的很清楚,在创建用户的时候,有一个选项可以填写profile,profile是用户的子文档。在我的个人资料中,我想要一个名字和图像。创建用户后,我们会存储密码、电子邮件和用户名等内容。我还想存储配置文件,并将配置文件中的名称记录为等于用户名。这似乎是不可能的,正如您从我们从电子邮件中删除配置文件名称的糟糕代码中看到的那样。请帮助我在创建用户时设置个人资料名称。

这里是 onCreateUser 的覆盖:

从 'meteor/accounts-base' 导入 { 帐户 };

Accounts.onCreateUser((options, user) => {
  console.log('\nsign up attempt:', new Date());


  // Handle password signup
  if (user.services.password) {
    const email = user.emails[0].address;
    const name = email.split('@')[0];
    console.log(
      '\nservice --> password',
      '\nname:', name,
      '\nemail:', email,
    );

    // Extend user's profile by adding default name and avatar
    const profile = {
      name,
      avatar: 'user.png',
    };

    return { roles: [], ...user, profile };
  }

  // Handle facebook signup
  if (user.services.facebook) {
    const { id, name, gender, email } = user.services.facebook;
    console.log(
      '\nservice --> facebook',
      '\nname:', name,
      '\nid:', id,
      '\ngender:', gender,
      '\nemail:', email,
    );

    // Extend user's profile by adding facebook data
    const profile = {
      name,
      gender,
      avatar: `http://graph.facebook.com/${id}/picture/`,
    };

    return { roles: [], ...user, profile };
  }

  // Throw in case of a different service
  throw new Error(401, 'Sign up attempt with service different than facebook or password');
});

真的很糟糕。我不想从电子邮件中获取用户名。相反,我想使用登录页面中的用户名。这是一些创建用户的代码:

import gql from 'graphql-tag';
import Auth from '/app/api/auth';
import { storeLoginToken } from './store';

async function createUser({ username, email, password, profile }, apollo) {
  const result = await apollo.mutate({
    mutation: gql`
      mutation createUser ($username: String, $email: String, $password: HashedPassword!, $profile: CreateUserProfileInput) {
        createUser (username: $username, email: $email, password: $password, profile: $profile) {
          id
          token
          tokenExpires
        }
      }
    `,
    variables: {
      username,
      email,
      password: Auth.hashPassword(password),
      profile,
    },
  });

  const { id, token, tokenExpires } = result.data.createUser;
  await storeLoginToken(id, token, new Date(tokenExpires));
  return id;
}

export default createUser;

这里有一些 graphql 突变,带有我不明白的这个奇怪的东西“CreateUserProfileInput”:

import gql from 'graphql-tag';

const types = gql`
  extend input CreateUserInput {
    profile: CreateUserProfileInput!
  }

  input CreateUserProfileInput {
    name: String!
  }


  type Mutation {
    # Create a new user.
    createUser (username: String, email: String, password: HashedPassword, plainPassword: String, profile: CreateUserProfileInput): LoginMethodResponse

这是我的 collection 用户个人资料片段:

  'profile.name': {
    type: String,
    max: 150,
    optional: true,
  },

  'profile.gender': {
    type: String,
    max: 50,
    optional: true,
  },

  'profile.avatar': {
    type: String,
    max: 150,
    optional: true,
  },

这是我的注册页面:

import React from 'react';
import { Link } from 'react-router-dom';
import { compose, setDisplayName } from 'recompose';
import { FormattedMessage as T, injectIntl } from 'react-intl';
import { withRouteProps, withFormProps, withServiceProps, withSEO } from '/app/ui/hocs';
import AuthPageLayout from '/app/ui/layouts/auth-page';
import { PasswordAuthViews, FBAuthBtn } from '/app/ui/components/smart/auth';
import Feedback from '/app/ui/components/dumb/feedback';

const SignupPage = ({
  intl: { formatMessage: t },
  disabled,
  errorMsg,
  successMsg,
  handleBefore,
  handleClientError,
  handleServerError,
  service,
  setService,
  loginUrl,
}) => (
  <AuthPageLayout
    title={t({ id: 'signup' })}
    subtitle={t({ id: 'signupSubTitle' })}
    link={<Link to={loginUrl()}><T id="login" /></Link>}
  >
    <PasswordAuthViews
      view="signup"
      btnLabel={t({ id: 'signup' })}
      disabled={disabled}
      onBeforeHook={() => {
        // Keep track of the auth service being used
        setService('password');
        handleBefore();
      }}
      onClientErrorHook={handleClientError}
      onServerErrorHook={handleServerError}
    />
    {service === 'password' && (
      <Feedback
        loading={disabled}
        errorMsg={errorMsg}
        successMsg={successMsg}
      />
    )}
    {/* <div className="center">
      <T id="signupOrText" />
    </div>
    <FBAuthBtn
      btnLabel={t({ id: 'signupFBButton' })}
      disabled={disabled}
      onBeforeHook={() => {
        // Keep track of the auth service being used
        setService('facebook');
        handleBefore();
      }}
      onServerErrorHook={handleServerError}
    />
    {service === 'facebook' && (
      <Feedback
        loading={disabled}
        errorMsg={errorMsg}
        successMsg={successMsg}
      />
    )} */}
  </AuthPageLayout>
);

export default compose(
  injectIntl,
  withRouteProps,
  withFormProps,
  withServiceProps,
  withSEO({ title: 'signup' }),
  setDisplayName('SignupPage'),
)(SignupPage);

如果您只想让 profile.name 属性 与用户名相同,您可以从 [=13= 中提取 username 属性 ] 在 onCreateUser 钩子中,然后将其传递给配置文件。

Accounts.onCreateUser((options, user) => {
  console.log('\nsign up attempt:', new Date());


  // Handle password signup
  if (user.services.password) {
    const email = user.emails[0].address;
    const name = user.username; 
    console.log(
      '\nservice --> password',
      '\nname:', name,
      '\nemail:', email,
    );

    // Extend user's profile by adding default name and avatar
    const profile = {
      name,
      avatar: 'user.png',
    };

    return { roles: [], ...user, profile };
  }
    ...
});