Setting Accept Header | Effect Http Client

A common header you’ll set on almost every API call is Accept, which tells the server what content type you expect in the response.

HttpClientRequest provides a shorthand for this:

1
import {
2
  FetchHttpClient,
3
  HttpClient,
4
  HttpClientRequest,
5
} from "effect/unstable/http";
6
import { Effect } from "effect";
7

8
function fetchProducts() {
9
  return Effect.gen(function* () {
10
    const client = yield* HttpClient.HttpClient;
11

12
    const request = HttpClientRequest.get(
13
      "https://dummyjson.com/products",
14
    ).pipe(
15
      HttpClientRequest.setUrlParam("limit", "3"),
16
      HttpClientRequest.accept("application/json"),
17
    );
18

19
    const response = yield* client.execute(request);
20
    const data = yield* response.json;
21

22
    return data;
23
  }).pipe(Effect.provide(FetchHttpClient.layer));
24
}
25

26
// Test it
27
Effect.runPromise(fetchProducts()).then((data) => {
28
  data.products.forEach((product) => {
29
    console.log(`  - ${product.title}: $${product.price}`);
30
  });
31
});

Output:

1
  - Essence Mascara Lash Princess: $9.99
2
  - Eyeshadow Palette with Mirror: $19.99
3
  - Powder Canister: $14.99

.accept("application/json") is equivalent to setHeader("accept", "application/json"), just shorter and more expressive.

For the very common case of requesting JSON, there’s an even shorter version: HttpClientRequest.acceptJson.

1
const request = HttpClientRequest.get("https://dummyjson.com/products").pipe(
2
  HttpClientRequest.acceptJson,
3
);

acceptJson is not a function call. It’s a pre-built transform. You pass it directly to .pipe() without parentheses.

Stay in the loop