ファイルのアップロード機能：ファイル名の設定

Next.jsとsupabaseで個人開発をしています。その中で、ファイルをアップロードする機能を作成しています。アップロードできないファイル名(eapⅡ.mp4など)があったため解決方法をまとめました。

ファイル名の設定

index.ts

const sanitizedFileName=file.name.replace(/[^a-z0-9]/gi,'_').toLowerCase();
//aからz,0から9,アンダースコアなどの文字列を以外の文字を除外する
const lastDotIndex=sanitizedFileName.lastIndexOf('.');//sanitizedFileNameの最後のピリオドの位置
const fileName=lastDotIndex>0?sanitizedFileName.slice(0,lastDotIndex):sanitizedFileName;
//lastDotIndexが0以上なら、最後のドットの前までを取り出す。それ以外ならsanitizedFileNameをそのまま使う
const fileExt=lastDotIndex>0?sanitizedFileName.slice(lastDotIndex+1):'';

const uniqueId=uuidv4();

const filePath=`${fileName}-${userId}=${uniqueId}.${fileExt}`;