Không gọi được các file JS trong Webview component

Mình muốn sử dụng Leaflet JS library nhưng không thể import vào trong Tini Studio được vì gặp lỗi “window is not defined”. Nên mình tạo một file HTML host ở nơi khác (trong đó có include LeafletJS và jQuery) và truy cập từ Tini App sử dụng Webview component. Tuy nhiên LeafletJS và jQuery không load được trên webview trong Tini App.

Câu hỏi của mình là làm như thế nào để Webview component load được các thư viện JS từ bên ngoài

Đồng thời, trong document của Webview component, file ví dụ h5.html:
src=“https://tiki/tf-miniapp.webview.js
Đường dẫn đến file “tf-miniapp.webview.js” bị sai nên mình không truy cập được file này

hi @dnhuan,

Mình nghĩ ở đây có 2 câu hỏi:

1. "window is not define"
Bạn lưu ý 1 tiniapp sẽ có 2 phần:

  • Render (.txml, .tcss): là template để render UI
  • Worker (.js): là worker xử lý logic (nó giống service worker trong mô hình PWA ấy)

Trong trường hợp của bạn là bạn đang import 1 lib trong phạm vi của Worker. Hiện Worker của tiniapp nó tương tự WebWorker hoặc ServiceWorker thế nên sẽ không có window (vốn dĩ của môi trường DOM).

2. WebView
https://tiki là host được define trong system của tiniapp shell, nghĩa là nó sẽ chỉ access được khi chạy trên app của Tiki. Thế nên bạn sẽ không access trực tiếp được.

Nói thêm framework đó để giúp bạn có thể truy xuất một số jsapi từ trong webview qua my.XXXXX

Đối với webview thì nó sẽ load 1 file .html, việc import library trong file đó thì bạn dùng <scrip src= như bình thường thôi. Nhưng lưu ý là trong webview đó kh reference tới file trên project được, thế nên load 1 lib nào đó thì bạn phải load từ remote url.

Nếu có thắc mắc bạn cứ hỏi và hy vọng giúp giải quyết vấn đề của bạn.

Cảm ơn bạn đã nhiệt tình giúp đỡ, câu trả lời của bạn rất đầy đủ và giải quyết được nhiều thắc mắc của mình về cách framework hoạt động.

Mình đã tìm được giải pháp nhờ câu trả lời của bạn.