Web server behavior (`index.html`, `/`, etc)

WofWca · September 22, 2023, 10:57am

This post has been transferred from spec: web server behavior (`index.html`, `/`, etc) · Issue #61 · webxdc/webxdc_docs · GitHub

This came up after feat: App Info Route by Septias · Pull Request #158 · webxdc/store · GitHub. Basically the behavior of apps that use things like React/Vue/Solid routers is unreliable (might be broken) because it’s not clearly defined how the webxdc web server works.

`/` → `/index.html`

The current webxdc implementations (at least Desktop and Android) open the app in such a way that the initial URL is /index.html, not /. This is because of <iframe src="/index.html":

github.com

deltachat/deltachat-android/blob/3becdf52ecc2623b6d1ad5fd2195a2ee674a2c76/res/raw/webxdc_wrapper.html#L131


      
                });
          
                if (await sandboxedIframeCheckIsGoodPromise !== true) {
                  console.log(
                    "Error: was able to create more than 500 connections, iframe is probably isolated"
                  );
                  loadingDiv.innerText =
                    "Error: was not able to block webrtc ERROR_C";
                } else {
                  loadingDiv.innerHTML = "";
                  iframe.src = "index.html";
                }
              }
          
              return Object.freeze({
                len: () => {
                  return connections.length;
                },
              });
            })();
          </script>

github.com

deltachat/deltachat-desktop/blob/750721ca5b8e4e9c1c376c95cec470eefefd474c/static/webxdc-preload.js#L108


      
                connections.push(new RTCPeerConnection(cert))
                await new Promise(res => setTimeout(res, 0)) // this is to view loading bar, it returns to the ev loop
                loadingProgress.value = i
              }
              try {
                connections.push(new RTCPeerConnection(cert))
                console.log('could create 501th connection, this should never happen')
                ipcRenderer.invoke('webxdc.exit')
              } catch (error) {
                loadingDiv.innerHTML = ''
                iframe.src = 'index.html'
                iframe.contentWindow.window.addEventListener(
                  'keydown',
                  keydown_handler
                )
              }
            } catch (error) {
              console.log('error loading, should crash/close window', error)
              ipcRenderer.invoke('webxdc.exit')
            }
          },

Replacing src = "index.html" with src = "/" should work, as long as the server would respond with the contents of index.html to such a request (currently Delta Chat desktop responds with an error). Most web servers do, like Python’s http.

I believe this started being the case after the WebRTC patches.

non-existent → `/index.html`

Here are Vue Router docs about how the server needs to be configured for the HTML5 history mode to work properly. It says

If the URL doesn’t match any static assets, it should serve the same index.html page that your app lives in.

Which is a more debatable thing than just the “/” → “/index.html”, but it’s also somewhat less common to encounter a situation where it is useful, at least as of now, because currently you can’t open a webxdc app with a different initial URL. But you can reload a webxdc app, e.g. in Delta Chat desktop, with Ctrl+R (although currently it would just cause it to get closed because of WebRTC mitigation stuff), which would result in a 404 (or is it a network error instead? should we specify this as well?).

Web server behavior (`index.html`, `/`, etc)

/ → /index.html

non-existent → /index.html

`/` → `/index.html`

non-existent → `/index.html`