我正在开发使用服务器的node.js和客户端的HTMLCSSJavaScript的简单聊天应用程序,对于每个注册用户,我都会根据他的电子邮件生成一个gravatar,对于匿名用户(没有电子邮件) )我设置了一个默认的用户图像。我将用​​户的详细信息保存在服务器中的数组中,这样,当用户登录时,他们会看到聊天消息,并在他们旁边看到用户图像或其图像。

问题在于,除非实时刷新页面,否则会显示实时更新消息,但不会显示图像。我确信服务器中保存的图像的url是合法的,因为否则,即使刷新页面也无法显示它们。

我收到以下错误:


  GET / client / undefined“错误(404):“未找到”


编辑

server.js:

function addMessage(message) {
    var m = (message);
    if (m.email === "" || m.email===undefined) {
        gravatar = "/client/images/user.png";
    } else {
        var userimg= globalVar.usersList.findIndex(function (element) {
            return element.email === m.email;
        });
        gravatar=globalVar.usersList[userimg].gravatar;
    }
    var newMessage = {
        name: m.name,
        email: m.email,
        gravatar: gravatar,
        message: m.message,
        timestamp: m.timestamp,
    }
    globalVar.messagesList.push(newMessage);
}



function getMessages(counter) {
        var messages = [];

        messages = globaVar.messagesList.filter(function (element) {
            return element.id > counter;
        });
        return messages;
    }
...//after checking the url
     var newMessages = getMessages(counterFromClient);
     response.statusCode = 200;
     response.end(JSON.stringify(newMessages));


在客户中:

getMessages(window.Babble.msgCounter, function (res) {
            var newMessages = JSON.parse(res), i;
            var chatList = document.getElementsByTagName('ol')[0];
            var listItem, contDiv, imageDiv, userImage, msgDiv, ct, tm, btn, spn;
            for (i = 0; i < newMessages.length ; i++) {
                listItem = document.createElement('li');

                contDiv = document.createElement('div');

                imageDiv = document.createElement('div');
                imageDiv.setAttribute("class", "user-image-div");
                userImage = document.createElement('img');
                userImage.setAttribute("alt", "");
                userImage.setAttribute("class", "user-image");
                userImage.setAttribute("src", newMessages[i].gravatar);
                userImage.setAttribute("style", "background: white; border: solid 1px #d7d7d7;");
                imageDiv.appendChild(userImage);

                msgDiv = document.createElement('div');
                msgDiv.setAttribute("class", "message-on-chatboard");
                msgDiv.setAttribute("tabindex", "0");

                ct = document.createElement('cite');
                ct.setAttribute("class", "username");
                ct.innerHTML = newMessages[i].name;

                tm = document.createElement('time');
                tm.setAttribute("class", "time");
                var date = new Date(newMessages[i].timestamp * 1000);
                var hours = date.getHours();
                var minutes = "0" + date.getMinutes();
                tm.innerHTML = hours + ":" + minutes;

                btn = document.createElement('button');
                btn.setAttribute("class", "close");
                btn.setAttribute("aria-label", "delete message");
                btn.setAttribute("tabindex", 0);
                btn.setAttribute("id", "msg" + newMessages[i].id);

                spn = document.createElement('span');
                spn.setAttribute("class", "message-content");
                //console.log(typeof (newMessages[i].message));
                spn.innerHTML = newMessages[i].message;

                msgDiv.appendChild(ct);
                msgDiv.appendChild(tm);

                contDiv.appendChild(imageDiv);
                contDiv.appendChild(msgDiv);
                //append list Item
                listItem.appendChild(contDiv);
                chatList.appendChild(listItem);

            }

function  getMessages(msgCounter, callback) {

        var httpRequest = new XMLHttpRequest();
        httpRequest.onreadystatechange = function () {
            if (httpRequest.readyState === 4) { // request is done
                if (httpRequest.status === 200) { // successfully
                    //console.log(httpRequest.responseText);
                    callback(httpRequest.responseText); // we're calling our method
                }
            }
        };
        httpRequest.open('GET', "http://localhost:8080/messages?counter=" + msgCounter);
        httpRequest.send();
    }


知道为什么会这样,怎么解决?提前致谢。

最佳答案

没有代码很难知道,但是看到错误

GET /client/undefined" Error (404): "Not found"


您用来获取图像的变量似乎未定义(未定义),因此请首先进行验证。

10-06 11:59