อัปโหลดไฟล์ด้วย Cloud Storage บน Flutter

Cloud Storage สำหรับ Firebase ช่วยให้คุณอัปโหลดไฟล์ไปยังบัคเก็ต Cloud Storage ที่ Firebase จัดหาและจัดการได้อย่างรวดเร็วและง่ายดาย

อัพโหลดไฟล์

ในการอัปโหลดไฟล์ไปยัง Cloud Storage คุณต้องสร้างการอ้างอิงไปยังเส้นทางแบบเต็มของไฟล์ก่อน รวมถึงชื่อไฟล์ด้วย

// Create a storage reference from our app
final storageRef = FirebaseStorage.instance.ref();

// Create a reference to "mountains.jpg"
final mountainsRef = storageRef.child("mountains.jpg");

// Create a reference to 'images/mountains.jpg'
final mountainImagesRef = storageRef.child("images/mountains.jpg");

// While the file names are the same, the references point to different files
assert(mountainsRef.name == mountainImagesRef.name);
assert(mountainsRef.fullPath != mountainImagesRef.fullPath);

เมื่อคุณสร้างข้อมูลอ้างอิงที่เหมาะสมแล้ว ให้คุณเรียกใช้ putFile() , putString() หรือ putData() เพื่ออัปโหลดไฟล์ไปยัง Cloud Storage

คุณอัปโหลดข้อมูลโดยอ้างอิงถึงรูทของที่เก็บข้อมูล Cloud Storage ไม่ได้ การอ้างอิงของคุณต้องชี้ไปที่ URL ย่อย

อัพโหลดจากไฟล์

ในการอัปโหลดไฟล์ คุณต้องรับเส้นทางที่แน่นอนไปยังตำแหน่งบนอุปกรณ์ก่อน ตัวอย่างเช่น ถ้ามีไฟล์อยู่ในไดเร็กทอรีเอกสารของแอปพลิเคชัน ให้ใช้แพ็คเกจ path_provider อย่างเป็นทางการเพื่อสร้างเส้นทางของไฟล์และส่งไปยัง putFile() :

Directory appDocDir = await getApplicationDocumentsDirectory();
String filePath = '${appDocDir.absolute}/file-to-upload.png';
File file = File(filePath);

try {
  await mountainsRef.putFile(file);
} on firebase_core.FirebaseException catch (e) {
  // ...
}

อัปโหลดจากสตริง

คุณสามารถอัปโหลดข้อมูลเป็นสตริงที่เข้ารหัสแบบ raw, base64 , base64url หรือ data_url โดยใช้ putString() ตัวอย่างเช่น ในการอัปโหลดสตริงข้อความที่เข้ารหัสเป็น Data URL:

String dataUrl = 'data:text/plain;base64,SGVsbG8sIFdvcmxkIQ==';

try {
  await mountainsRef.putString(dataUrl, format: PutStringFormat.dataUrl);
} on FirebaseException catch (e) {
  // ...
}

กำลังอัพโหลดข้อมูลดิบ

คุณสามารถอัปโหลดข้อมูลที่พิมพ์ในระดับล่างในรูปแบบของ Uint8List สำหรับกรณีที่ไม่สามารถอัปโหลดสตริงหรือ File ได้ ในกรณีนี้ เรียก putData() ด้วยข้อมูลของคุณ:

try {
  // Upload raw data.
  await mountainsRef.putData(data);
} on firebase_core.FirebaseException catch (e) {
  // ...
}

รับ URL ดาวน์โหลด

หลังจากอัปโหลดไฟล์ คุณจะได้รับ URL เพื่อดาวน์โหลดไฟล์โดยเรียก getDownloadUrl() ใน Reference :

await mountainsRef.getDownloadURL();

เพิ่มข้อมูลเมตาของไฟล์

คุณยังสามารถรวมข้อมูลเมตาเมื่อคุณอัปโหลดไฟล์ ข้อมูลเมตานี้มีคุณสมบัติข้อมูลเมตาของไฟล์ทั่วไป เช่น contentType (โดยทั่วไปจะเรียกว่าประเภท MIME) putFile() จะอนุมานประเภท MIME โดยอัตโนมัติจาก File แต่คุณสามารถแทนที่ประเภทที่ตรวจพบอัตโนมัติได้โดยการระบุ contentType ในข้อมูลเมตา หากคุณไม่ได้ระบุ contentType และ Cloud Storage ไม่สามารถอนุมานค่าเริ่มต้นจากนามสกุลไฟล์ได้ Cloud Storage จะใช้ application/octet-stream ดู ใช้ข้อมูลเมตา ของไฟล์

