使用Javascript / Ajax发送图像并将其保存到MongoDB

时间:2014-08-21 15:18:31

标签: javascript ajax node.js mongodb mongoose

我正在尝试使用Ajax保存配置文件以发送数据。当我没有图像时,我可以保存,但问题是该配置文件有一个图像,我想使用我用来发送其他信息的相同Ajax函数发送它。如果我不这样做,我必须使用' PUT'创建另一个不同的Ajax功能。请求只修改文档并将图像保存在其中。

有没有办法像Json一样发送图像以及名称和电子邮件等其他信息?

这是我的HTML:

<input class="teamName" type="text" id="teamName" name="teamName"  size="25" maxlength="60" value="Team Name">
    <input class="companyName" type="text" id="companyName"  name="companyName"  size="25" maxlength= "60" value="Company Name">
    <input class="teamDescription"  type="text" id="teamDescription"  name="teamDescription"    size="25"    maxlength= "60" value="Team Description">
    <input class= "email" type="text" id="email"  name="email"  size="25"   maxlength= "60" value="emails">   
    <input class="charityID"  type="text" id="charityID" name="charityID"  size ="25"      maxlength="60">
     <input class="upload-area" id="upload-area" type="file" size="150">

这是我的功能,我打电话使用&#39; greenButton&#39; onclick方法:

function createTeam(){

    var _teamName= document.getElementById("teamName").value;
    var _companyName =document.getElementById("companyName").value; //maybe not, tae it off.
    var _charityID = document.getElementById("charityID").value;
    var _teamDescription = document.getElementById("teamDescription").value;
    var _profileImage = document.getElementById("upload-area").value; //PATH of the Image


    if((_teamName.trim() === "") || (_companyName.trim() === "") || (_charityID.trim() === ""))
    {
        alert("You did not fill the team Name  or companyName or Charity, Please enter with a name");

    }else{
         var sessionID = $.cookie("sessionID")
         $.ajax({
                type: "POST",
                url: "http://xxx.xxx.x.xx:8085/team/?sessionID="+sessionID,
                dataType:'json',
                data:{
                    teamName: _teamName,
                    companyName:_companyName,
                    teamDescription:_teamDescription,
                    charityID:_charityID,
                    profileImage:_profileImage  **//CAN I DO THIS, SEND AS JSON?**
                },
                success: function(msg) {
                    $.cookie("teamID",msg.teamID)
                    $.cookie("sessionID",sessionID)
                    alert("team supposedly saved")
                }
          });
        }   
}

这就是我在NodeJs中接收数据以保存在DataBase上的方式:

router.post('/', function (req, res){

        //TEAM INFO
       var sessionID = req.query.sessionID  // to get variable form URL is "req.query" 
       var team = req.body;
       var teamName = team.teamName;
       var teamDescription = team.teamDescription;
       var charityID = team.charityID;
       var teamLink = team.teamLink;
       var image = team.profileImage;

      sessionOBJ.isAuthorized(sessionID, function(sessionID){ 

          log.d("Checking session to save team", sessionID);
           var adminID = sessionID.userID; 

           var newTeam = new teamModel({
                teamName: teamName,
                teamDescription: teamDescription,
                teamAdminID: adminID,
                teamLink: teamLink,
                charityID: charityID,
                image: {
                  data:fs.readFileSync(image),
                  contentType:image.type
                }
              });

           newTeam.save(function(err, team){
           if(err) return console.error(err);
           res.send({"status" : "Created", "teamID" : team._id, "teamAdminID":team.teamAdminID });
                log.d("Created  Team ID",  team._id)
                log.d("XXXXXXX XXXXXX XXXXXXX Team Saved inside save method",team);
           });//end save new team 

      });//end is Authorized


}); 

上面的代码无效。

如何使用javascript和Ajax发送图像文件?我可以使用相同的Ajax请求执行此操作吗?

提前致谢。

0 个答案:

没有答案