Nhúng nội dung web vào ứng dụng của bạn dưới dạng nội dung chính hoặc nội dung hỗ trợ
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Android cho phép bạn tận dụng sức mạnh của web trong ứng dụng. Nhờ đó, bạn có thể hưởng lợi từ tính linh hoạt và hiệu quả khi hiển thị một số loại nội dung.
Nhúng nội dung bằng WebView
API WebView cho phép bạn truy cập vào các chức năng của một trình duyệt thu nhỏ để hiển thị nội dung web trong ứng dụng. Nhờ đó, bạn có thể cung cấp trải nghiệm dựa trên web dưới dạng một phần cốt lõi hoặc hỗ trợ trong ứng dụng của mình, như trong Hình 1.
Hình 1. Nội dung web được nhúng trong ứng dụng bằng các đối tượng `WebView` làm nội dung chính (bên trái) và nội dung bổ trợ (bên phải).
Những việc WebView có thể làm
Bạn có thể làm những việc sau với WebView trong ứng dụng của mình:
Nhúng web: WebView được tích hợp vào giao diện người dùng của ứng dụng dưới dạng một thành phần, tương tự như nút hoặc trường văn bản.
Tải nội dung: WebView có thể tải nội dung trên web từ nhiều nguồn:
URL từ xa: Ứng dụng này có thể tìm nạp và hiển thị các trang web trên Internet, giống như một trình duyệt thông thường.
Tệp cục bộ: Có thể tải các tệp HTML, CSS và JavaScript được lưu trữ trong tài nguyên của ứng dụng.
Nội dung được tạo động: Ứng dụng có thể tạo nội dung HTML một cách linh động và cung cấp nội dung đó cho WebView.
Kết xuất: WebView sử dụng công cụ trình duyệt để phân tích cú pháp và kết xuất HTML, CSS và JavaScript, hiển thị trang web kết quả trong khu vực được chỉ định trong giao diện người dùng của ứng dụng.
Thực thi JavaScript: WebView có thể thực thi mã JavaScript trong ngữ cảnh của trang web đã tải. Điều này cho phép các hoạt động tương tác và nội dung cập nhật linh hoạt trong WebView.
Tương tác với ứng dụng của bạn: Đây là nơi WebView trở nên mạnh mẽ hơn. Thao tác này cho phép giao tiếp hai chiều giữa trang web và ứng dụng.
JavaScript cho mã ứng dụng: Mã JavaScript chạy trong WebView có thể gọi các API máy chủ của ứng dụng, cho phép truy cập vào các tính năng của thiết bị như camera, GPS hoặc cảm biến.
Mã ứng dụng thành JavaScript: Ứng dụng cũng có thể chèn mã JavaScript vào một WebView, thao tác nội dung của trang web hoặc phản hồi các sự kiện do trang web kích hoạt.
WebView khác với trình duyệt như thế nào
WebView là một thành phần có khả năng tuỳ chỉnh cao, cung cấp chức năng cốt lõi của một cửa sổ vào web. Không giống như trình duyệt (cung cấp một thanh điều hướng và các phần tử khác trên giao diện người dùng để điều hướng trên web một cách rộng rãi hơn), trải nghiệm tổng thể của một WebView được định hình bởi thiết kế và mục đích của ứng dụng.
Để hiểu rõ hơn về sự khác biệt giữa WebView và các trình duyệt tiêu chuẩn, hãy xem phần giải thích sau:
Giao diện người dùng: WebView được dùng để hiển thị nội dung trên web và không có tiêu đề hoặc giao diện người dùng riêng như hầu hết các trình duyệt phổ biến khác, ví dụ: nút trang chủ, thanh địa chỉ hoặc trình đơn cài đặt.
Tính năng: Nhiều trình duyệt có các tính năng tích hợp sẵn để tăng cường trải nghiệm duyệt web, chẳng hạn như dấu trang, quyền hoặc nhật ký.
Bản cập nhật: Vì WebView là một dịch vụ hệ thống trên Android, nên các bản cập nhật sẽ được đẩy và tích hợp vào các ứng dụng một cách tự động hằng tháng.
Các trình duyệt dựa vào bản cập nhật ứng dụng tương ứng và sau đó người dùng cuối sẽ áp dụng bản cập nhật trên thiết bị của họ.
Nội dung và mã mẫu trên trang này phải tuân thủ các giấy phép như mô tả trong phần Giấy phép nội dung. Java và OpenJDK là nhãn hiệu hoặc nhãn hiệu đã đăng ký của Oracle và/hoặc đơn vị liên kết của Oracle.
Cập nhật lần gần đây nhất: 2025-09-05 UTC.
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2025-09-05 UTC."],[],[],null,["Android lets you build on the power of the web within your app. So, you can\nbenefit from the flexibility and efficiency of displaying certain types of\ncontent.\n\nEmbedding content using `WebView`\n\nThe [`WebView`](/reference/android/webkit/WebView) API gives you access to the capabilities of a mini-browser\nfor displaying web content within your app. This lets you provide web-powered\nexperiences as a core or supporting part within your app, as seen in **Figure\n1**.\n**Figure 1.** Web content embedded within the app with \\`WebView\\` objects as primary (left) and supporting content (right).\n\nWhat `WebView` can do\n\nYou can do the following with `WebView` in your app:\n\n- **Embed web** : A `WebView` is integrated into an app's user interface as a\n component, much like a button or text field.\n\n- **Load content** : `WebView` can load web content from various sources:\n\n - Remote URLs: It can fetch and display web pages from the internet, just like a regular browser.\n - Local files: It can load HTML, CSS, and JavaScript files stored within the app's resources.\n - Dynamically generated content: The app can generate HTML content dynamically and provide it to the `WebView`.\n- **Render** : `WebView` uses its browser engine to parse and render the HTML,\n CSS, and JavaScript, displaying the resulting web page within its designated\n area in the app's UI.\n\n- **Execute JavaScript** : `WebView` can execute JavaScript code within the\n context of the loaded web page. This allows for dynamic interactions and\n updates within the `WebView`.\n\n- **Interact with your app** : This is where `WebView` gets more powerful. It\n enables bidirectional communication between the web page and the app.\n\n - **JavaScript to app code** : JavaScript code running in a `WebView` can call\n host APIs of the app, enabling access to device features like camera, GPS,\n or sensors.\n\n - **App code to JavaScript** : The app can also inject JavaScript code into a\n `WebView`, manipulate the web page's content, or respond to events triggered\n by the web page.\n\nHow `WebView` differs from a browser\n\nA `WebView` is a highly custom component that provides the core functionality of\na window into the web. Unlike a browser, which provides a navigation bar and\nother user interface elements to navigate the web more broadly, the overall\nexperience of a `WebView` is shaped by your app's design and purpose.\n\nTo better understand how `WebView` differs from standard browsers, see the\nfollowing explanations:\n\n**UI** : A `WebView` is used for displaying web content and doesn't have its own\nheader or UI like most other common browsers, for example, a home button,\naddress bar, or settings menu.\n\n**Features**: Many browsers have built-in features to augment the\nbrowsing experience, such as bookmarks, permissions, or history.\n\n**Updates** : Because Android `WebView` is a system service on Android, updates\nare pushed and integrated into the apps automatically on a monthly basis.\nBrowsers rely on their corresponding app updates and then for end users to apply\nthe update on their devices.\n\nGet started\n\nFor information on how to use `WebView` in your app, see the document\n[Build web apps in `WebView`](/guide/webapps/webview).\n\nAdditional resources\n\nTo develop web pages for Android-powered devices using `WebView` objects or\nCustom Tabs, see the following documents:\n\n- [Build web apps in `WebView`](/guide/webapps/webview)\n- [Manage `WebView` objects](/guide/webapps/managing-webview)\n- [Support different screens in web apps](/guide/webapps/targeting)\n- [Debug web apps](/guide/webapps/debugging)\n- [Best practices for web apps](/guide/webapps/best-practices)\n- [Opt-in to `WebView` Beta](https://play.google.com/apps/testing/com.google.android.webview)\n- [In-app browsing using embedded web](/develop/ui/views/layout/webapps/in-app-browsing-embedded-web)\n- [Overview of Android Custom Tabs](/develop/ui/views/layout/webapps/overview-of-android-custom-tabs)"]]
