Why this XMLHttpRequest cause http 406

2.7k views Asked by At

It is a XMLHttpRequest to get a json form. I tested it on 3 different host:

  • localhost: http 200
  • my test VPS host: 200
  • my shared host godaddy: 406

I have compared the headers again and again. Then I googled and read so many articles the whole day long.. but still can figure out why.. Few suspicious points to me here :

  • Request URL:h.t.t.p://example.com/oxwall/base/ajax-loader/component/?cmpClass=PHOTO_CMP_AjaxUpload&r=0.41719201277010143 -> 'oxwall' is my php app, a real directory while 'base' is no a real direcoty.
  • XMLHttpRequest is not supported by some configuration of Godaddy?
  • json : i see many reported 406 with Json:

My full header that failed:

Request URL:http://example.com/oxwall/base/ajax-loader/component/?cmpClass=PHOTO_CMP_AjaxUpload&r=0.41719201277010143
Request Method:POST
Status Code:406 Not Acceptable
Request Headersview source
Accept:application/json, text/javascript, */*; q=0.01
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Connection:keep-alive
Content-Length:38
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
Cookie:.................
Host:example.com
Origin:http://example.com
Referer:http://example.com/oxwall/
User-Agent:Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.66 Safari/537.36
X-Requested-With:XMLHttpRequest
Query String Parametersview sourceview decoded
cmpClass:PHOTO_CMP_AjaxUpload
r:0.41719201277010143
Form Dataview sourceview decoded
params:%5Bnull%2Cnull%2Cnull%2Cnull%5D
Response Headersview source
Connection:Keep-Alive
Content-Length:404
Content-Type:text/html; charset=iso-8859-1
Date:Sat, 09 Aug 2014 09:20:32 GMT
Keep-Alive:timeout=5
Server:Apache mod_fcgid/2.3.10-dev

Succesful response in Json:

   {"content":"<div class=\"ow_photo_upload_wrap\" id=\"add-new-photo-container\">\n    <div class=\"ow_hidden\">\n        <iframe name=\"iframe_upload\" id=\"iframe_upload\" src=\"about:blank\"><\/iframe>\n        <form id=\"upload-form\" target=\"iframe_upload\" enctype=\"multipart\/form-data\" method=\"post\" action=\"http:\/\/conyeu.me\/photo\/ajax-upload\">\n            <input type=\"file\" name=\"file\" accept=\"image\/jpeg,image\/png,image\/gif\" multiple \/>\n        <\/form>\n        <div id=\"slot-prototype\" class=\"ow_photo_preview_edit\">\n            <input type=\"hidden\" name=\"slot\" \/>\n            <input type=\"hidden\" name=\"rotate\" \/>\n            <div class=\"ow_photo_preview_action\">\n                <div class=\"ow_photo_preview_image ow_photo_preview_loading\">\n                    <div class=\"ow_photo_preview_image_filter\"><\/div>\n                <\/div>\n                <div class=\"ow_photo_preview_x\"><\/div>\n                <div class=\"ow_photo_preview_rotate\"><\/div>\n            <\/div>\n            <div class=\"ow_photo_upload_description\" style=\"min-height: 58px\">\n                <textarea class=\"ow_hidden invitation\"><\/textarea>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <div class=\"ow_photo_dragndrop\">\n        <div id=\"drop-area\" ondragover=\"return false;\"><\/div>\n        <span id=\"drop-area-label\">photo+dnd_support<\/span>\n    <\/div>\n\n    <form id=\"form_79795474\" method=\"post\" action=\"http:\/\/conyeu.me\/photo\/ajax-upload-submit\" name=\"ajax-upload\">\n<input name=\"form_name\" id=\"input_82938081\" type=\"hidden\" value=\"ajax-upload\" \/>\n\n        <div id=\"slot-area\" class=\"ow_photo_preview_block_wrap clearfix\"><\/div>\n\n        <div id=\"photo-album-form\" class=\"ow_photo_upload_bottom clearfix\">\n            <div id=\"photo-album-list\" class=\"ow_left\">\n                <div class=\"ow_suggest_field ow_smallmargin\">\n                    <input name=\"album\" id=\"input_48713404\" type=\"text\" class=\"ow_dropdown_btn ow_inputready ow_cursor_pointer\" autocomplete=\"off\" readonly=\"readonly\" value=\"Ch\u1ecdn album c\u00f3 s\u1eb5n ho\u1eb7c t\u1ea1o album m\u1edbi\" \/>\n                    <div class=\"ow_dropdown_list_wrap\">\n                        <ul class=\"ow_dropdown_list\">\n                            <li>T\u1ea1o Album m\u1edbi<span class=\"ow_add_item\"><\/span><\/li>\n                                                    <\/ul>\n                    <\/div>\n                    <div class=\"ow_dropdown_arrow_down upload_photo_spinner\"><\/div>\n                    <span id=\"input_53937208_error\" style=\"display:none;\" class=\"error\"><\/span>\n                <\/div>\n                <div class=\"new-album\" style=\"display: none\">\n                    <input name=\"album-name\" id=\"input_53937208\" type=\"text\" class=\"ow_smallmargin invitation\" value=\"T\u00ean album\" \/>\n                    <textarea name=\"description\" id=\"input_87690768\" class=\"invitation\">Ch\u1ecdn album hi\u1ec7n c\u00f3 ho\u1eb7c t\u1ea1o m\u1ed9t h\u00ecnh m\u1edbi<\/textarea>\n                <\/div>\n            <\/div>\n            <div class=\"ow_photo_upload_submit ow_right\">\n                <span class=\"ow_button\">\n                    <span class=\" ow_ic_submit ow_positive\">\n                        <span class=\"ow_button\"><span class=\" ow_ic_submit ow_positive\"><input type=\"submit\"  value=\"Submit\" id=\"input_95606675\" class=\"ow_ic_submit ow_positive\"name=\"submit\" value=\"Submit\"   \/><\/span><\/span>\n                    <\/span>\n                <\/span>\n            <\/div>\n        <\/div>\n    \n<\/form>\n<\/div>","beforeIncludes":";window.ajaxPhotoUploadParams = {};\n                Object.defineProperties(ajaxPhotoUploadParams, {\n                    actionUrl: {\n                        value: \"http:\\\/\\\/conyeu.me\\\/photo\\\/ajax-upload\",\n                        writable: false,\n                        enumerable: true\n                    },\n                    maxFileSize: {\n                        value: 8388608,\n                        writable: false,\n                        enumerable: true\n                    },\n                    deleteAction: {\n                        value: \"http:\\\/\\\/conyeu.me\\\/photo\\\/ajax-upload-delete\",\n                        writable: false,\n                        enumerable: true\n                    }\n                });\n","scriptFiles":["http:\/\/conyeu.me\/ow_static\/plugins\/photo\/js\/jQueryRotate.min.js","http:\/\/conyeu.me\/ow_static\/plugins\/photo\/js\/codemirror.min.js","http:\/\/conyeu.me\/ow_static\/plugins\/photo\/js\/upload.js"],"onloadScript":"OW.registerLanguageKey('photo', 'not_all_photos_uploaded', \"Some photos were not uploaded because of excessive size or wrong format\");OW.registerLanguageKey('photo', 'size_limit', \"K\\u00edch t\\u1eadp tin h\\u00ecnh \\u1ea3nh kh\\u00f4ng th\\u1ec3 l\\u1edbn h\\u01a1n <b>{$size}<\\\/b>Mb\");OW.registerLanguageKey('photo', 'type_error', \"T\\u1ec7p kh\\u00f4ng h\\u1ee3p l\\u1ec7: {$name}\");OW.registerLanguageKey('photo', 'dnd_support', \"photo+dnd_support\");OW.registerLanguageKey('photo', 'dnd_not_support', \"photo+dnd_not_support\");OW.registerLanguageKey('photo', 'drop_here', \"photo+drop_here\");OW.registerLanguageKey('photo', 'please_wait', \"Xin h\\u00e3y \\u0111\\u1ee3i trong khi c\\u00e1c \\u1ea3nh tr\\u01b0\\u1edbc \\u0111ang t\\u1ea3i l\\u00ean\");OW.registerLanguageKey('photo', 'create_album', \"T\\u1ea1o Album m\\u1edbi\");OW.registerLanguageKey('photo', 'album_name', \"T\\u00ean album\");OW.registerLanguageKey('photo', 'album_desc', \"Ch\\u1ecdn album hi\\u1ec7n c\\u00f3 ho\\u1eb7c t\\u1ea1o m\\u1ed9t h\\u00ecnh m\\u1edbi\");OW.registerLanguageKey('photo', 'describe_photo', \"Describe this photo\");OW.registerLanguageKey('photo', 'photo_upload_error', \"Photo upload error\"); var form = new OwForm({\"id\":\"form_79795474\",\"name\":\"ajax-upload\",\"reset\":false,\"ajax\":true,\"ajaxDataType\":\"json\",\"validateErrorMessage\":\"H\\u00e3y \\u0111i\\u1ec1n v\\u00e0o m\\u1eabu \\u0111\\u00fang c\\u00e1ch\"});window.owForms[form.name] = form;\n\t\t\t\nvar formElement = new OwFormElement(\"input_82938081\", \"form_name\");\nform.addElement(formElement);\nvar formElement = new OwTextField(\"input_53937208\", \"album-name\", false);formElement.addValidator({\n        \tvalidate : function( value ){\n                if(  $.isArray(value) ){ if(value.length == 0  ) throw \"B\\u1eaft bu\\u1ed9c\"; return;}\n                else if( !value || $.trim(value).length == 0 ){ throw \"B\\u1eaft bu\\u1ed9c\"; }\n        },\n        \tgetErrorMessage : function(){ return \"B\\u1eaft bu\\u1ed9c\" }\n        });formElement.addValidator({\n            validate : function( value )\n            {\n                if ( null && null.trim().toLowerCase() == \"B\\u1ea3ng tin \\u1ea3nh\".toString().trim().toLowerCase() )\n                {\n                    return true;\n                }\n                    \n                if ( value.toString().trim().toLowerCase() == \"B\\u1ea3ng tin \\u1ea3nh\".toString().trim().toLowerCase() )\n                {\n                    throw \"B\u1ea1n kh\u00f4ng th\u1ec3 t\u1ea1o ho\u1eb7c t\u1ea3i \u1ea3nh l\u00ean v\u1edbi t\u00ean n\u00e0y\";\n                }\n            }\n        });\nform.addElement(formElement);\nvar formElement = new OwTextArea(\"input_87690768\", \"description\", false);\nform.addElement(formElement);\nvar formElement = new OwTextField(\"input_48713404\", \"album\", false);formElement.addValidator({\n        \tvalidate : function( value ){\n                if(  $.isArray(value) ){ if(value.length == 0  ) throw \"B\\u1eaft bu\\u1ed9c\"; return;}\n                else if( !value || $.trim(value).length == 0 ){ throw \"B\\u1eaft bu\\u1ed9c\"; }\n        },\n        \tgetErrorMessage : function(){ return \"B\\u1eaft bu\\u1ed9c\" }\n        });\nform.addElement(formElement);\n\n\n\t\t\tif ( form.form ) \n\t\t\t{\n    \t\t\t$(form.form).bind( 'submit', {form:form},\n    \t\t\t\t\tfunction(e){\n    \t\t\t\t\t\treturn e.data.form.submitForm();\n    \t\t\t\t\t}\n    \t\t\t);\n                        }\n                        \n                        OW.trigger('base.onFormReady.' + form.name, [], form);\n                        OW.trigger('base.onFormReady', [form]);\n\t\tform.bind('success', function( data )\n            {\n                if ( data )\n                {\n                    if ( !data.result )\n                    {\n                        if ( data.msg )\n                        {\n                            OW.error(data.msg);\n                        }\n                        else\n                        {\n                            OW.getLanguageText(\"photo\", \"photo_upload_error\");\n                        }\n                    }\n                    else\n                    {\n                        var url = null;\n                        \n                        if ( url )\n                        {\n                            window.location.href = url;\n                        }\n                        else if ( data.url )\n                        {\n                            window.location.href = data.url;\n                        }\n                    }\n                }\n                else\n                {\n                    OW.error(\"Server error\");\n                }\n            });;window.ajaxPhotoUploader.init();","styleSheets":["http:\/\/example.com\/ow_static\/plugins\/photo\/css\/photo_upload.css"]}

Please give me some clue what I need to look into.

1

There are 1 answers

0
HMR On

http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html (look up 406)

In your response you have:

Content-Type:text/html; charset=iso-8859-1

In your request:

Accept:application/json, text/javascript, */*; q=0.01

My guess is you have to set Accept. If you're not using jQuery (not tagged with it) then here is how you can do it with vanilla JS:

xmlhttp.setRequestHeader("Accept"
  , "text/html");

You should try to open the url in a browser, since you need to post values to it to see if it works correctly you can create a html file with a form method=post action=your godaddy site.