Question

我正在尝试将一个表单从一个rails应用程序发布到另一个托管在不同域上的文件。

我试过了：

$(document).on("click", ".application-form .submission input", function(e){
    e.preventDefault();
    var form = $(".application-form form");
    var data = new FormData(form);
    var url = "http://example.com/action";
    $.ajax({
        url: url,
        type: 'POST',
        success: function(){
            alert('success');
        },
        error: function(){
            alert('error');
        },
        data: data,
        cache: false,
        contentType: false,
        processData: false
    });
});

但远程服务器不接收任何数据，params只包含控制器名称和操作。

我也尝试过使用remotipart并使用form_for(@application, url: "http://example.com/action", html: {multipart: true}, remote: true)设置表单，如果我包含文件，服务器会收到[object Object]而不是正确的param名称和值。如果我不包含文件，则会正确发送和接收参数，但我需要包含上传的文件。

当我包含文件时，导致[object Object]替换所有表单数据的原因是什么？使用remotipart 1.2.1。而且我看过this并且它不适用。

Answer 1

通常，您无法通过AJAX直接从表单上传文件。你必须使用隐藏的iframe，Flash或类似的东西（在最新的浏览器中可能有所不同）来“伪造”它。 jQuery Form插件很好地简化了这一点，还有很多其他的插件可以帮助解决这个问题。

Answer 2

尝试你是什么有很多问题：

跨域请求（CORS）
表格
上传

<强> CORS

您的第一个问题是您必须确保能够在两个域之间传递数据。 CORS是一种标准协议，您只能将请求发送到预先批准的域

基本上，您需要某种方法将可能的连接域列入白名单，而使用Rails，您最好使用RACK-CORS gem

我首先要确保在“接收”域名

<强>表格

其次，您需要在提交

我会使用.serialize()函数：

$(document).on("click", ".application-form .submission input", function(e){
    e.preventDefault();
    var form = $(".application-form form");
    var data = form.serialize();
    var url = "http://example.com/action";
    $.ajax({
        url: url,
        type: 'POST',
        success: function(){
            alert('success');
        },
        error: function(){
            alert('error');
        },
        data: data,
        cache: false,
        contentType: false,
        processData: false
    });
});

这可能解释了没有将params发送到您的其他域

上传

上传文件会产生一个全新的问题，因为通过ajax使文件上传过程需要很多工作

有JQuery-FileUpload-Rails等插件允许您通过ajax上传文件。根据我的理解，这可以通过提供自定义中间件来处理通过ajax上传文件。我不完全确定它是如何工作的，但我知道它确实如此，因为我们多次使用过多次

在2个rails应用程序（包括文件）之间发布表单

2 个答案: