尝试通过 Ajax 和 jQuery 将表单发布到 Facebook 时出现 400（错误请求）错误

Question

我正在尝试使用我网站中的表单将图像发布到 Facebook 相册。我知道我得到了正确的访问令牌，因为在没有 jQuery 和 AJAX 的情况下发布可以正常工作 - 但会将我重定向到我的网站之外。为了解决这个问题，我发布了一个 jQuery AJAX 帖子，但这给了我一个我不明白的错误。

我正在使用：

<script type="text/javascript" src="../Components/JQUERY/jquery-1.4.2.min.js"></script>    
<script type="text/javascript" src="../Components/JQUERY/jquery.validate.min.js"></script>

代码是：

1. 获取访问令牌并准备要发布到的 URL（可以，不使用 jQuery 发布就是将图片上传到 Facebook）：

   //....Facebook code for getting the access token...//
   
   // This is the URL that was originally in the form's action tag//
   $image_url= "https://graph.facebook.com/" . $ALBUM_ID . "/photos?"
   . "access_token=" .$access_token;
   

2. 表单的HTML：

   <form name="myform" id="myform" enctype="multipart/form-data" action="" method="POST">
      Please choose a photo:
        <input name="source" type="file"><br/>
      Say something about this photo: <br/>
        <textarea id="fbText" name="message" rows="4" cols="47"> </textarea><br/><br/>
        <input type="submit" name="submit" value="Upload"/><br/>
   </form>
   
   <div id="results"></div>
   

3. jQuery 代码：

   <script type="text/javascript">
     $(document).ready(function(){
         $("#myform").validate({
             debug: false,
             rules: {
                 message: "required"   
             },
             messages: {
                 message: "Please insert text."
             },
             submitHandler: function(form) {
                 // do other stuff for a valid form
                 $.post('<?php echo $image_url ?>', $("#myform").serialize(), function(data) {
                   $('#results').html(data);
               });
           }
       });
   });
   </script>
   

按上传按钮给我以下错误：

我做错了什么？ 谢谢。

Answer 1

您不能使用 jquery post 方法发布多部分表单数据。还有一个问题是跨域通信。您不能将 ajax 请求发送到另一个域。

有关替代方案，请参阅

How do you post to an iframe?
http://jquery.malsup.com/form/#file-upload

Facebook new javascript sdk- uploading photos with it!

要通过 ajax 发送多部分数据，请参阅这些链接

Making an HTTP POST call with multipart/form-data using jQuery?

Sending multipart/formdata with jQuery.ajax

或者最后，您可以上传到您的服务器并上传到 facebook..

[编辑]

var options = { 
        beforeSubmit:  showRequest,  // pre-submit callback 
        success:       showResponse  // post-submit callback      
    }; 

    // bind form using 'ajaxForm' 
    $('#myForm1').ajaxForm(options);