Files
assistant-storefront/TEST_WEBHOOK_SEARCH_IMAGE.md
Liang XJ 4bd11c0ecc
Some checks failed
Lock Threads / action (push) Has been cancelled
Publish Chatwoot EE docker images / build (linux/amd64, ubuntu-latest) (push) Has been cancelled
Publish Chatwoot EE docker images / build (linux/arm64, ubuntu-22.04-arm) (push) Has been cancelled
Publish Chatwoot EE docker images / merge (push) Has been cancelled
Publish Chatwoot CE docker images / build (linux/amd64, ubuntu-latest) (push) Has been cancelled
Publish Chatwoot CE docker images / build (linux/arm64, ubuntu-22.04-arm) (push) Has been cancelled
Publish Chatwoot CE docker images / merge (push) Has been cancelled
Run Chatwoot CE spec / lint-backend (push) Has been cancelled
Run Chatwoot CE spec / lint-frontend (push) Has been cancelled
Run Chatwoot CE spec / frontend-tests (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (0, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (1, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (10, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (11, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (12, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (13, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (14, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (15, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (2, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (3, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (4, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (5, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (6, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (7, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (8, 16) (push) Has been cancelled
Run Chatwoot CE spec / backend-tests (9, 16) (push) Has been cancelled
Run Linux nightly installer / nightly (push) Has been cancelled
Mark stale issues and pull requests / stale (push) Has been cancelled
feat: add search_image and product_list content types with image upload
## 新增功能

### 1. 新增消息类型
- 添加 search_image (17) 和 product_list (18) content_type
- 支持图片搜索和商品列表消息展示

### 2. 图片上传功能
- 添加 ImageUploadButton 组件,支持图片上传到 Mall API
- 上传后发送 search_image 类型消息,图片 URL 存储在 content_attributes
- 支持图片文件验证(类型、大小)

### 3. Webhook 推送优化
- 修改 webhook_listener.rb,允许 search_image 类型即使 content 为空也推送 webhook
- 解决 search_image 消息不触发 webhook 的问题

### 4. 前端组件
- 新增 SearchImage.vue 组件(widget 和 dashboard)
- 新增 ProductList.vue、Logistics.vue、OrderDetail.vue、OrderList.vue 组件
- 更新 Message.vue 路由逻辑支持新的 content_type
- 更新 UserMessage.vue 支持 search_image 消息显示

### 5. API 层修改
- widget/messages_controller.rb: 允许 content_attributes 参数
- widget/base_controller.rb: 使用前端传入的 content_attributes
- widget/conversation API: 支持 contentAttributes 参数传递
- conversation actions 和 helpers: 完整的 content_attributes 数据流

### 6. Widget 测试页面优化
- 重写 /widget_tests 页面,支持游客/用户模式切换
- 登录流程:使用 reset() + setUser(),不刷新页面
- 退出流程:使用 reset() + 刷新页面
- 添加详细的日志输出和状态显示

## 技术细节

### Message Model
```ruby
enum content_type: {
  # ...existing types...
  search_image: 17,
  product_list: 18
}
```

### Webhook Listener
```ruby
# Allow search_image webhook even if content is blank
return if message.content.blank? && message.content_type != 'search_image'
```

### Widget Upload Flow
```
用户选择图片
  → 上传到 Mall API
  → 获取图片 URL
  → 发送消息: { content: '', content_type: 'search_image', content_attributes: { url: '...' } }
```

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-01-27 19:03:46 +08:00

3.6 KiB

测试 search_image 消息发送到 Webhook

方法 1: 使用测试脚本(推荐)

cd /home/lxj/project/chatwoot-develop
./test_search_image_webhook.sh

方法 2: 直接执行 curl 命令

复制以下命令到终端执行:

curl -X POST "http://localhost:3000/api/v1/widget/messages?website_token=9n9D3JFHBorFTZLD7cQ49TMg&cw_conversation=eyJhbGciOiJIUzI1NiJ9.eyJzb3VyY2VfaWQiOiI2Njc1ZGY3Ni1jM2MxLTQwMjktODUyNi0zN2UzMjQyMDFhMzAiLCJpbmJveF9pZCI6MSwiZXhwIjoxNzg1MDU3ODU5LCJpYXQiOjE3Njk1MDU4NTl9.SW4n7hnVjleWaVjKesdA60IZ5YAkAFn-3cUzH2f9F_M&locale=zh_CN" \
  -H "Content-Type: application/json" \
  -H "X-Auth-Token: eyJhbGciOiJIUzI1NiJ9.eyJzb3VyY2VfaWQiOiI2Njc1ZGY3Ni1jM2MxLTQwMjktODUyNi0zN2UzMjQyMDFhMzAiLCJpbmJveF9pZCI6MSwiZXhwIjoxNzg1MDU3ODU5LCJpYXQiOjE3Njk1MDU4NTl9.SW4n7hnVjleWaVjKesdA60IZ5YAkAFn-3cUzH2f9F_M" \
  -d '{
    "message": {
      "content": "",
      "content_type": "search_image",
      "content_attributes": {
        "url": "https://img.gaia888.com/image/www/test.jpg"
      },
      "timestamp": "Tue Jan 27 2026 17:41:08 GMT+0800 (中国标准时间)",
      "referer_url": "http://localhost:3000/widget_tests"
    }
  }'

方法 3: 使用你提供的完整 curl 命令

curl "http://localhost:3000/api/v1/widget/messages?website_token=9n9D3JFHBorFTZLD7cQ49TMg&cw_conversation=eyJhbGciOiJIUzI1NiJ9.eyJzb3VyY2VfaWQiOiI2Njc1ZGY3Ni1jM2MxLTQwMjktODUyNi0zN2UzMjQyMDFhMzAiLCJpbmJveF9pZCI6MSwiZXhwIjoxNzg1MDU3ODU5LCJpYXQiOjE3Njk1MDU4NTl9.SW4n7hnVjleWaVjKesdA60IZ5YAkAFn-3cUzH2f9F_M&locale=zh_CN" \
  -H "Accept: application/json, text/plain, */*" \
  -H "Content-Type: application/json" \
  -H "X-Auth-Token: eyJhbGciOiJIUzI1NiJ9.eyJzb3VyY2VfaWQiOiI2Njc1ZGY3Ni1jM2MxLTQwMjktODUyNi0zN2UzMjQyMDFhMzAiLCJpbmJveF9pZCI6MSwiZXhwIjoxNzg1MDU3ODU5LCJpYXQiOjE3Njk1MDU4NTl9.SW4n7hnVjleWaVjKesdA60IZ5YAkAFn-3cUzH2f9F_M" \
  --data-raw '{"message":{"content":"","reply_to":null,"timestamp":"Tue Jan 27 2026 17:41:08 GMT+0800 (中国标准时间)","referer_url":"http://localhost:3000/widget_tests","content_type":"search_image","content_attributes":{"url":"https://img.gaia888.com/image/www/auto_202601/test.jpg"}}}'

预期响应

成功时会返回类似:

{
  "id": 428,
  "content": "",
  "content_type": "search_image",
  "inbox_id": 1,
  "conversation_id": 16,
  "message_type": 0,
  "created_at": 1769504268,
  "private": false,
  "content_attributes": {
    "url": "https://img.gaia888.com/image/www/test.jpg"
  },
  "sender": {
    "id": 24,
    "name": "测试用户 211845",
    "email": "211845@example.com",
    "thumbnail": "",
    "type": "contact"
  }
}

验证步骤

  1. 检查 Dashboard:

  2. 检查 Webhook 日志:

    • 查看你的 webhook 接收服务日志
    • 应该看到 content_type: "search_image"
  3. 检查 Widget:

    • 刷新 /widget_tests 页面
    • 应该看到图片显示在聊天界面

错误排查

401 Unauthorized

原因: cw_conversation token 过期或无效 解决: 从 /widget_tests 页面重新获取 cookie 中的 cw_conversation 值

404 Not Found

原因: website_token 不正确 解决: 确认 website_token 与配置一致

422 Unprocessable Entity

原因: 请求参数格式错误 解决: 检查 JSON 格式和必需字段

参数说明

参数 说明
content_type "search_image" 消息类型
content "" 空字符串
content_attributes.url 图片 URL 图片地址
cw_conversation JWT token 会话标识
website_token Widget token 网站标识