Notion API无法添加含查询字符串的外部URL图片问题咨询

问题重现 #

当尝试通过Notion API添加带查询字符串的外部图片（比如谷歌地图静态图片）时，API会返回400 validation_error，提示Invalid image url，示例请求和错误如下：

请求Payload：

{"children":
  [
    {
      "object": "block",
      "image": {
        "external": {
          "url":"https://maps.googleapis.com/maps/api/staticmap?size=600x600&markers=color:blue%7C28.39289666603847%2C-81.57078166947416&key=xxxxxxxxxxxxxxx"
         }
       }
     }
  ]
}

错误响应：

{
    "object": "error",
    "status": 400,
    "code": "validation_error",
    "message": "Content creation Failed. Fix the following: \nInvalid image url.",
    "request_id": "b39d16e4-b4fa-4e87-b342-ed3650b67046"
}

解决方法 #

方法1：上传本地图片替代外部URL

Notion API对内部上传的图片没有查询字符串限制，步骤如下：

• 先将目标图片（比如谷歌静态地图）下载到本地
• 使用Notion API的创建块接口，选择file类型而非external，将本地文件作为form-data上传

示例请求（简化版）：

curl -X POST https://api.notion.com/v1/blocks/{parent_block_id}/children \
  -H "Authorization: Bearer YOUR_NOTION_TOKEN" \
  -H "Notion-Version: 2022-06-28" \
  -F "file=@./staticmap.png" \
  -F "children=[{\"object\":\"block\",\"type\":\"image\",\"image\":{\"type\":\"file\",\"file\":{\"url\":\"https://api.notion.com/v1/files/uploaded_file_id\"}}}]"

方法2：使用中转服务隐藏查询参数

如果必须使用外部URL，可以搭建一个简单的中转服务（比如用Cloudflare Workers、Vercel Edge Functions等），让中转服务接收请求后，转发到带查询参数的图片URL并返回图片内容。这样Notion只需要访问中转服务的无参数URL，就可以获取到图片。

比如中转服务的逻辑（以Cloudflare Workers为例）：

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  // 替换成你的谷歌静态地图完整URL（包含key和查询参数）
  const imageUrl = "https://maps.googleapis.com/maps/api/staticmap?size=600x600&markers=color:blue%7C28.39289666603847%2C-81.57078166947416&key=xxxxxxxxxxxxxxx"
  const response = await fetch(imageUrl)
  return new Response(response.body, {
    headers: {
      'Content-Type': response.headers.get('Content-Type'),
      'Cache-Control': 'public, max-age=86400'
    }
  })
}

部署后，直接使用中转服务的URL作为Notion API的external image URL即可。

内容的提问来源于stack exchange，提问作者Steven Buehler