Ajax呼叫错误500

Question

So I am developing a website where users can write articles. I'm coming across a problem. When a user writes a short article it works fine, but when a user writes or edits a longer article it gives me an Ajax 500 Error in the console. I'm not sure if the problem is happening because I'm working with CKEditor. Anyways this is the code I'm using to send my article with Ajax:

var name        = $(".article_name").val().trim(),
    image       = $("#article_input").val(),
    category_id = $(".txtArticleCategory").val().trim(),
    short_body  = $(".txtShortBodyArticle").val().trim(),
    tags        = $(".txtTagsArticle").val().trim(),
    body        = CKEDITOR.instances['txtArticleBody'].getData();

    if(name !== "" && image !== "" && category_id > 0 && body !== "" && short_body !== "" && tags !== ""){    
      var formData = new FormData($('#insertArticleForm')[0]);
      formData.append("body", body);

      $.ajax({
          xhr: function() {
            var xhr = new window.XMLHttpRequest();

            xhr.upload.addEventListener("progress", function(evt) {
              if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                percentComplete = parseInt(percentComplete * 100);

                //update progress bar width
                $('.progress-bar-custom > span').css('width', percentComplete + "%");    
              }
            }, false);

            return xhr;
          },
          type: "POST",
          url: '/actions/update_article.php',
          data: formData,
          processData: false,
          contentType: false,
          success: function (data) {
              $('.progress-bar-custom').css('display', 'none');
              $('.progress-bar-custom > span').css('width', '0%');

              if(data == 'true'){
                // Empty textboxes
                $(".article_name, .txtArticleCategory").val("");
                CKEDITOR.instances['txtArticleBody'].setData("");

                alert('Article added.');
              }else if (data == "size") {
                alert('Image too big. Max size is 2mb');
              }else if (data == "false") {
                alert('Error, please try again.');
              }
          },
          error: function(){
            alert('Error, please try again.');
          }
      });
    }else{
      alert("Complete a text fields.");
    }
  });

This is the error i'm getting:

jquery.min.js:4 POST http://sub.domain.net/actions/update_article.php 500 (Internal Server Error)

The error only happens when I try adding or editing a large article, anyone know why this is happening or how I can fix it? Any help is appreciated.

Answer 1

I contacted my web hosting provider and they told me it ended up being a ModSec rule. If you're having a similar issue I would recommend contacting them.