上传图片到Firebase Storage时如何添加日期时间等信息到文件名

你当前遇到的历史图片被覆盖的问题，核心是模板字符串语法使用错误：
JavaScript 中仅**反引号（）**包裹的内容会解析${}内的动态表达式，你使用单引号包裹路径时，所有上传文件的路径都会被固定为字面量字符串photos/${Date.now()}.jpg`，每次上传都会覆盖同路径的文件。

基础修复 #

直接将路径声明的单引号替换为反引号，即可让Date.now()生成的毫秒级时间戳生效，正常生成不重复的文件名：

const path = `photos/${Date.now()}.jpg`;

多用户场景优化 #

如果你的应用支持多用户上传，建议在路径中加入当前登录用户的UID，既避免不同用户同一毫秒上传的冲突，也方便后续按用户维度管理存储资源：

// 从Firebase Auth中获取当前登录用户的UID
const currentUid = firebase.auth().currentUser.uid;
const path = `photos/${currentUid}/${Date.now()}.jpg`;

带可读时间的路径优化 #

如果需要更清晰的文件时间标识，可将格式化后的日期加入路径，方便后续按日期筛选文件：

const now = new Date();
// 生成YYYY-MM-DD格式的日期字符串
const formatDate = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')}`;
const currentUid = firebase.auth().currentUser.uid;
const path = `photos/${currentUid}/${formatDate}/${Date.now()}.jpg`;

极端冲突规避 #

如果担心毫秒级时间戳仍有重复概率，可以在文件名末尾拼接随机字符串，进一步降低冲突可能性：

const randomSuffix = Math.random().toString(36).slice(2, 10);
const path = `photos/${Date.now()}_${randomSuffix}.jpg`;

你现有代码中Promise构造器的executor函数不需要额外加async前缀，已经外层函数声明为async的情况下，冗余的async可能导致异常捕获逻辑混乱，可调整为：

uploadPhotoAsync = async uri => {
  const path = `photos/${Date.now()}.jpg`;

  return new Promise((res, rej) => {
    fetch(uri)
      .then(response => response.blob())
      .then(file => {
        const upload = firebase.storage().ref(path).put(file)
        upload.on("state_changed", 
          snapshot => {},
          err => rej(err),
          async () => {
            const url = await upload.snapshot.ref.getDownloadURL()
            res(url)
          }
        )
      })
      .catch(err => rej(err))
  })
} 

内容的提问来源于stack exchange，提问作者Ankit Verma