Angular:如何下载文件而不在url中显示access_token

Question

我的web应用程序由Oauth2保护。对于ajax调用，必须在request文件夹中提供access_token。例如，以下是factory.js中的一种方法：

   service.getAll = function () {
        var url = SERVER + "/ristore/foundation/";
        return $http({
            headers: {'Authorization': 'Bearer ' + $window.localStorage.getItem("access_token")},
            url: url,
            method: 'GET',
            crossOrigin: true
        })
    }

现在我想从网页上下载一个文件。文件通过流式传输从服务器传递到客户端：

@RequestMapping(
        value = "/ristore/foundation/xml/{filename}",
        method = RequestMethod.GET,
        produces = "application/xml")
public ResponseEntity<byte[]> downloadXMLFile(@PathVariable String filename) throws IOException {
    FileSystemResource xmlFile = new FileSystemResource("/rsrch1/rists/moonshot/data/prod/foundation/xml/" + filename + ".xml");
    byte [] content = new byte[(int)xmlFile.contentLength()];
    IOUtils.read(xmlFile.getInputStream(), content);

    return ResponseEntity.ok()
        .contentType(MediaType.parseMediaType("application/octet-stream"))
        .contentLength(xmlFile.contentLength())
        .body(content);
}

在html中，我在按钮上指定ng-click()，单击该按钮即可开始下载：

        <td data-title="'File'" class="text-center"><span class="glyphicon glyphicon-download-alt" ng-click="download(report.filename)"></span></a>
            </td>

根据对这篇文章的回答，Download files in Javascript with OAuth2使用$window.open来处理我的控制器中的url：

  $scope.download = function(filename) {
        var url = "http://rcdrljboss01a:9880/ristoreService/ristore/foundation/xml/" + filename + "?access_token=" + $window.localStorage.getItem("access_token");
        $window.open(url);
    }

我可以通过这种方式下载文件，但access_token显示在下载url中。有没有办法在url中隐藏access_token？

Answer 1

您应该将访问令牌放在头中，而不是放在查询参数中。

这个tutorial详细展示了它是如何工作的。

Edit :有没有办法将令牌添加到wondow.open(..)的头部？

不能，似乎无法直接更改window.open(..)的标头。

您可以执行的操作：

使用ajax获取xml，打开一个新窗口，并将文件设置为窗口的内容(伪代码，您可能需要将内容转换为字符串)：

var win = open('some-url','windowName','height=300,width=300');
win.document.write(content);