Skip to content

Bug: Unexpected characters appear in the Chinese encoding during streaming #30453

Closed
@shaodahong

Description

@shaodahong

React version:
18.3.1

Steps To Reproduce

When I use remix to stream render a page, sometimes garbled characters appear on the page when my data contains Chinese characters. I saw through debugging that react-dom inserts null characters when parsing, which causes an exception during merging.

const {read, written} = textEncoder.encodeInto(stringChunk, target);

img_v3_02d4_942e9e0c-fa2a-4465-af45-b9aa00e80d6g
img_v3_02d4_7b3ede95-8807-4f12-9214-d160ed0f7e9g

and when textEncoder.encodeInto exec
img_v3_02d4_e966adc3-c565-4b4c-abdc-0fa90a5eb0eg

Due to business issues, I can only provide a short reproducible fragment

var util = require('util')

var textEncoder = new util.TextEncoder()

var target = new Uint8Array([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0])

textEncoder.encodeInto(
  '__remixContext.r("routes/page.$pageName", "getConfig", {"headTitle":"升级有礼","title":"有礼升级至新版立得块优惠券20"',
  target
)
console.log(new TextDecoder().decode(target))
// result: __remixContext.r("routes/page.$pageName", "getConfig", {"headTitle":"升级有礼","title":"有��

The current behavior

When transmitting Chinese data, sometimes garbled code can occur

The expected behavior

streaming original data

Metadata

Metadata

Assignees

No one assigned

    Labels

    Status: UnconfirmedA potential issue that we haven't yet confirmed as a bug

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions