javascript - 如何在addEventListener中使用onMessage？

我将textarea id="save"的值保存在addEventListener中。然后，使用xhr将其发送到服务器，同时使用Google App Engine Channel API打开一个通道，然后尝试捕获使用onMessage发送回的消息。

一切正常，除了返回的消息。我了解返回的消息将是evt.data，但未记录。您能帮我了解我做错了什么吗？这是对我的previous question的跟进。谢谢！

document.getElementById("save").addEventListener
(
    "click",
    function ()
    {
        var userEmail = document.getElementById("getEmail").value;
        var formData = new FormData();
        formData.append("extension_user", userEmail);

        var channel;
        var socket;
        var handler =
        {
            //I changed this to "onmessage" as draevor's answer but
            //I still don't see "evt.data" logged
            onMessage: function (evt)
            {
                //evt.data will be what the server sends in channel.send_message
                console.log("evt.data received from authhandler: " + evt.data);
                alert("evt.data is: " + evt.data)
            }
        };

        var xhr = new XMLHttpRequest();
        xhr.onReadyStateChange = function()
        {
            //this alert does not trigger
            alert("xhr.onReadyStateChange")
            if (xhr.readyState == 4 && xhr.status == 200)
            {
                token = xhr.responseText;
                //this alert does not trigger
                alert("token: " + token)
                channel = new goog.appengine.Channel(token);
                socket = channel.open(handler);
            }
        };
        xhr.open("POST", "http://ting-1.appspot.com/authsender", true);
        xhr.send(formData);
        console.log("formData sent to authsender: " + formData);

    }, false
)

更新

按照draevor's answer的建议进行更新，我添加了onmessage的其他属性。我遵循this question，尽管我不确定他为什么将属性放在单引号中。

document.getElementById("save").addEventListener
(
    "click",
    function ()
    {
        var userEmail = document.getElementById("getEmail").value;
        var formData = new FormData();
        formData.append("extension_user", userEmail);

        var channel;
        var socket;
        var handler =
        {
            onopen: onOpen,
            onmessage: onMessage,
            onerror: onError,
            onclose: onClose
        };

        var xhr = new XMLHttpRequest();
        xhr.onReadyStateChange = function()
        {
            //this alert does not trigger
            alert("xhr.onReadyStateChange")
            if (xhr.readyState == 4 && xhr.status == 200)
            {
                token = xhr.responseText;
                //this alert does not trigger
                alert("token: " + token)
                channel = new goog.appengine.Channel(token);
                socket = channel.open(handler);
            }
        };
        xhr.open("POST", "http://ting-1.appspot.com/authsender", true);
        xhr.send(formData);
        console.log("formData sent to authsender: " + formData);
    }, false
)
onMessage =
function (evt)
{
    //evt.data will be what the server sends in channel.send_message
    console.log("evt.data received from authhandler: " + evt.data);
    alert("evt.data is: " + evt.data)
}

onOpen =
function ()
{
    alert("onOpen")
}

onError =
function ()
{
    alert("onError")
}

onClose =
function ()
{
    alert("onClose")
}

最佳答案

我认为问题只是将属性命名为onMessage而不是onmessage。我还建议设置所有其他属性（onopen，onerror，onclose），至少出于调试目的，以防上面的方法不能解决您的问题。

关于javascript - 如何在addEventListener中使用onMessage？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7960751/