Coder Social home page Coder Social logo

Comments (12)

jimmywarting avatar jimmywarting commented on June 10, 2024

node-fetch do kind of already support streams before duplex became spec'ed
i'm guessing duplex is more complicated that just simply adding a property to RequestInit

"half" is the only valid value and it is for initiating a half-duplex fetch (i.e., the user agent sends the entire request before processing the response). "full" is reserved for future use, for initiating a full-duplex fetch (i.e., the user agent can process the response before sending the entire request). This member needs to be set when body is a ReadableStream object. See issue #1254 for defining "full".

I'm not sure it's worth the time and effort into trying to add it to node-fetch when undici / NodeJS already supports the duplex option.

from node-fetch.

jimchou-dev avatar jimchou-dev commented on June 10, 2024

Thanks for the quick response. When specifying the body as Blob.stream() to get the ReadableStream, I'm getting this error:

Uncaught (in promise) RestError: Error sending request: Failed to execute 'fetch' on 'Window': The `duplex` member must be specified for a request with a streaming body

Not sure if I'm doing something wrong, but when adding the duplex: 'half' option in RequestInit (with // @ts-ignore to ignore linter), it will work fine.

Since we are using typescript, we would like to have the duplex property being part of the type, what would be the process for me to contribute to add this RequestDuplex to RequestInit?

from node-fetch.

guest271314 avatar guest271314 commented on June 10, 2024

"half" is the only valid value and it is for initiating a half-duplex fetch (i.e., the user agent sends the entire request before processing the response). "full" is reserved for future use, for initiating a full-duplex fetch (i.e., the user agent can process the response before sending the entire request). This member needs to be set when body is a ReadableStream object. See issue #1254 for defining "full".

Technically "half" functions as "full" right now in Node.js and Deno's implementation of fetch(). We can create a TransformStream, upload the readable side, write to the writable side and read the response in parallel.

No browser implements full-duplex using fetch() over the network at large directly.

However, on Chromium-based browsers we can full-duplex stream between a ServiceWorker and a WindowClient or Client, e.g., type some lower case letters in the input field here https://plnkr.co/edit/2PQK21kZTZvZ2oVi?preview.

We can use a browser extension to use Deno or Node.js implementation, for the capability to full-duplex stream to and from the server fom arbitrary Web pages, see https://github.com/guest271314/native-messaging-deno/tree/fetch-duplex, and https://github.com/guest271314/native-messaging-nodejs/tree/full-duplex.

from node-fetch.

narajaon avatar narajaon commented on June 10, 2024

Hello, I encountered the same issue.
What would be the workaround if you guys don't want to implement this type ?

from node-fetch.

alexblack avatar alexblack commented on June 10, 2024

Seems like an issue... node fetch RequestInit has a property duplex but Typescript doesn't recognize it, missing from the types?

from node-fetch.

PassionPenguin avatar PassionPenguin commented on June 10, 2024

TypeScript requires me to add the missing duplex property when using fetch and PUT, but after added, it pops up, notifying me that duplex does not exist on RequestInit...

no duplex throws error on the fly:

TypeError: RequestInit: duplex option is required when sending a body.
    at new Request (node:internal/deps/undici/undici:5499:19)
    at R (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:35:340580)
    at D (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:60308)
    at /Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:62407
    at /Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/server/lib/trace/tracer.js:131:36
    at NoopContextManager.with (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:7062)
    at ContextAPI.with (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:518)
    at NoopTracer.startActiveSpan (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:18093)
    at ProxyTracer.startActiveSpan (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:18854)
    at /Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/server/lib/trace/tracer.js:120:103
    at NoopContextManager.with (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:7062)
    at ContextAPI.with (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/@opentelemetry/api/index.js:1:518)
    at NextTracerImpl.trace (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/server/lib/trace/tracer.js:120:28)
    at globalThis.fetch (/Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:56863)
    at MSGraphDriveProvider.uploadDriveItem (webpack-internal:///(rsc)/./src/lib/ms-graph/drive.ts:55:22)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async PUT (webpack-internal:///(rsc)/./src/app/api/graph/upload/route.tsx:30:22)
    at async /Users/hoarfroster/Desktop/hfrecipe/node_modules/next/dist/compiled/next-server/app-route.runtime.dev.js:6:62609

having duplex throws error on npm run build, but works directly on npm run dev

Type error: No overload matches this call.
  Overload 1 of 2, '(input: string | URL | Request, init?: RequestInit): Promise<Response>', gave the following error.
    Object literal may only specify known properties, and 'duplex' does not exist in type 'RequestInit'.
  Overload 2 of 2, '(input: URL | RequestInfo, init?: RequestInit): Promise<Response>', gave the following error.
    Object literal may only specify known properties, and 'duplex' does not exist in type 'RequestInit'.

  89 |                 },
  90 |                 body: content,
> 91 |                 duplex: 'half'
     |                 ^
  92 |             }
  93 |         ).then(async (res) => {
  94 |             return (await res.json()) as MSGraphDriveItem | MSGraphError;

from node-fetch.

Jet315 avatar Jet315 commented on June 10, 2024

Also getting this error. Does anyone have a resolution?

from node-fetch.

ebox86 avatar ebox86 commented on June 10, 2024

same issue, any update?

from node-fetch.

agillespie-sp avatar agillespie-sp commented on June 10, 2024

Posting the fix for my use case ... which was an API proxy using NextJS (but it may help others into looking into what they're sending in the body of the fetch call).

The body in this case was a ReabableStream, to avoid the error or the above TypeScript issue we were able to resolve the stream with:

const body = await request.json();

then pass this as the body in the fetch call

from node-fetch.

guest271314 avatar guest271314 commented on June 10, 2024

@agillespie-sp That's not streaming. We should be able to upload a ReadableStream as body using Request() and fetch().

from node-fetch.

agillespie-sp avatar agillespie-sp commented on June 10, 2024

passing the stream works, but only if you add duplex: "half" to the RequestInit object. Then you get into of the issue of duplex not being on the interface and potential build issues

from node-fetch.

fzn0x avatar fzn0x commented on June 10, 2024

Is there any way to solve this instead of using // @ts-expect-error for TypeScript?

from node-fetch.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.