集成示例
本页展示如何在您的网站中实际集成 RAKUFUN SDK 的示例。
🎯 在线演示
下面是一个完整的电商商品页集成示例，包含 IP 识别与体验优化。您可以直接在下方进行实际交互体验：
📱 Live Demo - Click button to experience purchase flow
The following example shows the complete integration effect of RAKUFUN SDK
🎧 Authentic Japanese Products · International Shipping
RAKUFUN provides safe and reliable Japanese product purchasing services
Sony WH-1000XM5 Wireless Noise Canceling Headphones
54,800円62,800円
🌟 Product Features
- Industry-leading active noise cancellation technology
- 30-hour ultra-long battery life
- Quick Attention mode for instant environmental awareness
- Multipoint connection, connect two devices simultaneously
- Authentic Japanese import with manufacturer warranty
🌟 功能亮点
- 🌍 智能地区检测 - 自动识别用户 IP，区分日本与海外用户体验
- 🛡️ 完善错误处理 - 全面错误捕获与提示机制
- 🔗 一键购买 - 一键跳转到 RAKUFUN 购买页
📋 代码示例
您可以将以下代码复制到您的站点中：
html
<!DOCTYPE html>
<html lang="en">
<body>
<button id="buy-button" class="buy-button" onclick="handlePurchase()">
<span id="button-text">🛒 Buy Now with RAKUFUN</span>
</button>
<script src="https://sdk.rakufun.com/rakufun-universal.min.js"></script>
<script>
// 商品数据
const productData = {
url: window.location.href,
title: "Sony WH-1000XM5 Wireless Headphones",
price: "54800",
description: "Industry-leading noise cancellation technology, 30-hour battery life.",
images: ["https://images.unsplash.com/photo-1583394838336-acd977736f90?w=800"],
condition: "New",
brand: "Sony",
minQuantity: "1",
maxStock: "50",
shippingInfo: "0",
deliveryTime: "2-4 days",
precautions: "1-year manufacturer warranty included.",
productParameters: "Weight: 250g, Battery Life: 30 hours",
timestamp: new Date().toISOString()
};
// 处理购买
async function handlePurchase() {
const button = document.getElementById('buy-button');
const buttonText = document.getElementById('button-text');
try {
button.disabled = true;
buttonText.textContent = 'Processing...';
// 调用 RAKUFUN SDK
await rakufun.quickBuy(productData);
buttonText.textContent = '正在跳转到 RAKUFUN...';
} catch (error) {
console.error('购买失败:', error);
alert('购买失败，请重试');
button.disabled = false;
buttonText.textContent = '🛒 使用 RAKUFUN 购买';
}
}
</script>
</body>
</html>🌍 进阶：地区检测
如果您需要根据地理位置提供差异化体验：
javascript
// 检测用户地区
const regionResult = await rakufun.detectUserRegion();
console.log('User region:', regionResult);
// 判断用户是否来自日本
if (rakufun.isJapanUser()) {
// 可执行自定义业务逻辑
console.log('检测到日本用户');
// 例如：显示特定提示、调整业务流程等
}
// API 调用对所有用户都正常工作
await rakufun.quickBuy(productData);核心能力
1. RAKUFUN SDK 集成
- 使用官方 SDK：
https://sdk.rakufun.com/rakufun-universal.min.js - 自动地区检测：
rakufun.detectUserRegion() - 用户地区判断：
rakufun.isJapanUser() - 一键购买：
rakufun.quickBuy(productData)
2. 错误处理
- 完整错误处理机制
- 友好的错误提示
- 按钮状态自动恢复
3. 商品数据结构
- 采用完整 13 字段数据结构
- 支持全部必要商品信息
- 无缝集成现有站点
下一步
了解更多集成方式：