javascript - Google App Engine，使用 Jquery 和 Python 提供文件，返回 2 个相同的文件而不是 1 个

Question

我在带有谷歌应用引擎后端的 GAE 上运行 Flask。我在我的网站上提交了一个表单，将其发送到后端，后端返回一个 xml 文件，我想提供该 xml 文件。但是，我在提供文件时遇到问题。

这是我弄清楚如何提供我的文件的唯一方法，它有效，但它在浏览器中返回 2 个相同的文件而不是一个，我做错了什么？

在前端 jQuery 上:

$.get('submit',
        dat,
        function(data, status, request) {
            if (status = 'success'){
                console.log(status);
               $("body").append("<iframe src='" + request.getResponseHeader('redirect')+ "' style='display: none;' ></iframe>");
            }
            else 
                alert("There is an exception on server side while submitting the response!");

        }, 
        'xml'); 

在前端 Python 上:

@app.route("/submit", methods=["GET"] )
def submit():
... do some stuff to get the data and url packaged...
  headers = {'content-type': 'application/json', 'charset':'UTF-8'}
  r = requests.post(url, data=json.dumps(jsonstring), headers=headers)
  response = make_response(r.text)
  response.headers["Content-Type"] = 'application/xml'
  response.headers.add("redirect", request.url)
  response.headers["Content-Disposition"] = 'attachment; filename="exportChecklists.xml"'

  return response

基本上，我添加了一个重定向 url，这是我的请求 url，所以当文件准备好时，我只是创建了一个隐藏的 iFrame，现代浏览器重定向到它并提示下载。

我如何修改它以仅获取 1 个文件而不是 2 个？

感谢您的帮助。

更新

我已尝试同步发布，但仍然没有提示下载。 (我正在调用我的服务器，响应以 XML 文件的形式来 self 的服务器)。

var xmlHttp = null;
xmlHttp = new XMLHttpRequest();
xmlHttp.open( "POST", "/submit", false );
xmlHttp.setRequestHeader("Content-type", "application/json");
xmlHttp.send( JSON.stringify(dat ));
return xmlHttp.responseText;

Response Headers:    
Cache-Control:no-cache
content-disposition:attachment; filename="exportChecklists.xml"
Content-Length:76
content-type:application/xml
Date:Fri, 27 Dec 2013 22:59:27 GMT
Expires:Fri, 01 Jan 1990 00:00:00 GMT
Server:Development/2.0

更新#2

我仍然不知道该怎么做，所以我只提供一个文件。虽然下面的解释总体上很好，但我无法弄清楚如何使用 jQuery 只提供 1 个文件。有人可以提供有关如何执行此操作的示例。

Answer 1

在没有看到服务器端代码的情况下，我唯一能想到的可能是以下场景:

场景:

首先让我们做一些逆向工程，让我们检查代码中的以下片段:

var xmlHttp = null;
xmlHttp = new XMLHttpRequest();
xmlHttp.open( "POST", "/submit", false );
xmlHttp.setRequestHeader("Content-type", "application/json");
xmlHttp.send( JSON.stringify(dat ));
return xmlHttp.responseText;

---

观察 1:

片段 return xmlHttp.responseText; 的第 6 行证明您正在打开的页面输出一些东西，即 XML 代码，因为您正在尝试返回它。

结论 1:

您正在打印的输出是下载的两个 XML 文件之一。

---

观察 2:

让我们看看这行代码content-disposition:attachment; filename="exportChecklists.xml"

这会提示浏览器将 XML 下载到计算机。

结论 2:

这是下载的第二个 XML 文件。

---

注意:

这是我在没有查看您的服务器代码的情况下做出的最佳猜测，所以在您投反对票之前请三思，请...

---

我在 AlexIIP 的评论之后的研究:

让我们分析一下 jQuery 代码:

$.get('submit',
    dat,
    function (data, status, request) {
        if (status = 'success') {
            console.log(status);
            $("body").append("<iframe src='" + request.getResponseHeader('redirect') + "' style='display: none;' ></iframe>");
        } else alert("There is an exception on server side while submitting the response!");    
    },
    'xml');

特别是这一行:

$("body").append("<iframe src='" + request.getResponseHeader('redirect') + "' style='display: none;' ></iframe>");

当您将 request.getResponseHeader('redirect') 的结果附加为 iframe 的源时，很明显请求不会返回 XML，而是返回一个 redirect header 属性 指向 XML，因此，您在 iframe 和 header 中获得 XML content-disposition:attachment; filename="exportChecklists.xml" 提示下载，这就是为什么您会得到两次下载。 (可能是 iframe 和 doc，都尝试下载，导致 2 次下载..)

现在，一旦你理解了上面的段落，你就可以很容易地理解为什么你在 JavaScript 中没有下载的原因，我们可以从上面的段落中得出的结论是:

响应不包含任何 XML，但响应的 header (“重定向”)指向 XML 代码文件...

因此在 JavaScript 中，当您执行 return xmlHttp.responseText; 时，您返回的是响应所含的文本 (HTML)，但您真正拥有的是带有 XML url 的重定向 header 文件。所以要获取 XML，而不是:

return xmlHttp.responseText;

你应该这样做:

return xmlHttp.getResponseHeader('redirect');

但上面的行将返回 XML 文件的路径，并希望提示一个下载...