Skip to content

fix(rn): uploadFile sends the real file name instead of hardcoded 'file' - #19507

Merged
Single-Dancer merged 1 commit into
NervJS:mainfrom
dvd233:fix/rn-uploadfile-filename-19505
Sep 29, 2026
Merged

Single-Dancer merged 1 commit into
NervJS:mainfrom
dvd233:fix/rn-uploadfile-filename-19505

Conversation

@dvd233

@dvd233 dvd233 commented Sep 22, 2026 •

Copy link
Copy Markdown
Contributor

What this PR does / 这个 PR 做了什么

On React Native, uploadFile builds the multipart file object with a hardcoded name: 'file', so the server always receives the file name file and cannot read the original name or extension (e.g. to distinguish image types), as reported in #19505.

RN 端 uploadFile 组装 multipart 文件对象时把 name 写死为 'file',后端拿不到真实文件名/后缀(#19505)。

The H5 implementation already sends a meaningful file name (form.append(name, fileObj, fileName || \file-${Date.now()}`)), and the public Taro.uploadFile.Optiontype already exposesfileName`. RN is the outlier.

How / 修改方式

packages/taro-rn/src/lib/file.ts — createFormData now resolves the file name as:

  1. the explicit fileName option, then
  2. the filePath basename (e.g. xxxx.jpg), then
  3. the historical 'file' fallback when neither exists.

packages/taro/types/api/network/upload.d.ts — fileName 的 @supported 标记从 h5 更新为 h5, rn(该选项类型本来就存在,仅文档标记未覆盖 RN)。

Verification / 验证

  • Red: with the fix reverted, the two new assertions fail (name is always 'file'); the fallback case passes on both old and new code, pinning backward compatibility.
  • Green: packages/taro-rn full Jest suite — 14 suites / 36 passed / 1 skipped, including the new __tests__/uploadFile.test.ts (basename derivation, explicit fileName override, 'file' fallback).
  • tsc --noEmit on packages/taro-rn: zero errors in changed files (the single remaining error is the pre-existing @tarojs/runtime-rn workspace build-order issue in untouched src/api/index.ts, identical before and after).
  • ESLint on changed files: 0 errors; git diff --check clean.

Note: the package's own testMatch glob does not match on Windows (mixed separators), so tests were run with npx jest --testMatch '**/__tests__/**/*.test.ts' — same suites, no repo config changes.

Fixes #19505

Summary by CodeRabbit

  • 新功能
    • React Native 平台的文件上传现支持自定义 fileName。
    • 未指定文件名时,系统会优先使用文件路径中的名称;无法解析时回退为默认名称。
    • 上传文件类型统一标记为 application/octet-stream。
  • 测试
    • 新增文件上传相关测试,覆盖自定义文件名、路径名称提取及默认名称回退场景。

@coderabbitai

coderabbitai Bot commented Sep 22, 2026 •

Copy link
Copy Markdown
Contributor

Review in Change Stack →

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

Important

Review skipped

Review was skipped as selected files did not have any reviewable changes.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 07bbfc95-7d7b-4924-9314-7973de04d192

📥 Commits

Reviewing files that changed from the base of the PR and between b0f096b and 0e3202a.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: db2d01b2-e60b-4ac5-a0a6-8f152979cb9a

📥 Commits

Reviewing files that changed from the base of the PR and between 6205652 and ccc5cc5.

📒 Files selected for processing (3)
  • packages/taro-rn/__tests__/uploadFile.test.ts
  • packages/taro-rn/src/lib/file.ts
  • packages/taro/types/api/network/upload.d.ts

Included review availability: Your plan provides up to 10 included reviews per hour; 9 remain after this review.


Walkthrough

该变更修正 RN uploadFile 的文件名生成逻辑,补充类型注释,并新增测试覆盖默认名推导、自定义名覆盖和回退值行为。

Changes

RN uploadFile 文件名支持

Layer / File(s) Summary
上传文件名传递与声明
packages/taro-rn/src/lib/file.ts, packages/taro/types/api/network/upload.d.ts
createFormData 新增 fileName 参数。文件名改为 fileName、filePath basename、'file' 的顺序回退。uploadFile 透传 fileName。upload.d.ts 将 fileName 的支持平台注释扩展到 rn。
文件名行为测试
packages/taro-rn/__tests__/uploadFile.test.ts
新增测试文件。测试覆盖未传 fileName 时从 filePath 提取 basename、传入 fileName 时优先使用自定义值、以及路径无法解析名称时回退到 'file'。测试同时校验 FormData.append 参数和成功/失败回调。

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~12 minutes

Change: Bug fix · Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to ccc5c

The filename override, URI-path basename fallback, and legacy fallback behavior are covered without an actionable current risk.

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed 标题准确概括了主要变更:修复 React Native uploadFile 使用硬编码文件名 'file' 的问题,使其改用实际文件名。
Linked Issues check ✅ Passed PR 实现了 issue [#19505] 的编码要求。packages/taro-rn/src/lib/file.ts 将 fileName 传入 createFormData,并按 fileName、filePath basename、'file' 的顺序设置 multipart 文件名。新增 `packages/taro-rn/tests/uploadFile…
Out of Scope Changes check ✅ Passed 变更范围与 issue [#19505] 一致。实现修改 RN uploadFile 的 multipart 文件名处理;回归测试验证该行为;类型文档同步声明 RN 支持。未发现与该目标无关的变更。
Docstring Coverage ✅ Passed Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 3 files.
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create a new PR

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

小兔背着表单包,沿着 filePath 找名字。
若有 fileName 先开口,就把旧称轻轻替。
末尾若是空荡荡,还请 'file' 来站岗。
测试排成三小队,挨个核对不慌张。
一纸注释添上 rn,月光下也能说明白。

Comment @coderabbitai help to get the list of available commands.

@codecov

codecov Bot commented Sep 22, 2026 •

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 54.39%. Comparing base (0f74829) to head (0e3202a).

Additional details and impacted files

Impacted file tree graph

@@            Coverage Diff             @@
##             main   #19507      +/-   ##
==========================================
- Coverage   54.66%   54.39%   -0.27%     
==========================================
  Files         465      466       +1     
  Lines       25392    25551     +159     
  Branches     6364     6361       -3     
==========================================
+ Hits        13880    13898      +18     
- Misses       9636     9667      +31     
- Partials     1876     1986     +110     
Flag Coverage Δ
taro-cli 56.96% <ø> (ø)
taro-runtime 58.11% <ø> (ø)
taro-web 52.37% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines Coverage Δ
packages/taro-rn/src/lib/file.ts 11.32% <100.00%> (ø)

... and 53 files with indirect coverage changes

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@Single-Dancer
Single-Dancer force-pushed the fix/rn-uploadfile-filename-19505 branch from ccc5cc5 to b0f096b Compare September 29, 2026 03:32
On React Native, createFormData hardcoded the multipart file object's
name to 'file', so backends could not read the original file name or
extension (e.g. to distinguish image types). The H5 implementation
already forwards a meaningful name (option fileName, blob name, or a
generated fallback).

RN now resolves the name as: explicit fileName option, then the
filePath basename, then the historical 'file' fallback. The public
Taro.uploadFile.Option type already exposes fileName; its @supported
tag is updated to include rn.

Adds regression tests covering the basename derivation, the explicit
fileName override, and the 'file' fallback.

Fixes NervJS#19505
@Single-Dancer
Single-Dancer force-pushed the fix/rn-uploadfile-filename-19505 branch from b0f096b to 0e3202a Compare September 29, 2026 06:29
@Single-Dancer
Single-Dancer merged commit 73d9cb0 into NervJS:main Sep 29, 2026
25 checks passed
@Single-Dancer Single-Dancer added this to the 4.2.2 milestone Sep 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

RN下的uploadFile中的createFormData方法存在name写死的问题

2 participants