ejs渲染后的页面再send数据,页面会被数据覆盖是怎么回事?

发布于 2022-09-06 21:33:36 字数 2512 浏览 12 评论 0

最近在做个用户头像系统,设计思路是这样的:
不通过表单,使用ajax上传用户头像,用户上传完毕头像后,由后端返回操作状态,并且以弹窗形式出现在页面上。

但是结果却是后台来的JSON对象数据直接把页面覆盖了。前台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内部也有值。
                            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);//回调函数
            })
        };

前台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接收不到任何数据。不走success也不走error
                    error:function(){
                        console.log('err');
                    }

                });

当取得返回值后,页面状态:
图片描述

小弟初涉前端,还望大牛赐教!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

倾城泪 2022-09-13 21:33:36
res.send(state);

应该是走了这个分支,http的response返回的就是state这个json,你需要node做模本引擎的话都需要res.render来渲染页面,把stata作为参数传入render方法,res.send就是直接给返回数据(json)给client了

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文