首页 > 解决方案 > 在反应中使用 jsonp 的 Flickr 公共 api

问题描述

我正在尝试使用响应中的 jsonp 请求通过 Flickr 公共 api 显示图像。我不断遇到不同的问题,不知道如何使这项工作。我也在使用 Codepen,并且出现“未捕获的 ReferenceError:jsonFlickrFeed 未定义”之类的错误。我看过工作示例,但我是 jsonp 新手,所以真的不知道如何将它与 react 集成

完整代码在这里

getItems() {
   $.ajax({
      url: 'https://api.flickr.com/services/feeds/photos_public.gne',
      dataType: 'jsonp',
      data: {
         "tags": this.state.search,
         "format": "json"
      }
   })
}

标签: reactjsjsonpflickrcodepen

解决方案


修复了 codepen 链接

解决此问题的步骤:

  • 正如这里所建议的,将nojsoncallback=1参数添加到 API URL 以接收纯 json 对象。
  • 从 ajax 设置中删除dataType:jsonp属性不会出现 MIME 类型错误,因为我们不再收到 JSONP 响应。
  • 将您的回调函数放入.done() 方法中

  • 如果你在 codepen 上预览代码,你会得到一个 CORS 错误。在本地环境中运行代码或安装 CORS 浏览器插件以消除此错误。


推荐阅读