SAFE Web App Tutorial cannot connect application to the network

General Support
1

When having created the SAFE Web App Tutorial, using the mock beaker browser and accessing localhost://p:5000/, in my dev console I see XMLHttpRequest cannot errors:

log.js?4244:23 [HMR] Waiting for update signal from WDS...
safenetwork.js?4198:13 Authorising SAFE application...
vue.runtime.esm.js?ff9b:8010 Download the Vue Devtools extension for a better development experience:
https://github.com/vuejs/vue-devtools
vue.runtime.esm.js?ff9b:8021 You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html
p/:1 XMLHttpRequest cannot load http://localhost:5000/sockjs-node/info?t=1527021386593. The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'localhost://p:5000' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
client?0485:176 [WDS] Disconnected!
close @ client?0485:176
onclose @ socket.js?e5d0:17
EventTarget.dispatchEvent @ sockjs.js?3600:170
(anonymous) @ sockjs.js?3600:965
p/:1 XMLHttpRequest cannot load http://localhost:5000/sockjs-node/info?t=1527021387674. The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'localhost://p:5000' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

What causes this to happen?

2 Likes
2

It is probably due to beaker browser not allowing XMLHttpRequests. See Calls/requests to outside the network?.

3

If time permits, will you please push your code to a repository and send me the link?
Thank you for taking the time to run through the tutorials.

4

This is the WDS (Webpack dev server) not able to connect to the sock-js socket to enable HMR (hot module reloading).

HMR is a technique for development to try and prevent you needing to reload the page when you make code changes. It’s not crucial (but it is nice).

As @tfa notes, the failure to load is due to an error with the access control origin headers (for this hot reloading).

So while there is an error, your app should (hopefully) still be loading ok. (Is it?).

You can choose to ignore this error, or you can change your webpack dev server config to disable hot reloading. This should prevent the app from trying to access sockets which are not enabled in the Safe Browser.

2 Likes
5

https://gitlab.com/UniversalBasics/Cryptomint/

6

It loads, but it’s not doing anything. I recieve an error when I push the ‘add trip’ button.

/home/folatt/Cloud/workspace/atom/AAA_safe-browser-mock-v0.10.2-linux-x64/resources/app/node_module…:228 Uncaught (in promise) Error: Setup Incomplete. Connection not available yet.
    at module.exports (/home/folatt/Cloud/workspace/atom/AAA_safe-browser-mock-v0.10.2-linux-x64/resources/app/node_modules/@maidsafe/safe-node-app/src/native/_error.js:19:10)
    at SAFEApp.get connection [as connection] (/home/folatt/Cloud/workspace/atom/AAA_safe-browser-mock-v0.10.2-linux-x64/resources/app/node_modules/@maidsafe/safe-node-app/src/app.js:319:13)
    at MutableDataInterface.newMutation (/home/folatt/Cloud/workspace/atom/AAA_safe-browser-mock-v0.10.2-linux-x64/resources/app/node_modules/@maidsafe/safe-node-app/src/api/mutable.js:620:48)
    at /home/folatt/Cloud/workspace/atom/AAA_safe-browser-mock-v0.10.2-linux-x64/resources/app/node_modules/beaker-plugin-safe-app/dist/api.js:2628:32
    at <anonymous>

I’m also an absolute beginner when it comes to nodeJS so I don’t know how to disable hot reloading.

I’ve added webpack.config.js at the root of the project and made an attempt:

module.exports = {
  devServer: {
	  hot: false
  }
}
7

No worries. It what you’ve done will disable it according to the docs I linked to above :+1:

So you’re on to a new error. Progress ! :smiley: This error is saying that the connection to the network is not set up. Have you updated your IP address on the forum invite server?. Check that it’s up to date please, as some ISPs don’t provide fixed IP addresses so this could change frequently.

2 Likes
8

No, that’s an additional error.

It’s the mock network, so no need to use forum invites no?

9

This topic was automatically closed after 60 days. New replies are no longer allowed.