webview 异步js

WebView 中的异步 JavaScript 主要涉及到在 WebView 环境下执行 JavaScript 代码时，不会阻塞页面的加载和渲染，从而提升用户体验。

基础概念： 异步 JavaScript 是指在执行 JavaScript 代码时，不会等待其完成就继续执行后续的操作。常见的实现方式有回调函数、Promise、async/await 等。

优势：

1. 提高页面加载速度：不会因为 JavaScript 的长时间执行而导致页面加载卡顿。
2. 更好的用户体验：用户可以更快地与页面进行交互。

类型：

1. 基于回调函数的异步操作。
2. Promise 基于的异步操作。
3. 使用 async/await 语法的异步操作。

应用场景：

1. 从服务器获取数据并在页面上展示。
2. 执行复杂的计算任务而不影响页面响应。

如果在 WebView 中遇到异步 JavaScript 相关的问题，比如代码不执行或者执行顺序错误：

• 可能原因是 JavaScript 代码本身存在错误，比如语法错误、逻辑错误。
• 异步操作的回调函数或 Promise 没有被正确处理。

解决方法：

1. 仔细检查 JavaScript 代码，通过调试工具查看是否有错误提示。
2. 确保异步操作的结果被正确处理和使用。

例如，在 WebView 中使用 Promise 进行异步数据获取并展示：

function fetchData() {
    return new Promise((resolve, reject) => {
        // 模拟网络请求
        setTimeout(() => {
            resolve('数据获取成功');
        }, 2000);
    });
}

fetchData().then(data => {
    console.log(data);
    // 在 WebView 中更新页面内容
    document.getElementById('result').innerHTML = data;
}).catch(error => {
    console.error('数据获取失败', error);
});

在 Android 的 WebView 中启用 JavaScript ：

WebView webView = findViewById(R.id.webview);
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);

在 iOS 的 WKWebView 中启用 JavaScript ：

let webView = WKWebView()
webView.configuration.preferences.javaScriptEnabled = true