Nuxt集成Razorpay生成order_id时遇No key passed错误

你这里犯了一个Razorpay集成的常见误区——绝对不要在前端代码里使用key_secret，也不要尝试通过前端SDK创建订单。这两个操作都属于后端范畴，也是触发"No key passed"错误的核心原因：一方面key_secret是敏感密钥，暴露在前端会直接导致账户安全风险；另一方面Razorpay的前端SDK根本不支持调用orders.create方法，这个接口只能由后端通过官方后端SDK调用。

正确的集成流程 #

1. 后端创建订单API：在Nuxt的服务端（比如server/api目录下）编写接口，使用Razorpay后端SDK生成订单，将order_id返回给前端。
2. 前端发起支付：前端先请求后端接口拿到order_id，再用Razorpay前端SDK初始化支付实例，传入order_id发起支付。

具体代码示例 #

1. 后端订单接口（Nuxt Server API）

首先安装Razorpay后端包：

npm install razorpay

创建server/api/razorpay/create-order.ts文件：

import Razorpay from 'razorpay'

export default defineEventHandler(async (event) => {
  // 初始化后端Razorpay实例，这里才需要传入key_id和key_secret
  const razorpay = new Razorpay({
    key_id: '你的生产模式key_id',
    key_secret: '你的生产模式key_secret'
  })

  const orderOptions = {
    amount: 1000, // 注意：单位是最小货币单位，这里代表10卢比
    currency: "INR",
    receipt: "order_rcptid_11"
  }

  try {
    const order = await razorpay.orders.create(orderOptions)
    return { success: true, orderId: order.id }
  } catch (err) {
    console.error('创建订单失败:', err)
    return { success: false, message: '订单创建失败，请稍后重试' }
  }
})

2. 前端支付方法修改

将你原来的pay方法改为先请求后端获取order_id，再发起支付：

async pay() {
  try {
    // 第一步：调用后端接口获取合法的order_id
    const response = await this.$axios.$post('/api/razorpay/create-order')
    
    if (!response.success) {
      alert(response.message)
      return
    }

    // 第二步：初始化前端Razorpay实例，只需要传入key_id即可
    const razorpayInstance = new Razorpay({
      key_id: '你的生产模式key_id'
    })

    // 第三步：配置支付参数，必须包含后端返回的order_id
    const paymentConfig = {
      amount: 1000,
      currency: "INR",
      receipt: "order_rcptid_11",
      order_id: response.orderId, // 核心字段：后端生成的order_id
      handler: function(paymentResponse) {
        // 支付成功后的前端回调，建议这里再调用后端接口验证支付真实性
        console.log('支付成功:', paymentResponse)
        alert('支付完成')
      }
    }

    // 打开支付弹窗
    razorpayInstance.open(paymentConfig)
  } catch (err) {
    console.error('支付流程出错:', err)
    alert('支付失败，请稍后重试')
  }
}

关键注意事项 #

• 密钥安全：key_secret只能放在后端，绝对不能出现在前端代码或打包后的文件中，否则会导致账户被盗用。
• 生产模式强制要求：Razorpay生产环境必须使用后端生成的order_id发起支付，这是平台为了支付安全和对账合规设置的强制规则。
• 支付验证：前端的handler回调仅作为前端通知，必须在后端调用Razorpay的支付验证API，确认支付真实有效后，再完成后续业务逻辑（比如发货、更新订单状态）。

内容的提问来源于stack exchange，提问作者Shubhang Chourasia