VueJS в Android WebView (Xamarin)

Question

Я пытаюсь связать небольшое гибридное приложение C # / одностраничное приложение, разработанное с использованием VueJS, в качестве приложения для Android. У нас есть несколько классов, которые создают и создают изображения и отправляют их на принтер ESC. Все работает, если мы загружаем приложение с сервера:

theView.LoadUrl( "https://our-app.our-server.com" );

Однако, когда мы загружаем его из файла: ///android_asset/index.html, оно вроде запускается, но страница пуста.

В отладчике Chrome я вижу, что VueJS успешно создал несколько элементов:

<div data-app="true" class="application app theme--light">
  <div class="application--wrap">
    <main class="v-content" data-booted="true" style="padding: 0px;">
      <div class="v-content__wrap"></div>
    </main>
  </div>
</div>

В консоли нет ошибок, только пустой экран.

Что яотсутствует?

Answer 1

Я понял это. Это файл: // URL! Измените на http://localhost, и это работает (+ несколько строк кода)

По той же причине, почему некоторые страницы просто не работают, когда вы открываете их непосредственно из файловой системы. Я вспомнил, что для просмотра некоторых веб-страниц мне пришлось создать локальный веб-сервер, иначе я почти ничего не вижу, потому что браузер гораздо более ограничен, когда вы открываете страницу таким образом. После того, как я изменил его на http://localhost и исправил свой запросInInInceptceptRequest для обслуживания любых запросов на "http://localhost" от активов Android, и все заработало.

Не уверен, почему (пока) - мне пришлосьзагрузить индекс следующим образом:

wv.LoadDataWithBaseURL( "http://localhost", new StreamReader( Assets.Open( "index.html" ) ).ReadToEnd(), "text/html", "UTF-8", null );

вместо

wv.LoadUrl( "http://localhost/index.html" );

Answer 2

В вашем index.html попробуйте убрать символ '/' в начале ссылок css и js

т.е. изменить:

<script src=/js/chunk-vendors.19bfdd07.js></script>
<script src=/js/app.d04362c5.js></script>

на:

<script src=js/chunk-vendors.19bfdd07.js></script>
<script src=js/app.d04362c5.js></script>

Первый экземпляр означает, что файлы js будут преобразованы в

file:///js/chunk-vendors.19bfdd07.js
file:///js/app.d04362c5.js

вместо:

file:///android_asset/js/chunk-vendors.19bfdd07.js
file:///android_asset/js/app.d04362c5.js

Интересно, есть ли способ настроить веб-пакет для удаления этих слешей? .