Prestashop集成Stripe模块报错：Stripe is not defined

问题详情 #

完成Stripe模块后台安装配置后，订单页面未显示Stripe支付表单，浏览器控制台抛出如下错误：

Uncaught ReferenceError: Stripe is not defined
at Module. (checkout.js:18:48061)

已确认模块文件stripe_official.php中已注册Stripe官方SDK，且页面源码能看到该引用：

$this->context->controller->registerJavascript(
    $this->name . '-stripe-v3',
    'https://js.stripe.com/v3/',
    [
        'server' => 'remote',
        'position' => 'head',
    ]
);
$this->context->controller->registerJavascript(
    $this->name . '-payments',
    'modules/' . $this->name . '/views/js/checkout.js'
);

if (Configuration::get(self::ENABLE_APPLEPAY_GOOGLEPAY)) {
    $this->context->controller->registerJavascript(
        $this->name . '-stripepaymentrequest',
        'modules/' . $this->name . '/views/js/payment_request.js'
    );
}

解决步骤 #

• 强制JS加载顺序：Prestashop默认按注册顺序加载JS，但如果没有明确依赖关系，checkout.js可能在Stripe SDK之前执行。修改checkout.js的注册代码，添加依赖声明确保Stripe先加载：

  $this->context->controller->registerJavascript(
      $this->name . '-payments',
      'modules/' . $this->name . '/views/js/checkout.js',
      [
          'depends' => [$this->name . '-stripe-v3']
      ]
  );
  

• 验证Stripe SDK是否成功加载：打开浏览器开发者工具的「网络」标签，刷新订单页，搜索js.stripe.com/v3/，确认请求返回200状态码。如果加载失败，检查服务器防火墙、CDN是否拦截了外部JS请求。
• 清空缓存并禁用JS合并：进入后台「高级参数->性能」，临时关闭「合并JavaScript」选项，清空页面缓存后刷新测试。问题解决后再重新开启合并功能。
• 排查主题模板覆盖：检查当前主题是否覆盖了订单页模板，导致Stripe模块的JS注册逻辑未被触发。查看themes/你的主题/templates/checkout/目录下的文件，确认没有重写支付模块的渲染逻辑。
• 排查第三方模块冲突：临时禁用其他支付模块或带有全局JS操作的第三方模块，逐个测试是否有模块干扰Stripe SDK的加载或修改了全局变量。

内容的提问来源于stack exchange，提问作者Malek Ben el ouafi