安卓使用支付宝扫码进入支付页面后一直加载怎么办？

2026-10-24支付老李

结论

二维码通常没有问题。iOS 可以正常支付，而 Android 一直加载，说明二维码指向的页面能够访问，但 Android 支付宝 WebView 没有走完加载支付页、创建订单、跳转收银台这条链路。

先排查以下问题：

Android 请求是否被服务端、网关或 CDN 拦截。
支付接口是否返回错误页面、空内容或未完成的重定向。
页面是否过早调用 AlipayJSBridge。
支付流程是否依赖 alipays:// 跳转、弹窗、新窗口或用户代理判断。
HTTPS 证书、TLS、混合内容和重定向域名是否兼容 Android。
页面脚本是否在 Android 支付宝 WebView 中报错。

不要只检查前端的加载动画。很多页面”一直加载”，其实是支付接口已经失败，而异常处理没有关闭 loading。

先确认流程停在哪一步

可以把支付流程划分为以下状态，并逐步记录日志：

二维码页面打开。
页面向业务服务端请求创建订单。
服务端调用支付宝接口。
页面收到支付参数或支付表单。
页面调起支付宝收银台。
服务端收到异步通知并更新订单状态。

日志至少应包含：

业务订单号。
请求时间和耗时。
Android 支付宝的 User-Agent。
创建订单接口的 HTTP 状态码。
接口返回的业务错误码，但不要记录私钥、签名原文等敏感数据。
页面跳转前后的完整域名和路径。
AlipayJSBridge 是否已就绪。
JavaScript 异常和 Promise rejection。

无论支付发起成功还是失败，前端都要结束加载状态：

async function startPayment() {
  setLoading(true);

  try {
    const response = await fetch('/api/payment/create', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      credentials: 'include',
      body: JSON.stringify({
        orderId: 'ORDER_ID'
      })
    });

    if (!response.ok) {
      throw new Error(`Create payment failed: HTTP ${response.status}`);
    }

    const result = await response.json();

    if (!result.success) {
      throw new Error(result.message || 'Create payment failed');
    }

    await invokePayment(result);
  } catch (error) {
    console.error('Payment error:', error);
    showError('支付未能发起，请稍后重试');
  } finally {
    setLoading(false);
  }
}

如果代码只在成功回调中关闭 loading，网络错误、脚本异常或接口超时都会让页面永久停在加载状态。

检查 Android 请求是否到达服务端

使用 Android 支付宝扫码时，同时查看服务端访问日志和支付接口日志。

如果二维码页面请求已经到达，但服务端没有收到创建订单请求，问题通常出在页面脚本、缓存、跨域或 Cookie。创建订单请求到达服务端后，再检查：

接口是否返回 200。
返回内容是否符合前端预期。
是否出现 302 循环跳转。
是否因 User-Agent、设备类型或风控规则返回不同内容。
登录状态是否依赖第三方 Cookie。
Android 请求是否被 WAF、CDN 或反爬策略拦截。
接口是否超时，而前端没有处理超时。

状态码为 200 不一定代表请求成功。有些网关会返回状态码为 200 的 HTML 错误页，前端执行 response.json() 时仍会抛出异常。

等待 AlipayJSBridge 初始化

如果页面通过支付宝内置浏览器的 JSBridge 调起支付，必须等桥接对象初始化完成。页面一加载就直接调用，可能因平台和启动速度不同而出现竞态问题。

可以封装一个等待方法：

function readyAlipayBridge(callback) {
  if (window.AlipayJSBridge) {
    callback();
    return;
  }

  document.addEventListener(
    'AlipayJSBridgeReady',
    callback,
    false
  );
}

调用示例：

readyAlipayBridge(function () {
  AlipayJSBridge.call(
    'tradePay',
    {
      tradeNO: 'SERVER_RETURNED_TRADE_NO'
    },
    function (result) {
      console.log('tradePay result:', result);

      if (result.resultCode === '9000') {
        window.location.replace('/payment/result');
      } else {
        showError(`支付未完成：${result.resultCode || 'unknown'}`);
      }
    }
  );
});

tradeNO 必须来自服务端合法创建的交易。具体可用字段和接入方式取决于实际使用的支付宝产品，不能把其他支付产品返回的参数直接传给 tradePay。

由服务端生成支付请求

支付签名、应用私钥和创建交易的逻辑必须放在服务端。前端只负责提交订单和完成跳转，不能在浏览器中保存私钥或自行签名。

如果接入支付宝手机网站支付，服务端通常会通过官方 SDK 生成支付表单，页面收到表单后再提交：

<div id="payment-form"></div>