try {
  await mountainsRef.putFile(file, SettableMetadata(
    contentType: "image/jpeg",
  ));
} on firebase_core.FirebaseException catch (e) {
  // ...
}

จัดการการอัปโหลด

นอกจากการเริ่มการอัปโหลด คุณสามารถหยุดชั่วคราว เล่นต่อ และยกเลิกการอัปโหลดโดยใช้เมธอด pause() , resume() และ cancel() เหตุการณ์หยุดชั่วคราวและดำเนินต่อจะเพิ่มสถานะการ pause และ progress ตามลำดับ การยกเลิกอัปโหลดจะทำให้การอัปโหลดล้มเหลวโดยมีข้อผิดพลาดที่ระบุว่าการอัปโหลดถูกยกเลิก

final task = mountainsRef.putFile(largeFile);

// Pause the upload.
bool paused = await task.pause();
print('paused, $paused');

// Resume the upload.
bool resumed = await task.resume();
print('resumed, $resumed');

// Cancel the upload.
bool canceled = await task.cancel();
print('canceled, $canceled');

ตรวจสอบความคืบหน้าในการอัปโหลด

คุณสามารถฟังสตรีมเหตุการณ์ของงานเพื่อจัดการกับความสำเร็จ ความล้มเหลว ความคืบหน้า หรือหยุดชั่วคราวในงานอัปโหลดของคุณ:

mountainsRef.putFile(file).snapshotEvents.listen((taskSnapshot) {
  switch (taskSnapshot.state) {
    case TaskState.running:
      // ...
      break;
    case TaskState.paused:
      // ...
      break;
    case TaskState.success:
      // ...
      break;
    case TaskState.canceled:
      // ...
      break;
    case TaskState.error:
      // ...
      break;
  }
});

การจัดการข้อผิดพลาด

มีสาเหตุหลายประการที่ทำให้เกิดข้อผิดพลาดในการอัปโหลด รวมถึงไฟล์ในเครื่องที่ไม่มีอยู่ หรือผู้ใช้ไม่ได้รับอนุญาตให้อัปโหลดไฟล์ที่ต้องการ คุณสามารถค้นหาข้อมูลเพิ่มเติมเกี่ยวกับข้อผิดพลาดได้ในส่วน จัดการข้อผิดพลาด ของเอกสาร

ตัวอย่างเต็ม

ตัวอย่างที่สมบูรณ์ของการอัปโหลดพร้อมการตรวจสอบความคืบหน้าและการจัดการข้อผิดพลาดแสดงอยู่ด้านล่าง:

final appDocDir = await getApplicationDocumentsDirectory();
final filePath = "${appDocDir.absolute}/path/to/mountains.jpg";
final file = File(filePath);

// Create the file metadata
final metadata = SettableMetadata(contentType: "image/jpeg");

// Create a reference to the Firebase Storage bucket
final storageRef = FirebaseStorage.instance.ref();

// Upload file and metadata to the path 'images/mountains.jpg'
final uploadTask = storageRef
    .child("images/path/to/mountains.jpg")
    .putFile(file, metadata);

// Listen for state changes, errors, and completion of the upload.
uploadTask.snapshotEvents.listen((TaskSnapshot taskSnapshot) {
  switch (taskSnapshot.state) {
    case TaskState.running:
      final progress =
          100.0 * (taskSnapshot.bytesTransferred / taskSnapshot.totalBytes);
      print("Upload is $progress% complete.");
      break;
    case TaskState.paused:
      print("Upload is paused.");
      break;
    case TaskState.canceled:
      print("Upload was canceled");
      break;
    case TaskState.error:
      // Handle unsuccessful uploads
      break;
    case TaskState.success:
      // Handle successful uploads on complete
      // ...
      break;
  }
});

เมื่อคุณอัปโหลดไฟล์แล้ว มาเรียนรู้วิธี ดาวน์โหลดไฟล์ จาก Cloud Storage กัน