Using fetch with local IP address

In fuse, console.log(“Start”); fetch(‘http://85.233.160.23’) // WAN IP address .then(function(response) { if (response.ok) { console.log(“Got it”); } else { console.log(“Error”); } }); console.log(“After fetch”); results in (in the Monitor) LOG: Start LOG: After fetch LOG: Start LOG: After fetch LOG: Got it LOG: Got it But console.log(“Start”); fetch(‘http://192.168.1.36’) // Local IP address .then(function(response) { if (response.ok) { console.log(“Got it”); } else { console.log(“Error”); } }); console.log(“After fetch”); results in LOG: Start LOG: After fetch LOG: Start LOG: After fetch

Apparently the .then function is failing in the second case.

Something is different about a local IP. What am I missing here? The local server is running IIS in Windows 10. The web server is freely accessible by IP address in a browser, and the default file is a simple text file.

Incidentally, everything seems to be executed twice. Anyone know why?

Oh, all the formatting has gone. The preview looked ok. Can’t see how to preserve it.

Use three backticks ` before and after code…

Like this, you mean? I can’t guarantee the syntax any more - had to patch it all together. In fuse,

        var Observable = require("FuseJS/Observable");
        console.log("Start");
        fetch('http://85.233.160.23')    // WAN IP address
        .then(function(response) { 
            if (response.ok) {
                console.log("Got it");
            } else {
                console.log("Error");
            }
        });
        console.log("After fetch"); 
    </JavaScript>
results in (in the Monitor) 
    LOG: Start 
    LOG: After fetch 
    LOG: Start 
    LOG: After fetch 
    LOG: Got it 
    LOG: Got it 

But 
    <JavaScript>
    var Observable = require("FuseJS/Observable");
        console.log("Start");
        fetch('http://192.168.1.36&#39;)     // Local IP address
        .then(function(response) { 
            if (response.ok) {
                console.log("Got it");
            } else {
                console.log("Error");
            }
        });
         console.log("After fetch"); 
     </JavaScript>
results in only
    LOG: Start 
    LOG: After fetch 
    LOG: Start 
    LOG: After fetch

Apparently the .then function is failing in the second case.

Something is different about a local IP. What am I missing here? The local server is running IIS in Windows 10. The web server is freely accessible by IP address in a browser, and the default file is a simple text file.

Incidentally, everything seems to be executed twice. Anyone know why?

What does it say if you change to:

fetch('http://192.168.1.36&#39;)   // Local IP address
    .then(function(response) { 
        console.log("Got it");
    }, function(e) {
        console.log("Error");
    })

Thanks for the suggestion, Anders. The answer is it does exactly the same thing - neither part of the .then function is executed. - Frank

When I run the same code, it times out after a while and trigger the error function. Are you sure you are on the latest version?

I posted this but it has disappeared.

I’m on version 0_9_0_5028 for windows.

The code returns an error if the destination IP address is not present on the LAN. If the address is there, it returns nothing - neither branch of the .then is executed.

A bit more information from mostly blind experimenting…

If I place the server web page in the default location - %SystemDrive%\inetpub\wwwroot - the fetch command works correctly and retrieves the file content. If I place it in another location - in this case C:\Webs\Try - it fails in the way I have described. I have of course modified the IIS settings to point to the right location and tested it by addressing the page from a browser.

So I can work around the problem, but I am left with two questions…

  • Why does it fail with no error report? The implication is that the Javascript process is stopping before the .then is executed.

  • Why is fetch treated differently from a browser request? Both use the same HTTP protocol so the server should handle them both in the same way.

    Any help and advice would be appreciated. I’m only at the start of this project.

This is very strange, could you try the following code, and give me the log?

var req = new XMLHttpRequest();
req.timeout = 800;

req.onreadystatechange = function() {
    console.log("onreadystatechange");
    console.log("ReadyState: " + req.readyState);
    console.log("Response status: " + req.status);
}
req.onerror = function(error) {
    console.log("onerror: " + error);
}
req.onabort = function() {
    console.log("onabort");
}
req.ontimeout = function() {
    console.log("ontimeout");
}

req.open("GET", "http://192.168.1.36&quot;);
req.send();

Anders - apologies for the delay. I have been away for a few days. I appreciate your help.

Running the code exctly as you sent, and switching between the target pages by changing the bindings at the server, I see this…

With 192.168.1.36 bound to a page at %SystemDrive%\inetpub\wwwroot:

LOG: onreadystatechange LOG: ReadyState: 1 LOG: Response status: undefined LOG: onreadystatechange LOG: ReadyState: 1 LOG: Response status: undefined LOG: onreadystatechange LOG: ReadyState: 4 LOG: Response status: 200 LOG: onreadystatechange LOG: ReadyState: 4 LOG: Response status: 200

…which is normal.

With 192.168.1.36 bound to a page at C:\Webs\Try:

LOG: onreadystatechange LOG: ReadyState: 1 LOG: Response status: undefined LOG: onreadystatechange LOG: ReadyState: 1 LOG: Response status: undefined

…which is abnormal - not even an error response.

A browser acquires the page normally in both cases.

This suggests the problem is common to XMLhttpRequest and fetch. Somethig prevents execution of the onerror etc functions and even the timeout.