<script>
  function submitAlipayForm(formHtml) {
    const container = document.getElementById('payment-form');
    container.innerHTML = formHtml;

    const form = container.querySelector('form');
    if (!form) {
      throw new Error('Alipay form not found');
    }

    form.submit();
  }
</script>

创建支付请求的服务端接口最好直接返回支付宝生成的完整表单响应，避免前端拆解并重新拼接参数。重新编码 return_url、通知地址或签名字段，很容易导致验签失败。

支付表单应当是受信任的服务端输出。不要把用户可控的 HTML 直接写入 innerHTML。

排查跳转和重定向

Android 支付宝 WebView 一直加载，常与跳转方式有关。需要重点检查：

是否使用 window.open() 打开支付页。
是否把提交支付放在 setTimeout() 或异步回调之后，导致跳转失去用户手势上下文。
是否使用隐藏 iframe 加载收银台。
是否自行拼接 alipays:// Scheme。
是否连续执行多次 location.href。
是否在中间页根据 User-Agent 进入循环重定向。
return_url 是否重新跳回支付入口，造成重复下单。

移动端支付尽量在当前窗口跳转：

window.location.assign(paymentUrl);

也可以提交当前页面中的表单，不要依赖弹窗：

const form = document.querySelector('#alipay-form');
form.target = '_self';
form.submit();

如果必须识别设备，不能只检查字符串中是否包含 Android。支付宝版本、系统 WebView 和厂商定制都可能改变 User-Agent。支付逻辑应根据能力检测结果和接口的实际响应执行。

检查 HTTPS 和页面资源

iOS 能正常打开，不代表 Android 一定能正确建立连接。需要检查支付入口及所有重定向地址：

HTTPS 证书是否过期。
证书链是否完整。
域名是否与证书匹配。
TLS 配置是否支持目标 Android 环境。
HTTPS 页面是否加载了 HTTP 接口、脚本或图片。
中间跳转域名是否配置了有效证书。
是否跳转到内网地址、临时域名或只能在部分网络访问的地址。

例如，HTTPS 页面请求 HTTP 接口属于混合内容：

// 不建议：HTTPS 页面访问 HTTP 接口
fetch('http://api.example.com/payment/create');

接口也应使用 HTTPS：

fetch('https://api.example.com/payment/create');

还要检查 DNS、IPv6、CDN 回源和不同运营商的网络。可以让同一台 Android 设备分别连接 Wi-Fi 和移动网络测试。如果结果不同，应先检查网络链路，再考虑修改支付代码。

检查前端兼容性和缓存

支付宝 Android 客户端使用的 WebView 内核与 iOS 不同，以下问题可能只在 Android 上出现：

使用了未经转译的新语法。
某个依赖在特定 WebView 中不可用。
Promise 异常没有被捕获。
页面初始化脚本报错，导致后续支付代码没有执行。
旧版静态资源被强缓存。
Service Worker 返回过期页面。
支付按钮重复绑定并创建多笔订单。

可以增加全局异常记录：

window.addEventListener('error', function (event) {
  reportClientError({
    type: 'error',
    message: event.message,
    source: event.filename,
    line: event.lineno,
    column: event.colno
  });
});

window.addEventListener('unhandledrejection', function (event) {
  reportClientError({
    type: 'unhandledrejection',
    message: String(event.reason)
  });
});

上报内容需要脱敏，不能包含支付签名、Cookie、访问令牌或用户完整身份信息。

如果怀疑缓存，可以给静态资源增加构建版本：

<script src="/assets/payment.js?v=20260909"></script>

正式项目更适合使用包含内容哈希的文件名，例如 payment.a81f3c2.js。

建议的排查顺序

按照以下顺序处理，通常可以较快找到问题：

查看 Android 页面请求和创建订单请求是否到达服务端。
确认异常、超时和取消时都能结束 loading。
检查浏览器控制台或客户端错误上报。
核对支付宝接口返回的错误码和响应内容。
等待 AlipayJSBridgeReady 后再调用桥接 API。
移除 iframe、window.open() 和手写 Scheme，改用当前窗口跳转或表单提交。
检查所有 HTTPS 证书、跨域请求和重定向地址。
清理 Android 支付宝缓存，并在不同系统、支付宝版本和网络环境下复测。
使用全新的订单号测试，排除重复订单状态的干扰。

如果页面请求、创建订单和支付参数都正常，但 tradePay 或收银台仍无法调起，需要整理业务订单号、支付宝交易号、请求时间、客户端版本和服务端接口响应，再通过对应的支付宝开放平台接入渠道核查。只提供一张”Android 一直转圈”的截图，很难确定故障发生在哪个环节。