使用常量设置Stripe关联账户ID时遇CORS错误及API密钥问题

核心原因 #

你的隐藏输入框输出的账户ID带了多余的单引号，导致JavaScript获取到的是'acct_XXX'而非正确的acct_XXX。Stripe无法识别这种带引号的无效账户ID，进而触发异常请求，出现CORS和API key相关错误（后者是Stripe处理无效请求时返回的误导性提示）。同时你的JavaScript代码存在语法错误，会进一步导致初始化失败。

修复步骤 #

1. 修正隐藏输入框的value输出
   原代码里的单引号完全多余，修改为：

   <input id="stripe_account_id" type="hidden" value="<%= @user.stripe_account_id %>"> 
   

   这样输出的value就是纯净的账户ID字符串，不带额外引号。

2. 修复JavaScript语法错误
   原代码中Stripe('pk_test_XXX...'), {多了一个逗号，正确的初始化代码应该是：

   const stripe_account_id = document.getElementById('stripe_account_id').value;
   
   const stripe = Stripe('pk_test_XXX...', {
     apiVersion: "2022-11-15",
     stripeAccount: stripe_account_id,
   });
   

3. 验证账户ID的有效性
   可以在JavaScript里加一行日志，确认获取到的账户ID格式正确：

   console.log('Stripe Account ID:', stripe_account_id); // 正常输出应为不带引号的acct_XXX
   

为什么手动输入正常？ #

手动输入的是正确格式的acct_XXX，Stripe能正常识别并处理关联账户的请求；而通过输入框获取的是带引号的无效值，Stripe无法正确解析，导致请求流程异常，最终抛出CORS和API key错误。

内容的提问来源于stack exchange，提问作者Luke Littler