2013-05-16 215 views
0

我在我的網頁上部署了一個使用Django和JQuery(用於創建AJAX調用)的聊天室。但是,消息文本字段雖然可以鍵入消息,但不會讓我向主聊天字段提交消息。奇怪的是聊天室在我的本地主機上工作,但不在Heroku上部署時。AJAX 500內部服務器錯誤

下面是我收到的控制檯日誌錯誤:

GET http://gameofswitch.herokuapp.com/chat/room/1/ajax/?time=0 500 (INTERNAL SERVER ERROR) jquery-latest.min.js:5 
GET http://gameofswitch.herokuapp.com/chat/room/1/ajax/?time=0 500 (INTERNAL SERVER ERROR) jquery-latest.min.js:5 

它看起來像有可能隨着時間的錯誤或get請求,但我不知道爲什麼,或者它可能是什麼?

這裏的主要JS文件:

//Handles the csrf_token for ajax posts, taken from: 
// https://docs.djangoproject.com/en/dev/ref/contrib/csrf/ 

$(document).ajaxSend(function(event, xhr, settings) { 
function getCookie(name) { 
    var cookieValue = null; 
    if (document.cookie && document.cookie != '') { 
     var cookies = document.cookie.split(';'); 
     for (var i = 0; i < cookies.length; i++) { 
      var cookie = jQuery.trim(cookies[i]); 
      // Does this cookie string begin with the name we want? 
      if (cookie.substring(0, name.length + 1) == (name + '=')) { 
       cookieValue = decodeURIComponent(cookie.substring(name.length + 1)); 
       break; 
      } 
     } 
    } 
    return cookieValue; 
} 
function sameOrigin(url) { 
    // url could be relative or scheme relative or absolute 
    var host = document.location.host; // host + port 
    var protocol = document.location.protocol; 
    var sr_origin = '//' + host; 
    var origin = protocol + sr_origin; 
    // Allow absolute or scheme relative URLs to same origin 
    return (url == origin || url.slice(0, origin.length + 1) == origin + '/') || 
     (url == sr_origin || url.slice(0, sr_origin.length + 1) == sr_origin + '/') || 
     // or any other URL that isn't scheme relative or absolute i.e relative. 
     !(/^(\/\/|http:|https:).*/.test(url)); 
} 
function safeMethod(method) { 
    return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method)); 
} 

if (!safeMethod(settings.type) && sameOrigin(settings.url)) { 
    xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken')); 
} 
}); 


var urlize = function(text) { 
var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig; 
return text.replace(exp,"<a href='$1'>$1</a>"); 
}; 

// Chat client code. 


// Keep track of the last message received (to avoid receiving the same message several times). 
// This global variable is updated every time a new message is received. 
var timestamp = 0; 

// URL to contact to get updates. 
var url = null; 

// How often to call updates (in milliseconds) 
var CallInterval = 8000; 
// ID of the function called at regular intervals. 
var IntervalID = 0; 

// A callback function to be called to further process each response. 
var prCallback = null; 

function callServer(){ 
    // At each call to the server we pass data. 
    $.get(url, // the url to call. 
        {time: timestamp}, // the data to send in the GET request. 
        function(payload) { // callback function to be called after the GET is completed. 
                processResponse(payload); 
                }, 
        'json'); 
    }; 

function processResponse(payload) { 
    // if no new messages, return. 
    if(payload.status == 0) return; 
    // Get the timestamp, store it in global variable to be passed to the server on next call. 
    timestamp = payload.time; 
    for(message in payload.messages) { 
      $("#chatwindow").append(urlize(payload.messages[message].text)); 
    } 
    // Scroll down if messages fill up the div. 
    var objDiv = document.getElementById("chatwindow"); 
    objDiv.scrollTop = objDiv.scrollHeight; 

    // Handle custom data (data other than messages). 
    // This is only called if a callback function has been specified. 
    if(prCallback != null) prCallback(payload); 
} 

