Unable to communicate to any deployed canister locally through Javascript

Hello!

I’ve been trying since yesterday to do just basic communication with the locally deployed hello canister (from the examples repository, it basically just has greet method on it) and It’s impossible to get a response from the canister (it’s constantly pending until it eventually errors out and breaks).

I import the canister at the top of javascript file that gets ran on the page .
import { hello } from "../../declarations/hello";

I tried using my own Vue code to simply contact canister and request a call to the greet method as soon as the Vue component is created, but like I said, it never completes… I get back a promise that never resolves and eventually errors out.

Vue.createApp({
    data() {
      return {
        message: 'Hello Vue!'
      } 
    },
    methods: {
        async canisterBalance() {
            console.log('called in method');
            this.message = await hello.greet("Novica");
        }
    },
    created() {
        console.log('created');
        this.canisterBalance();
    }
  }).mount('#app')

I also tried without vue and by just using the simple await hello.greet("Novica"); but nothing changes.

I’ve just do dfx stop, removed the whole .dfx directory, redeployed all canister once again and tried to test it out and no change.

My node version is v14.19.0 and npm is 6.14.11

There is also an error that the npm run start process throws when this happens and the error is this:

[webpack-dev-server] [HPM] Error occurred while proxying request localhost:8080/api/v2/canister/r7inp-6aaaa-aaaaa-aaabq-cai/call to http://localhost:8080/ [ECONNRESET] (https://nodejs.org/api/errors.html#errors_common_system_errors)
<e> [webpack-dev-server] [HPM] Error occurred while proxying request localhost:8080/api/v2/status to http://localhost:8080/ [ECONNRESET] (https://nodejs.org/api/errors.html#errors_common_system_errors)
1 Like

Ok, nevermind, it seems like it expects it to always be on the port of 8000 and since I’ve changed the port in webpack config to 8080 it was refusing connection always! I’ve just tried bringing back the port in webpack to 8000 and it works properly !

1 Like