用户的网站突然出现莫名其妙的故障。
主要问题
Woocommerce 结账页面一直加载不动,无法继续结账了。
通常结账页面的’review order’ 通过 ajax 加载付款方式/总计 – 这会简要显示加载器。如果有问题,这里就会无法加载成功,也就如上的图片那样一直卡着。
排查过程
首先,检查WooCommerce > 系统状态,是否有错误——通常会突出显示错误。
如果没问题,我们继续检查
WordPress 设置导致的 AJAX 错误
设置 > 常规,中的 URL需要匹配——这是因为 AJAX 请求不能跨不同的域工作。
其他 JavaScript 错误和冲突
这里一般是主题和插件,任意切换一个系统主题,查看是否正常
排查插件是否冲突,逐个禁用插件来排除。
如果还是不正常,那么继续
AJAX 调用的无效响应
打开浏览器(谷歌浏览器)的开发者控制台上网络- Fetch/XHR 选项卡并查看?wc-ajax=update_order_review 响应。正常的响应将是 JSON。如果响应是 HTML,这通常是由 WordPress 安装根目录中的 index.html 文件引起的
这可以通过删除 index.html 文件或通过调整服务器配置上的索引将 index.php 优先于 index.html 来解决。
如下,响应为HTML是不正常的
正常应该响应如下为JSON
一些缓存插件也会在 JSON 响应之前添加 HTML。
最后排查到客户有在使用cloudflare, 通过禁用CDN后,正常了,所以我们要检查CDN的加速规则。
经过调整后,一切恢复正常了。