qt: fix cam access by restoring window.isSecureContext

In d78380f, we switched from qrc:/ to the bitboxapp:/ custom scheme
so we can force mimetypes in the scheme handler. This somehow made
window.isSecureContext be false, breaking camera (which requires a
secure context).

The issue was that our scheme handler was never registered, because it
was configued with HostAndPort but no default port was specified. We
could specify one, or switch to Host only, but in our case Path seems
to be most appropriate.

The frontend navigation is changed from browser router to hash based
router, as somehow navigation breaks in the custom scheme, as the
frontend tries to actually request the individual pages from
QtWebEngine. Not sure why it was working before or what causes it, but
a local hash based router seems to work.

Author: benma

frontends/qt/main.cpp

@@ -184,8 +184,8 @@ class RequestInterceptor : public QWebEngineUrlRequestInterceptor {
         // We treat the exchange pages specially because we need to allow exchange
         // widgets to load in an iframe as well as let them open external links
         // in a browser.
-        bool onExchangePage = currentUrl.contains(QRegularExpression(QString("^%1:/exchange/.*$").arg(scheme)));
-        bool onBitsurancePage = currentUrl.contains(QRegularExpression(QString("^%1:/bitsurance/.*$").arg(scheme)));
+        bool onExchangePage = currentUrl.contains(QRegularExpression(QString("^%1:/index\.html\#/exchange/.*$").arg(scheme)));
+        bool onBitsurancePage = currentUrl.contains(QRegularExpression(QString("^%1:/index\.html\#/bitsurance/.*$").arg(scheme)));
         if (onExchangePage || onBitsurancePage) {
             if (info.firstPartyUrl().toString() == info.requestUrl().toString()) {
                 // Ignore requests for certain file types (e.g., .js, .css) Somehow Moonpay loads
@@ -208,7 +208,7 @@ class RequestInterceptor : public QWebEngineUrlRequestInterceptor {
 
         // All the requests originated in the wallet-connect section are allowed, as they are needed to
         // load the Dapp logos and it is not easy to filter out non-images requests.
-        bool onWCPage = currentUrl.contains(QRegularExpression(QString(R"(^%1:/account/[^\/]+/wallet-connect/.*$)").arg(scheme)));
+        bool onWCPage = currentUrl.contains(QRegularExpression(QString(R"(^%1:/index\.html\#/account/[^\/]+/wallet-connect/.*$)").arg(scheme)));
         if (onWCPage) {
             return;
         }
@@ -339,11 +339,8 @@ int main(int argc, char *argv[])
     }
 
     QWebEngineUrlScheme bbappScheme(scheme);
-    bbappScheme.setSyntax(QWebEngineUrlScheme::Syntax::HostAndPort);
-    bbappScheme.setFlags(
-        QWebEngineUrlScheme::LocalScheme |
-        QWebEngineUrlScheme::SecureScheme |
-        QWebEngineUrlScheme::LocalAccessAllowed);
+    bbappScheme.setSyntax(QWebEngineUrlScheme::Syntax::Path);
+    bbappScheme.setFlags(QWebEngineUrlScheme::SecureScheme);
     QWebEngineUrlScheme::registerScheme(bbappScheme);
 
     view = new WebEngineView();

frontends/web/src/app.tsx

@@ -63,8 +63,8 @@ export const App = () => {
   }, [t]);
 
   const maybeRoute = useCallback(() => {
-    const currentURL = window.location.pathname;
-    const isIndex = currentURL === '/' || currentURL === '/index.html' || currentURL === '/android_asset/web/index.html' || currentURL.endsWith('/assets/web/index.html');
+    const currentURL = window.location.hash.replace(/^#/, '');
+    const isIndex = currentURL === '' || currentURL === '/';
     const inAccounts = currentURL.startsWith('/account/');
 
     // QT and Android start their apps in '/index.html' and '/android_asset/web/index.html' respectively

frontends/web/src/index.tsx

@@ -18,7 +18,7 @@
 import React from 'react';
 import { createRoot } from 'react-dom/client';
 import { I18nextProvider } from 'react-i18next';
-import { BrowserRouter } from 'react-router-dom';
+import { HashRouter } from 'react-router-dom';
 import { App } from './app';
 import { i18n } from './i18n/i18n';
 import './style/index.css';
@@ -30,9 +30,9 @@ root.render(
   <React.StrictMode>
     <I18nextProvider i18n={i18n}>
       <React.Suspense fallback={null}>
-        <BrowserRouter>
+        <HashRouter>
           <App />
-        </BrowserRouter>
+        </HashRouter>
       </React.Suspense>
     </I18nextProvider>
   </React.StrictMode>