我可以利用 'img src' 显示用户图像吗？

Question

我正在使用 Meteor 制作一个问答网站 app.I 希望用户上传他们的 images.However 我在理解 GridFS 时遇到困难所以我避免 it.In 为了克服这个问题我正在为每个用户创建一个配置文件，其中存储了他们的描述、名称和个人资料图片的 'image_url' 即我要求用户为他们的图像提供 url 放置在 img src 中以显示他们的个人资料 image.In 本地服务器运行良好，显示每个用户的图像。

这里是 common.js.

我已经将 src 和其他字段留空，可以在创建配置文件页面中填写

Template.register.events({
    'submit form': function(event){
        event.preventDefault();
        var username = event.target.username.value;
        var password = event.target.password.value;
        Accounts.createUser({
    username: username,
    password: password,

}, function(error){
    if(error){
        alert(error.reason);
        event.target.password.value=''; // Output error if registration fails
    } else {
        Profile.insert({
        name:'',
        hobbies:'',
        description:'',
        currentUser:Meteor.userId(),
        src:'',
        followers:0,
        following:0,
        followedBy:[],
        followingTo:[]
        });

        Router.go("createProfile"); // Redirect user if registration succeeds
    }
});

在此之后，用户被引导至创建个人资料页面，其中 he/she 被询问 his/her 描述和个人资料图像 url 并且数据库中的用户个人资料被更新。

Template.createProfile.events({
        'click button':function(event){
        event.preventDefault();
        var name=document.getElementById('name').value;
        var hobbies=document.getElementById('hobbies').value;
        var description=document.getElementById('description').value;
        var src=document.getElementById('src').value;
        var currentUser=Meteor.userId();
        Profile.update({ _id: this._id },{$set:{name:name}});
        Profile.update({ _id: this._id },{$set:{hobbies:hobbies}});
        Profile.update({ _id: this._id },{$set:{description:description}});
        Profile.update({ _id: this._id },{$set:{src:src}});
        Router.go('posts');

    }
});

这是router.js

Router.route('/createProfile', {
    template: 'createProfile',
    name:'createProfile',
    data: function(){

        return Profile.findOne({ currentUser: Meteor.userId() });

    }
});

Router.route('/users'); //used helpers profile helper to display the list of every user with their links to profile page

Router.route('/user/:_id', {
    template: 'profilePage',
    name:'profilePage',
    data: function(){
        var currentProfile = this.params._id;
        return Profile.findOne({ _id: currentProfile });
    }
});

这是HTML

<template name='users'>//users is displaying the links to every user profile
<div class='container'>
{{#each profile}}
<div class='col-lg-6'>
<a href="{{pathFor route='profilePage'}}"><h3>{{name}}</h3>
<img src='{{src}}' class='img-responsive img-circle pull-left' height='50' width='50'/></a>
</div>
{{/each}}
</div>
</template>

这是每个用户的个人资料页面-

<template name='profilePage'>

<h2 class='media-heading'> Profile</h2>
<div class='well'>

<img src='{{src}}' class='img-responsive img-circle pull-left' id='profileImage' height='50' width='50'/>
Name:{{name}}

<br>

Hobbies:{{hobbies}}

<br>

Description:{{description}}

<br>

<a href='{{pathFor route="followers"}}'>Followers:{{followers}}</a>

<br>

<a href='{{pathFor route="following"}}'>Following:{{following}}</a>
<br>
<button id={{followColor}} class='btn btn-default glyphicon glyphicon-eye-open' {{disabled}}>{{followOrfollowing}}</button>
<br>

</div>
<br>




<hr/>
</template>

此处 {{src}} 返回用户提供的 image_url。

我的问题是，如果我的 webapp 上线，这个方法是否有效？这个方法是否正确？

Answer 1

简短回答：是的。

查看您的辅助方法以确保它正确完成会有所帮助，但如果它呈现正常，那么我认为您做对了。您只是运行陷入用户提交错误 URL 的潜在问题。但是对于这个用例，这真的不是你能控制的。

我可以利用 'img src' 显示用户图像吗？

Can I make use of 'img src' to display user image?

image

meteor

meteor-blaze