Remix Run-fetch返回空响应

Question

我对Remix很陌生，并且正在使用express服务器后端运行它。

我设置了以下路由：路由->应用程序->承销->merchantId。这是$merchantId.tsx:中的Loader函数

export const loader: LoaderFunction = async (args: DataFunctionArgs) => {
try {
const { params } = args
const { merchantId } = params // path param
invariant(merchantId, 'merchantId path parameter must be defined')
const headers = args.request.headers
const cookie = headers.get('cookie')
const merchantData = await loadMerchantInfo(cookie as string)
console.log('merchantData:', merchantData)

return {
dba: 'Warner Bros',
id: merchantId,
name: 'Acme, Inc',
requestedLoanAmount: 150000,
} as UnderwritingMerchantInfo // hard coded return to keep the page working
} catch (err) {
captureException(`Loader Error: ${err}`)
throw new Error(`Loader Error: ${err}`)
}
}

这是我的提取方法：

const insecureAgent = new https.Agent({
rejectUnauthorized: false,
})
export const loadMerchantInfo = async (cookie: string, options?: any) => {
const actualOptions = options
? {
...options,
}
: ({} as RequestInit)
if (process.env.NODE_ENV !== 'production') {
actualOptions.agent = insecureAgent
const headers = actualOptions.headers
? {
...options.headers,
cookie,
accept: 'application/json',
}
: {
cookie,
accept: 'application/json',
}
actualOptions.headers = headers
}
return await fetch(
'[Internal URL] ',
actualOptions,
)
}

当我运行它时，控制台会打印出一个没有像这样主体的大响应对象：

merchantData: Response {
size: 0,
[Symbol(Body internals)]: {
body: ReadableStream {
_state: 'readable',
_reader: undefined,
_storedError: undefined,
_disturbed: false,
_readableStreamController: [ReadableStreamDefaultController]
},
type: null,
size: null,
boundary: null,
disturbed: false,
error: null
},
[Symbol(Response internals)]: {
url: '[Internal URL]',
status: 200,
statusText: 'OK',
headers: {
'access-control-allow-headers': 'Authorization,Accept,Origin,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range',
'access-control-allow-methods': 'GET,POST,OPTIONS,PUT,DELETE,PATCH',
'cache-control': [Array],
connection: 'close',
'content-length': '1096',
'content-type': 'application/json',
date: 'Wed, 17 Aug 2022 20:38:22 GMT',
expires: 'Wed, 17 Aug 2022 20:38:21 GMT',
'last-modified': 'Wed, 17 Aug 2022 20:38:21 GMT',
pragma: 'no-cache',
server: 'nginx/1.23.1',
'strict-transport-security': 'max-age=15724800; includeSubDomains'
},
counter: 0,
highWaterMark: 16384
}
}

我在网上找到的所有例子看起来都是在做类似的事情，但都返回JSON数据，其中我有一个空的响应对象。我愿意得到任何帮助。

当我尝试使用Postman这样的REST客户端在本地访问相同的url时，我会得到一个格式正确的JSON响应，比如：

[
{
"id": 15,
"salesforce_id": "0018Y00002fdzcyQAA",
"applications": [
{
"id": 21,
"salesforce_id": "0068Y00001BJkTEQA1",
"salesforce_underwriting_id": "a008Y00000cSEfUQAW"
}
]
}
]

注意：我使用不安全的代理进行本地开发，因为我在本地使用的是一个拥有自签名证书的nginx反向代理，不想看到自签名证书错误。

Answer 1

根据MDN的fetch文档，fetch返回一个响应流。你需要通读一遍。这可以通过对从fetch调用返回的Response对象调用.json()函数来实现。即

const response = await fetch([URL]);
const salesData = await response.json();

salesData应该和您在poster中看到的结果相同。