是否遇见过jsonp实现跨域请求获取某网址时,调用回调函数显示“未定义?”

269 阅读1分钟

错误复现:

首先我使用了fetch-jsonp
你可以安装它:npm i fetch-jsonp
技术栈:Vue3+Tsx
我的功能是,获取百度“搜索详情”,比如:我输入心脏,跳出来“心脏病的形成”、“心脏起搏器”……
image.png
然后我调用了[https://www.baidu.com/sugrec?prod=pc&from=pc_web&json=1&wd=${value}](https://www.baidu.com/sugrec?prod=pc&from=pc_web&json=1&wd=${value.value})这个接口
但始终说我的回调函数未定义
因为之前我的请求是[https://www.baidu.com/sugrec?prod=pc&from=pc_web&json=1&wd=${value}&cb=handleSearchResults](https://www.baidu.com/sugrec?prod=pc&from=pc_web&json=1&wd=${value.value}&cb=handleSearchResults)
代码复现:

const handleSearchResults = (data: any) => {
  searchResults.value = data.g;
};

const gotoSearch = () => {
  const url = `https://www.baidu.com/sugrec?prod=pc&from=pc_web&json=1&wd=${value}&cb=handleSearchResults`;
  fetchJsonp(url)
    .then((response) => {
      return response.json();
    })
    .then((data) => {
      console.log(data);
      searchResults.value = data.g;
    })
    .catch((err) => {
      console.error(err);
    });
};

解决办法

const handleSearchResults = (data: any) => {
  searchResults.value = data.g;
};
const gotoSearch = () => {
  const url = `https://www.baidu.com/sugrec?prod=pc&from=pc_web&json=1&wd=${value}`;
  fetchJsonp(url, {
    jsonpCallback: 'cb',
  }) //解决问题
    .then(response => response.json())
    .then(data => {
      console.log(data);
      handleSearchResults(data);
    })
    .catch(error => {
      console.error(error);
    });
};