安卓 WebView 拦截并查看网页接口响应数据的完整教程

在安卓 WebView 中查看网页接口返回的数据，核心是通过 拦截 WebView 网络请求 或 注入 JavaScript 代码 两种方式实现，具体方法根据需求（是否需要实时查看、是否需解析数据）选择。

方法一：通过 WebViewClient 拦截网络请求（推荐，适合原生层查看）

利用 WebViewClient 的 shouldInterceptRequest 方法，拦截 WebView 发起的所有网络请求（包括接口请求），直接获取请求的响应数据。

实现步骤：

1. 配置 WebView 基础设置确保 WebView 启用 JavaScript（若网页依赖 JS 发起接口请求），并设置自定义 WebViewClient。

   java

   运行

   WebView webView = findViewById(R.id.webView);
   WebSettings webSettings = webView.getSettings();
   webSettings.setJavaScriptEnabled(true); // 启用JS，关键！
   
   // 设置自定义 WebViewClient 拦截请求
   webView.setWebViewClient(new WebViewClient() {
       // 拦截所有网络请求（API 21+ 推荐用此重载方法）
       @Override
       public WebResourceResponse shouldInterceptRequest(WebView view, WebResourceRequest request) {
           // 1. 过滤接口请求（只关注需要查看的接口，如含 "/api/" 的 URL）
           String url = request.getUrl().toString();
           if (url.contains("/api/")) { // 替换为你的目标接口特征
               try {
                   // 2. 手动发起网络请求，获取响应数据
                   HttpURLConnection connection = (HttpURLConnection) new URL(url).openConnection();
                   // 复制原请求的方法（GET/POST）、头信息
                   connection.setRequestMethod(request.getMethod());
                   for (Map.Entry<String, String> header : request.getRequestHeaders().entrySet()) {
                       connection.setRequestProperty(header.getKey(), header.getValue());
                   }
                   
                   // 3. 读取响应数据（转为字符串，方便查看）
                   int responseCode = connection.getResponseCode();
                   InputStream inputStream = connection.getInputStream();
                   String responseData = new String(inputStream.readAllBytes(), StandardCharsets.UTF_8);
                   
                   // 4. 打印接口数据（Logcat 中查看）
                   Log.d("WebViewApiLog", "接口 URL: " + url);
                   Log.d("WebViewApiLog", "响应码: " + responseCode);
                   Log.d("WebViewApiLog", "响应数据: " + responseData);
                   
                   // 5. 返回原响应给 WebView，不影响网页正常加载
                   return new WebResourceResponse(
                           connection.getContentType(), // MIME 类型
                           connection.getContentEncoding(), // 编码
                           inputStream
                   );
               } catch (Exception e) {
                   e.printStackTrace();
               }
           }
           // 非目标接口，交给 WebView 正常处理
           return super.shouldInterceptRequest(view, request);
       }
   });
   
   // 加载目标网页
   webView.loadUrl("https://你的目标网页地址");
   

2. 查看数据打开 Android Studio 的 Logcat，筛选标签 WebViewApiLog，即可看到接口的 URL、响应码和返回数据（如 JSON 字符串）。

方法二：注入 JavaScript 代码（适合网页层查看，需网页支持）

通过 webView.evaluateJavascript() 注入 JS 代码，重写网页的 XMLHttpRequest 或 fetch 方法，捕获接口请求和响应，再将数据传递给原生层。

实现步骤：

1. 注入 JS 拦截脚本在 WebView 加载网页完成后（onPageFinished 中），注入拦截代码：

   java

   运行

   webView.setWebViewClient(new WebViewClient() {
       @Override
       public void onPageFinished(WebView view, String url) {
           super.onPageFinished(view, url);
           
           // 1. 注入 JS 代码：重写 fetch 方法（若网页用 XMLHttpRequest，同理重写）
           String jsCode = "(" +
                   "function() {" +
                   "  // 保存原生 fetch" +
                   "  const originalFetch = window.fetch;" +
                   "  // 重写 fetch" +
                   "  window.fetch = function(url, options) {" +
                   "    console.log('JS 拦截接口 URL:', url);" +
                   "    console.log('JS 拦截请求参数:', options);" +
                   "    // 发起请求并获取响应" +
                   "    return originalFetch(url, options).then(response => {" +
                   "      // 复制响应（避免影响原网页）" +
                   "      const responseClone = response.clone();" +
                   "      // 读取响应数据（JSON 格式为例）" +
                   "      responseClone.json().then(data => {" +
                   "        console.log('JS 拦截响应数据:', data);" +
                   "        // （可选）将数据传递给原生层（通过 WebViewJavascriptBridge）" +
                   "        if (window.Android) {" +
                   "          window.Android.onApiResponse(url, JSON.stringify(data));" +
                   "        }" +
                   "      });" +
                   "      return response;" +
                   "    });" +
                   "  }" +
                   "})();";
           
           // 2. 执行 JS 代码
           webView.evaluateJavascript(jsCode, null);
       }
   });
   

2. 查看数据（两种方式）

   • 方式 1：通过 Chrome 开发者工具连接手机 / 模拟器，打开 Chrome 浏览器，输入 chrome://inspect，找到对应的 WebView 实例，在 Console 面板中查看 JS 打印的接口数据。
   • 方式 2：传递到原生层 Logcat定义原生回调接口，接收 JS 传递的数据：

     java

     运行

     // 1. 定义接口（需添加 @JavascriptInterface 注解）
     public class JsBridge {
         @JavascriptInterface
         public void onApiResponse(String url, String responseData) {
             Log.d("WebViewJsApiLog", "接口 URL: " + url);
             Log.d("WebViewJsApiLog", "响应数据: " + responseData);
         }
     }
     
     // 2. 将接口实例注入 WebView
     webView.addJavascriptInterface(new JsBridge(), "Android");
     

     之后在 Logcat 筛选 WebViewJsApiLog 即可查看数据。

两种方法对比

对比维度	方法一：WebViewClient 拦截	方法二：注入 JS 代码
适用场景	所有网络请求（含 JS 发起）	仅 JS 发起的请求（fetch/XMLHttpRequest）
数据完整性	能获取完整响应（含二进制）	需手动处理数据格式（如 JSON/Text）
对网页影响	无影响（透明拦截）	需确保 JS 代码不冲突
配置复杂度	中（需处理网络请求细节）	低（适合前端熟悉者）

注意事项

1. 权限配置确保 AndroidManifest.xml 中添加网络权限：

   xml

   <uses-permission android:name="android.permission.INTERNET" />
   

2. HTTPS 证书问题若网页用 HTTPS 且证书不被信任，需在 WebViewClient 中处理 onReceivedSslError（仅测试环境使用，正式环境需验证证书）。
3. Android 版本兼容
   • shouldInterceptRequest(WebResourceRequest) 需 Android 5.0（API 21）及以上；
   • evaluateJavascript 需 Android 4.4（API 19）及以上。