日本熟妇hd丰满老熟妇,中文字幕一区二区三区在线不卡 ,亚洲成片在线观看,免费女同在线一区二区

AI 助理
備案控制臺
文檔
輸入文檔關鍵字查找
首頁 對象存儲 開發參考 SDK參考 Browser.js 上傳文件 斷點續傳上傳

Browser.js斷點續傳上傳

更新時間：
產品詳情
我的收藏

通過斷點續傳上傳的方式將文件上傳到OSS前，您可以指定斷點記錄點。上傳過程中，如果出現網絡異常或程序崩潰導致文件上傳失敗時，將從斷點記錄處繼續上傳未上傳完成的部分。

注意事項

  • 當您使用webpack或browserify等打包工具時，請通過npm install ali-oss的方式安裝Browser.js SDK。

  • 通過瀏覽器訪問OSS時涉及跨域請求，如果未設置跨域規則，瀏覽器會拒絕跨域訪問請求。如果您希望通過瀏覽器可以正常訪問OSS，需要通過OSS設置跨域規則。具體操作，請參見準備工作。

  • 由于Browser.js SDK通常在瀏覽器環境下使用，為避免暴露阿里云賬號訪問密鑰（AccessKey ID和AccessKey Secret），強烈建議您使用臨時訪問憑證的方式執行OSS相關操作。

    臨時訪問憑證包括臨時訪問密鑰（AccessKey ID和AccessKey Secret）和安全令牌（SecurityToken）。獲取臨時訪問憑證的具體操作，請參見授權訪問。

示例代碼

以下代碼用于斷點續傳上傳：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
  <body>
    <button id="submit">上傳</button>
    <button id="pause">暫停</button>
    <button id="resume">恢復上傳</button>
    <!--導入SDK文件-->
    <script
      type="text/javascript"
      src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"
    ></script>
    <script type="text/javascript">
      const client = new OSS({
       // yourRegion填寫Bucket所在地域。以華東1（杭州）為例，yourRegion填寫為oss-cn-hangzhou。
       region: 'yourRegion',
       authorizationV4: true,
       // 從STS服務獲取的臨時訪問密鑰（AccessKey ID和AccessKey Secret）。
       accessKeyId: 'yourAccessKeyId',
       accessKeySecret: 'yourAccessKeySecret',
       // 從STS服務獲取的安全令牌（SecurityToken）。
       stsToken: 'yourSecurityToken',
       // 填寫Bucket名稱，例如examplebucket。
       bucket: "examplebucket",
    });
      // 生成用于斷點續傳上傳的文件，大小為100 MB。
      const fileContent = Array(1024 * 1024 * 100)
        .fill("a")
        .join("");
      const file = new File([fileContent], "multipart-upload-file");
      // 上傳至Bucket內Object的完整路徑，例如exampledir/exampleobject.txt。
      const name = "test.txt";
      // 定義中斷點。
      let abortCheckpoint;
      // 獲取上傳和中斷DOM。
      const submit = document.getElementById("submit");
      const pause = document.getElementById("pause");
      // 獲取續傳DOM。
      const resume = document.getElementById("resume");

      // 監聽上傳按鈕，單擊后“上傳“后開始上傳。
      submit.addEventListener("click", () => {
        client
          .multipartUpload(name, file, {
            progress: (p, cpt, res) => {
              // 為中斷點賦值。
              abortCheckpoint = cpt;
              console.log(abortCheckpoint);
              // 獲取上傳進度。
              console.log(p * 100);
            },
          })
          .then((r) => console.log(r));
      });
      // 監聽暫停按鈕。
      pause.addEventListener("click", () => {
        // 暫停上傳。
        client.cancel();
      });

      const resumeUpload = async () => {
        // 設置重試次數為五次。
        try {
          const result = await client.multipartUpload(name, file, {
            checkpoint: abortCheckpoint,
            progress: (p, cpt, res) => {
              // 為了實現斷點上傳，您可以在上傳過程中保存斷點信息（checkpoint）。發生上傳錯誤后，將已保存的checkpoint作為參數傳遞給multipartUpload，此時將從上次上傳失敗的地方繼續上傳。
              abortCheckpoint = cpt;
              // 獲取上傳進度。
              console.log(p);
            },
          });
          console.log(result);
        } catch (e) {
          console.log(e);
        }
      };

      // 監聽續傳按鈕，單擊”恢復上傳“后繼續上傳。
      resume.addEventListener("click", async () => {
        await resumeUpload();
      });
    </script>
  </body>
</html>

相關文檔

關于斷點續傳上傳的完整示例代碼，請參見GitHub示例。