使用Flickr API遇JSON解析错误：Unexpected token j at position 0 求助

这个问题我之前碰到过好多次，大概率是Flickr API默认返回JSONP格式而非纯JSON导致的，咱们一步步来排查解决：

错误原因解析 #

你看到的SyntaxError: Unexpected token j in JSON at position 0，说明你尝试解析的响应内容开头不是JSON标准的{或[，而是字母j——十有八九是Flickr默认返回的JSONP回调函数名jsonFlickrApi(的首字母。比如Network面板里的响应内容应该是类似这样的：

jsonFlickrApi({"photos": {"page":1, "pages":10, ...}})

这种带回调包裹的内容不是纯JSON，直接用JSON.parse()自然会报错。

具体解决方法 #

方法1：请求纯JSON格式（推荐） #

在你的Flickr API请求URL里添加两个参数，强制返回纯JSON：

• format=json：指定响应格式为JSON
• nojsoncallback=1：告诉Flickr不要用回调函数包裹JSON内容

示例请求URL：

https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=YOUR_API_KEY&format=json&nojsoncallback=1

添加这两个参数后，返回的内容就是标准的JSON结构，直接用JSON.parse()就能正常解析了。

方法2：如果需要用JSONP（比如旧环境跨域） #

如果你的场景必须用JSONP（比如传统项目没有CORS支持），那不要直接解析响应文本：

• 如果你用jQuery，可以直接用$.getJSON()方法，它会自动处理JSONP的回调：

  $.getJSON('https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key=YOUR_API_KEY&format=json&jsoncallback=?', function(data) {
    // 这里直接拿到解析好的JSON数据
    console.log(data);
  });
  

• 如果用原生JS，需要手动截取回调包裹的部分，再解析：

  // 假设response是你拿到的响应文本
  const jsonStr = response.slice('jsonFlickrApi('.length, -1);
  const data = JSON.parse(jsonStr);
  

验证步骤 #

1. 打开浏览器DevTools的Network面板，找到你的Flickr API请求
2. 切换到「Response」或「Raw」标签，查看响应内容的开头是否是jsonFlickrApi(
3. 如果是，就用上面的方法调整请求参数或解析逻辑

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