使用 Javascript 下载 BIM360 Docs 文件 [英] Download BIM360 Docs file using Javascript

问题描述

我正在尝试使用 javascript 下载 BIM360 文档文件.我能够从 BIM360 获得文件响应，但无法以正确的内容保存文件.这是我的 JS 代码 -

I am trying to download BIM360 docs files using javascript. I am able to get file response from BIM360 but unable to save file with proper content. Here is my JS code -

$(document).ready(function () {
    var anchor = $('.vcard-hyperlink');
    $.ajax({
        url: <file downloaded URL>,
        type: "GET",
        headers: {
            "Authorization": "Bearer " + <accessToken>
        },
        beforeSend: function (jqxhr) {

        },
        success: function (data) {
            // create a blob url representing the data
            var blob = new Blob([data]);
            var url = window.URL.createObjectURL(blob);
            // attach blob url to anchor element with download attribute
            var anchor = document.createElement('a');
            anchor.setAttribute('href', url);
            anchor.setAttribute('download', "test.docx");
            anchor.click();
            window.URL.revokeObjectURL(url);

        },
        error: function (jqxhr, textStatus, errorThrown) {
            console.log(textStatus, errorThrown)
        }
    });
});

推荐答案

为了从 BIM360 服务下载文件，我使用了一个自定义的 Ajax 传输 jQuery 以创建新的 XMLHttpRequest 并将所有接收到的数据传递回 jQuery，参见 此处 了解使用 jQuery 进行 Ajax 传输的详细信息.

To download files from BIM360 service, I used a custom Ajax transports of the jQuery to creates new XMLHttpRequest and passes all the received data back to the jQuery, see here for the detail of the Ajax transports with jQuery.

/**
 *
 * jquery.binarytransport.js
 *
 * @description. jQuery ajax transport for making binary data type requests.
 * @version 1.0 
 * @author Henry Algus <[e-mail]>
 *
 */
// use this transport for "binary" data type
$.ajaxTransport("+binary", function(options, originalOptions, jqXHR) {
    // check for conditions and support for blob / arraybuffer response type
    if (window.FormData && ((options.dataType && (options.dataType == 'binary')) || (options.data && ((window.ArrayBuffer && options.data instanceof ArrayBuffer) || (window.Blob && options.data instanceof Blob))))) {
        return {
            // create new XMLHttpRequest
            send: function(headers, callback) {
                // setup all variables
                var xhr = new XMLHttpRequest(),
                    url = options.url,
                    type = options.type,
                    async = options.async || true,
                    // blob or arraybuffer. Default is blob
                    dataType = options.responseType || "blob",
                    data = options.data || null,
                    username = options.username || null,
                    password = options.password || null;

                xhr.addEventListener('load', function() {
                    var data = {};
                    data[options.dataType] = xhr.response;
                    // make callback and send data
                    callback(xhr.status, xhr.statusText, data, xhr.getAllResponseHeaders());
                });

                xhr.open(type, url, async, username, password);

                // setup custom headers
                for (var i in headers) {
                    xhr.setRequestHeader(i, headers[i]);
                }

                xhr.responseType = dataType;
                xhr.send(data);
            },
            abort: function() {
                jqXHR.abort();
            }
        };
    }
});

以下代码片段是我用于通过 Forge Data Management API 从 BIM360 存储桶下载文件的代码.使用上述自定义 Ajax 传输和 dataType: 'binary'，API 响应将作为 blob 进行处理.之后，我们只需要创建一个 blob URL 和一个临时 HTML 链接来打开用于保存下载文件的 blob URL.

The following code snippet is the code I used for downloading a file from BIM360 bucket via Forge Data Management API. With the above custom Ajax transports and dataType: 'binary', the API response will be processed as a blob. Afterward, we just need to create a blob URL and a temporary HTML link to open the blob URL for saving the downloaded file.

要获取实际的文件存储地址，必须调用API GET Item Versions，下载链接为每个item版本数据的storage.meta.link.href属性值在 API 响应中.

To obtain the actual file storage URL, you have to call API GET Item Versions, and the download link is the value of the storage.meta.link.href attribute of each item version data in the API response.

$(function() {

  $('a#download').click(function(event) {
    event.preventDefault();

    const filename = '2f536896-88c8-4dee-b0c1-cdeee231a028.zip';

    const settings = {
      crossDomain: true,
      url: 'https://developer.api.autodesk.com/oss/v2/buckets/wip.dm.prod/objects/' + filename,
      method: 'GET',
      dataType: 'binary',
      processData: false,
      headers: {
        Authorization: 'Bearer YOUR_ACCESS_TOKEN',
        Content-Type: 'application/octet-stream'
      }
    };

    $.ajax(settings).done(function (blob, textStatus, jqXHR) {
        console.log(blob );
        console.log(textStatus);

      if( navigator.msSaveBlob )
        return navigator.msSaveBlob(blob, filename);

      const url = URL.createObjectURL(blob);
      const a = document.createElement('a');
      a.style = 'display: none';
      document.body.appendChild(a);

      a.href = url;
      a.download = filename;
      a.click();
      URL.revokeObjectURL(url);
    });
  });
})

希望有帮助.

这篇关于使用 Javascript 下载 BIM360 Docs 文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！