微信小程序添加京东商品购买链接

Question

本人基础不好，是个前提。
现在想从微信小程序点击购买按钮跳转京东小程序或App
URL（字段名：link）是从api返回的，存在云开发的数据库books集合里面，应该是含有导购信息。
AI给的答案全都不能实现，点击链接没有反应。
以下是示例。

```javascript
openPurchaseLink: function() {
    console.log('--- 开始跳转京东 ---');
    debugger; // 添加调试断点
    console.log('--- 按钮点击触发 ---'); // 强制日志
    if (!this.data.book) {
      console.error('当前数据:', this.data); // 打印完整数据
    }
  
    // 1. 检查图书数据
    if (!this.data.book || !this.data.book.link) {
      console.error('错误：图书数据或link字段不存在');
      wx.showToast({
        title: '商品链接不存在',
        icon: 'none'
      });
      return;
    }
  
    const jdUrl = this.data.book.link.trim();
    console.log('原始链接:', jdUrl);
  
    // 提取商品ID（支持多种京东URL格式）
    const jdSkuId = this.extractJdItemId(jdUrl);
    if (!jdSkuId) {
      console.error('无法提取商品ID');
      wx.showToast({
        title: '无法提取商品ID，将打开网页版',
        icon: 'none'
      });
      wx.navigateTo({
        url: `/pages/webview/webview?url=${encodeURIComponent(jdUrl)}`
      });
      return;
    }
  
    console.log('提取的商品ID:', jdSkuId);
  
    setTimeout(() => { // 避免loading一闪而过
      wx.navigateToMiniProgram({
        appId: 'wx91d27dbf599dff74', // 京东小程序的appId
        path: `/pages/item/item?itemId=${jdSkuId}`, // 商品详情页路径
        envVersion: "release",
        success: () => {
          console.log('跳转京东成功');
        },
        fail: (err) => {
          console.error('跳转失败:', err);
          wx.showToast({
            title: '跳转失败，将打开网页版',
            icon: 'none'
          });
          wx.navigateTo({
            url: `/pages/webview/webview?url=${encodeURIComponent(jdUrl)}`
          });
        },
        complete: () => {
          wx.hideLoading();
        }
      });
    }, 500);
  },

  extractJdItemId: function(url) {
    const patterns = [
      /(?:jd\.com|jd\.com\.hk)\/(\d+)\.html/,
      /product\/(\d+)\.html/
    ];
  
    for (const pattern of patterns) {
      const match = url.match(pattern);
      if (match && match[1]) return match[1];
    }
    return null;
  },

```

Answer 1

阿里嘎多学长整理AIGC生成，因移动端显示问题导致当前答案未能完全显示，请使用PC端查看更加详细的解答过程

解决方案

你想在微信小程序中添加京东商品购买链接，点击购买按钮跳转到京东小程序或AppURL。根据你的描述，你从云开发的数据库books集合中获取了导购信息，并且link字段名为link。

可以使用微信小程序的wx.navigateTo方法来实现跳转。首先，你需要在小程序的app.json文件中配置navigateTo的权限：

{
  "window": {
    "navigationBarTitleText": "我的小程序",
    "navigationBarTextStyle": "black",
    "navigationBarBackgroundColor": "#fff",
    "backgroundTextStyle": "light",
    "enablePullDownRefresh": true
  },
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "pagePath": "pages/book/book",
        "text": "书籍"
      }
    ]
  },
  "permission": {
    "scope.record": "使用录音功能需要录音权限"
  }
}

然后，在你的小程序中，使用wx.cloud.callFunction方法来获取link的值：

wx.cloud.callFunction({
  name: 'getLink',
  data: {
    bookId: 'your_book_id'
  }
}).then(res => {
  const link = res.result.link;
  wx.navigateTo({
    url: link
  });
}).catch(err => {
  console.error(err);
});

在上面的代码中，我们使用wx.cloud.callFunction方法来调用云函数getLink，传入bookId参数，然后获取返回的link值，并使用wx.navigateTo方法来跳转到link对应的页面。

需要注意的是，你需要在云函数getLink中实现获取link的逻辑，例如：

exports.getLink = async (event, context) => {
  const bookId = event.bookId;
  const db = wx.cloud.database();
  const books = db.collection('books');
  const res = await books.doc(bookId).get();
  const link = res.data.link;
  return { link };
};

在上面的代码中，我们使用wx.cloud.database方法来获取数据库的books集合，然后使用doc方法来获取指定的book文档，最后返回link值。