Troubleshooting AgentHTTPResponseError

What is the best way to troubleshoot the following error?

I am calling a backend canister function by importing the dfx generated declarations file into my React app component:

import { backend } from "../declarations/backend";

Then I am calling the backend function in a useEffect in the React component similar to this:

useEffect(() => {
    async function fetchList() {
      try {
        const list = await backend.getList();
        if (list) {
      } catch (error) {
        console.error("Error fetching list:", error);
  }, []);

When I load the component in my React application, I am getting this error:

Error fetching proposals: AgentHTTPResponseError: Server returned an error:
  Code: 404 (Not Found)
  Body: <!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<pre>Cannot POST /api/v2/canister/{canisterId}/query</pre>
    at HttpAgent._requestAndRetry (index.ts:380:1)
    at async HttpAgent._requestAndRetry (index.ts:377:1)
    at async HttpAgent._requestAndRetry (index.ts:377:1)
    at async HttpAgent._requestAndRetry (index.ts:377:1)
    at async HttpAgent.query (index.ts:430:1)
    at async caller (actor.ts:394:1)
    at async fetchList (Component.tsx:20:1)

What is the best way to troubleshoot this error?

Typically a 404 means that the canister that you’re trying to call does not exist

Is there a good way to troubleshoot if I am running the backend canister locally?

1 Like

I’d restart and reset the local replica. Use --clean when running dfx start and then rebuild your canisters. If that doesn’t work we can start to debug what goes wrong


Thank you for the tip! I realized that I was getting this error because I testing a backend functionality on a local web server and not the web server generated by DFX.

1 Like

@Severin I have the same error, but in my case --clean and re-deploying does not help.

Try to download GitHub - vporton/passport-client-dfinity at 43b400d2651376cddbc1fdc43d81e0e940016603 and then run

  1. dfx deploy backend
  2. curl 'http://localhost:3000/api/v2/canister/gf4a7-g4aaa-aaaaa-qaarq-cai/call' -H 'Accept: */*' -H 'Accept-Language: en-GB,en-US;q=0.9,en;q=0.8,ru;q=0.7' -H 'Connection: keep-alive' -H 'Content-Type: application/cbor' -H 'Cookie: next-auth.session-token=eyJhbGciOiJkaXIiLCJlbmMiOiJBMjU2R0NNIn0..sKP0dzSTrnvUjXrg.VMxTpMyD3nLAeZUGjJmpr7IIo7J89EG_YYdM6M7QVr0PazVVvxIBWuefkcMjbQQcbWg0a-adSvgf-SFumUsjIiZu1w9XbTPGSd7FjQJfIWkAExDInPBA3mlTjzdCzeVru37uz-VYFxspkKC9nxzMOyWSspDF_mOKw4teDwEHajuKIiPiDhwjh6xF9UWlk8DhX8h-joylIngq_eQxj71IbGSc_Ya8H2mcg1oeJK81XY6VxLCo6dNjmap8xXCoTIm49iuADl2MS3pY7MItutTF0_LT3wwy90vj2IL5I8K_WRaHfti1NKZ-YTzH5kLz5uJJB4HlFEtOHREP36iCj4iTr97dfP3FqoEyWo7jA34Lt-HC.wtwGsAE0nfnLpXeLP0zQXQ' -H 'Origin: http://localhost:3000' -H 'Referer: http://localhost:3000/' -H 'Sec-Fetch-Dest: empty' -H 'Sec-Fetch-Mode: cors' -H 'Sec-Fetch-Site: same-origin' -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/ Safari/537.36' -H 'sec-ch-ua: "Not_A Brand";v="8", "Chromium";v="120"' -H 'sec-ch-ua-mobile: ?0' -H 'sec-ch-ua-platform: "Linux"' --data-raw $'ÙÙ÷¡gcontent§cargXÆDIDL\u0001l\u0002øÅ®«\u0001q´ã­è\u0009q\u0001\u0000\u0084\u00010x3ee0dc43440e1132aa506de9dfa547ab0f69fc2a6d22d535a1bae3502699f28257410511f4830aec198df2676480ed18e0e1b8d9c5a18a4e5e4c0534c0cabfe91b*0xF321940F3D1599a1336CA33f08015dB52eDB0A14kcanister_idJ\u0080\u0000\u0000\u0000\u0000\u0010\u0000#\u0001\u0001ningress_expiry\u001b\u0017ª¾*Ïõ\u0008\u0000kmethod_namex\u001cscoreBySignedEthereumAddressenoncePXa±õ&\u0015Ts\u0096|>\u0011²¶ïxlrequest_typedcallfsenderA\u0004'

The second command is copied from the browser “Export to cURL”.

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<pre>Cannot POST /api/v2/canister/gf4a7-g4aaa-aaaaa-qaarq-cai/call</pre>
$ dfx --version
dfx 0.15.2+rev15.283413df

I found that my app in the browser asks port 3000, while should 4943.

Here is my code that mal-functions:

import { createActor as createBackendActor } from './declarations/backend'
    const backend = createBackendActor(ourCanisters.BACKEND_CANISTER_ID);
    const score = await backend.scoreBySignedEthereumAddress({address, signature});

Or is 3000 a proxy and should work, too?

@Severin I see that on the port 4943, when I open the browser on it, there is the error message that there is no such canister.

I tried to query it (from the browser started on 8080 by npm start) directly after dfx deploy backend and have:


(canister with this id exists)

and in the browser

Cannot POST /api/v2/canister/bkyz2-fmaaa-aaaaa-qaaaq-cai/call

(canister with the same id does not exist).

Note that I can query the canister through: So, the canister indeed exists.

Directly after the above query I queried from the browser

POST /api/v2/canister/bkyz2-fmaaa-aaaaa-qaaaq-cai/call

and get an error.

Why does the canister exists but my script in the browser not see it?!

@Severin So,


works and

POST http://localhost:3000/api/v2/canister/bkyz2-fmaaa-aaaaa-qaaaq-cai/call

doesn’t. Proxy bug?

I’ve reported it as a bug:

I relayed it to the team. Feel free to ping me again if you don’t hear back in a few days…