Question

使用jQuery和AJAX提交表单时，我在返回的包含IMG标记的HTML上收到403错误。

以下是我用来提交表单的代码：

// Add a new personality to the quiz
    $('form#personality_editor').submit(function(e) {

        e.preventDefault();

            // Submit the form with jQuery Form plugin to handle attachments
            $(this).ajaxSubmit({
                dataType: "json",
                resetForm: true,
                beforeSend: function() {
                    // Show the loading spinner
                    $('img#personality_loader').show();
                },
                success: function(add_personality_response) {

                    // Hide the image loader
                    $('img#personality_loader').hide('fast');

                    if (add_personality_response["success"] == "true") {

                        // Create a new personality in the list of personalities
                        $('div#quiz_personalities').append(add_personality_response["personality_html"]);

                            // Add the personality to list of hidden personalities
                            AddRemovePersonality(add_personality_response["personality_id"], "add");

                            // Set the focus on to personality name
                            $('input#new_personality_name').focus();

                            // Show or hide the no personalities notice
                            ShowHideNoPersonalitiesNotice();

                            alert("Success");
                    }

                },
                error: function() {
                    alert("There was an error adding personality");
                }
            });

    });

以下是我从代码中获取的完整JSON响应：

    {"success":"true","personality_id":191,"personality_name":"Avril Lavigne","personality_image":"191avril.jpg","personality_html":"<div class=\"personality_wrapper\" data-personality-id=\"191\"><img src=\"images\/personalities\/personality_images\/192avril.jpg\" class=\"personality_image_small\" \/><div class=\"personality_info\"><div class=\"personality_name\" title=\"Kjh\">Kjh<\/div><div class=\"personality_options\"><a href=\"#\" class=\"personality_option personality_edit\">Edit<\/a><a href=\"#\" class=\"personality_option personality_delete\">Delete<\/a><\/div><\/div><\/div>"}

我使用jQuery的personality_html函数将.append()添加到DOM中。

Internet Explorer中出现此问题，因为它在Chrome中正常运行。

图片正好上传到位于images/personalities/personality_images/192avril.jpg的我的服务器。

我从网页上回复的回复是：

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 2.0//EN">
<html><head>
<title>403 Forbidden</title>
</head><body>
<h1>Forbidden</h1>
<p>You don't have permission to access /&quot;images//personalities//personality_images//192avril.jpg/&quot;
on this server.</p>
</body></html>

是否与从我的页面传递的转义数据有关？我在json_encode()之前使用echo作为回应。

以下是IE中开发者工具的视图：

Developer tools IE

Answer 1

您最有可能尝试将JSON解析为JavaScript对象两次。

由于.ajaxSubmit()调用已经指定响应数据类型为JSON，jQuery会自动将响应解析为JavaScript对象（如果响应Content-Type，它也会执行此操作是application/json，无论您是否指定了dataType。

这意味着在成功回调中，add_personality_response1已经是一个JavaScript对象。然而，你是第二次尝试$.parseJSON：

var add_personality_response = $.parseJSON(add_personality_response1);

我不太确定删除这一行是否可以立即解决问题，但这肯定是你必须要开始的。

动态加载图像时IE7给出403错误

1 个答案: