如何向 DOM 表单元素添加授权标头？

Question

我正在尝试将文件上传到服务器，并按如下方式设置 DOM 元素：

        _uploadForm = document.createElement("form");

        _uploadForm.method = "POST";
        _uploadForm.action = "#";

        if(_isBrowser.IE)
            _uploadForm.encoding = "multipart/form-data";
        else
            _uploadForm.enctype = "multipart/form-data";

我的服务器需要 http 基本授权标头。我怎样才能通过这个 DOM 元素传递它？

Answer 1

您的 JavaScript 客户端在提交表单时必须添加标头。
我不确定您正在使用哪个 javacript 客户端库，但是像 Angular 这样的东西确实允许您设置默认标头，甚至可以在发送之前添加可以添加标头的拦截器。

        var req = {
 method: 'POST',
 url: 'http://example.com',
 headers: {
   'Content-Type': undefined,
   'Authorization':  'your-scheme your-token-perhaps'
 },
 data: { test: 'test' }
}

Answer 2

DOM 元素与授权无关，它们只是浏览器内部各种 html 标签的表示。服务器要求授权 - 如果页面位于受保护区域中，那么服务器将要求凭据，这与表单本身无关。

Answer 3

最简单的方法是从同一文件夹提供上传表单和上传处理程序，并使用 .htaccess 对两者强制进行基本身份验证。然后，在加载上传表单时，浏览器会自动请求凭据，并且凭据将随上传一起自动发送（我相信）。

但是，最好的选择是根本不使用 HTTP Basic 身份验证。它会在每次请求时以明文形式发送密码，除非您使用 SSL，而且一般来说，使用起来很麻烦。

如果您坚持使用Basic，我相信可以使用ActionScript（编译为SWF）来完成。我还知道一种在 AJAX 调用上设置授权标头的方法，但是您无法使用 AJAX 调用上传文件，并且浏览器不记得通过 AJAX 调用发送的授权标头。