在 chrome 中增加提取 api 的最大正文大小

Question

我正在尝试使用 Fetch API 上传大文件，当我 post 在 chrome 和 256MB 中的数据大于 128MB 时，我运行遇到了问题在火狐中。我的问题是，是否可以通过 chrome 或 firefox 中的配置来增加此最大值？我只是做错了吗？ post异步处理大数据是否有更好的选择？

这是一个说明问题的简短示例：https://jsfiddle.net/hspw4bzo

function performFetch() {
    const megabytes = document.getElementById( 'megabytes' ).value * 1;
    const largeString = (new Array(megabytes * 1024 * 1024 )).join("x");

    const options = {
      redirect: 'follow',
      method: 'POST',
      body: largeString
    };

    fetch( 'https://jsfiddle.net/', options ).then( () => {
      console.log( 'success' )
    } )
  }

当您点击 "Go" 按钮时，它将启动一个 POST 请求，请求正文大小为 128MB。在 chrome 中，这会导致框架崩溃。

Answer 1

您不应将文件作为字符串上传；这也适用于旧商品 XMLHttpRequest。您将达到服务器或浏览器（您当前面对的浏览器）的限制。

改用 Blob 的分段上传，例如。 G。就像他们做的那样 :

const formData = new FormData()
formData.append('blob', new Blob(['Hello World!\n']), 'test')

fetch('http://localhost:5001/api/v0/add', {
  method: 'POST',
  body: formData
})
.then(r => r.json())
.then(data => {
  console.log(data)
})

Answer 2

我发现在发布大量数据时，使用 Blob 可以减轻 firefox 抛出的内存不足错误和 chrome 中的崩溃。我在查看其他答案 and

后得出 Blob 用法

  function performFetch() {
    const megabytes = document.getElementById( 'megabytes' ).value * 1;
    const largeString = (new Array(megabytes * 1024 * 1024 )).join("x");

    const options = {
      redirect: 'follow',
      method: 'POST',
      body: new Blob( [ largeString ], { type: 'text/plain' } )
    };

    fetch( 'http://example.com', options ).then( () => {
      console.log( 'success' )
    } )
  }

在 chrome 中增加提取 api 的最大正文大小

Increase Maximum body size for the fetch api in chrome

javascript

google-chrome

fetch

fetch-api