function InitChatWindow(ChatMessagesUrl, ProcessResponseCallback){ 
/** The args to provide are: 
    - the URL to call for AJAX calls. 
    - A callback function that handles any data in the JSON payload other than the basic messages. 
     For example, it is used in the example below to handle changes to the room's description.  */ 

    $("#loading").remove(); // Remove the dummy 'loading' message. 

    // Push the calling args into global variables so that they can be accessed from any function. 
    url = ChatMessagesUrl; 
    prCallback = ProcessResponseCallback; 

    // Read new messages from the server every X milliseconds. 
    IntervalID = setInterval(callServer, CallInterval); 

    // The above will trigger the first call only after X milliseconds; so we 
    // manually trigger an immediate call. 
    callServer(); 

    // Process messages input by the user & send them to the server. 
    $("form#chatform").submit(function(){ 
      // If user clicks to send a message on a empty message box, then don't do anything. 
      if($("#msg").val() == "") return false; 

      // We don't want to post a call at the same time as the regular message update call, 
      // so cancel that first. 
      clearInterval(IntervalID); 

      $.post(url, 
          { 
          time: timestamp, 
          action: "postmsg", 
          message: $("#msg").val() 
        }, 
        function(payload) { 
                $("#msg").val(""); // clean out contents of input field. 
                // Calls to the server always return the latest messages, so display them. 
                processResponse(payload); 
                }, 
        'json' 
    ); 

    // Start calling the server again at regular intervals. 
    IntervalID = setInterval(callServer, CallInterval); 

      return false; 
    }); 


} // End InitChatWindow 

/**  This code below is an example of how to extend the chat system. 
* It's used in the second example chat window and allows us to manage a user-updatable 
* description field. 
* */ 

// Callback function, processes extra data sent in server responses. 
function HandleRoomDescription(payload) { 
    $("#chatroom_description").text(payload.description); 
} 

function InitChatDescription(){ 

    $("form#chatroom_description_form").submit(function(){ 
      // If user clicks to send a message on a empty message box, then don't do anything. 
      if($("#id_description").val() == "") return false; 
      // We don't want to post a call at the same time as the regular message update call, 
      // so cancel that first. 
      clearInterval(IntervalID); 
      $.post(url, 
          { 
          time: timestamp, 
          action: "change_description", 
          description: $("#id_description").val() 
        }, 
        function(payload) { 
                $("#id_description").val(""); // clean out contents of input field. 
                // Calls to the server always return the latest messages, so display them. 
                processResponse(payload); 
                }, 
        'json' 
    ); 
    // Start calling the server again at regular intervals. 
    IntervalID = setInterval(callServer, CallInterval); 
      return false; 
    }); 

} 
+0

順便說一句,該錯誤意味着這是一個服務器錯誤,而不是JavaScript。 –

+0

檢查這裏的帖子http://www.developersnote.com/2014/01/solved-jquery-ajax-500-internal-server.html[link] – shamcs

+0

你給了我一個錯誤的鏈接... –

回答

1

我會試着讓debug=True並通過工頭本地服務,或者甚至上傳此設置的Heroku看到堆棧跟蹤。 我不認爲問題是在JS方面。

+0

@MarkCruz,什麼你的意思是把這個設置上傳到heroku來查看堆棧跟蹤? –

+0

在settings.py中將變量debug更改爲True,然後將應用程序部署到heroku。當錯誤發生時,url現在應該給你一個堆棧跟蹤。 您可以在瀏覽器的開發者工具的網絡區域看到錯誤(通常是f12或ctrl + shift + i) –

0

http://en.wikipedia.org/wiki/List_of_HTTP_status_codes

500 Internal Server Error A generic error message, given when no more 
specific message is suitable 

這是一個服務器錯誤。從JS方面來說,這是完全合法的迴應,其中可能發生,你應該能夠對它做出反應(向用戶顯示與服務器的通信失敗或任何其他動作的消息)。

您必須在服務器端查找錯誤。日誌中應該有錯誤。