鍍金池/ 問答/HTML/ ejs渲染后的頁面再send數(shù)據(jù),頁面會被數(shù)據(jù)覆蓋是怎么回事?

ejs渲染后的頁面再send數(shù)據(jù),頁面會被數(shù)據(jù)覆蓋是怎么回事?

最近在做個(gè)用戶頭像系統(tǒng),設(shè)計(jì)思路是這樣的:
不通過表單,使用ajax上傳用戶頭像,用戶上傳完畢頭像后,由后端返回操作狀態(tài),并且以彈窗形式出現(xiàn)在頁面上。

但是結(jié)果卻是后臺來的JSON對象數(shù)據(jù)直接把頁面覆蓋了。前臺ajax接受不到任何值,不走success也不走error

后臺nodejs代碼:

routeuser.use('/userhome',function(req,res,next){
            if(!req.files){
                dbhandle.userdata(req.signedCookies.username,function(dbuserinfo){
                    res.render('userhome.ejs',{data:dbuserinfo});
                });
            }
            //photochange
            else if(req.files){//這里開始處理前臺來的用戶頭像。
                var photoupname='www/userphoto/'+req.files[0].filename;
                var photonewname='www/userphoto/'+req.signedCookies.username+'.jpg';
                var sqlphotoname=req.signedCookies.username+'.jpg';
                fs.rename(photoupname,photonewname,function(err,data){
                    if(!err){
dbhandle.userimgchange(req.signedCookies.username,sqlphotoname,function(state){
                            //至此都是ok的state內(nèi)部也有值。
                            res.send(state);
                        })
                    }
                });
            }
        });

后臺mysql代碼:

var db_userimgchange=function(busername,photopath,callback){
            var datachange=[photopath,busername];
            db.query("update userinfo set userphoto=? where username=?",datachange,function(err,result){
                if(!err){//上傳成功
                    state.statenum=1;
                    state.msg="上傳成功!請刷新頁面!";
                }
                else{//上傳失敗
                    state.statenum=0;
                    state.msg="上傳失??!";
                }
                callback(state);//回調(diào)函數(shù)
            })
        };

前臺ajax代碼:

var data1=new FormData($userphotoready[0].files[0]);

                $.ajax({
                    url:'/userhome',
                    dataType:'json',
                    processData: false,
                    cache: false,
                    data:data1,
                    contentType: false,
                    type:'post',
                    success:function(data){
                        console.log(data);
                    },//ajax接收不到任何數(shù)據(jù)。不走success也不走error
                    error:function(){
                        console.log('err');
                    }

                });

當(dāng)取得返回值后,頁面狀態(tài):
圖片描述

小弟初涉前端,還望大牛賜教!

回答
編輯回答
澐染
res.send(state);

應(yīng)該是走了這個(gè)分支,http的response返回的就是state這個(gè)json,你需要node做模本引擎的話都需要res.render來渲染頁面,把stata作為參數(shù)傳入render方法,res.send就是直接給返回?cái)?shù)據(jù)(json)給client了

2017年8月3日 22:29