axios为啥手机上就会进入错误信息

Posted 2023-03-30

封装好的axios在电脑（windows）上运行，可以拿到所需要的数据但是进入手机或者safari中就会进入erreo里面，让人很恼火，改了一半天都是这个问题

为什么手机上就会进入错误信息，看不懂什么玩意，也不明白，太复杂了。 参考技术A 我的天 这个大坑~ 神烦 百度馊了各种办法 不下一百个网页 最后发现是请求路径的错误

有说es6不兼容的，好那咱就试 对吧 安装polyfill 咱全局安装 代码污染就污染 后期再改

安装好 调试好之后 不行 还是出不来

继续苦思冥想

都是局域网地址 为什么就访问不到本地tomcat服务器呢

pc上 模拟各种手机 也能正常访问到数据啊 为啥真机上就出不来呢？

最后得出个结论：地址写错了！！！

原本设置的是：axios.default.baseUrl ='http://localhost:8080'

后来仔细一想，我去！ 这永远访问的是当前机器的地址啊，我笔记本上有tomcat，所以能请求成功！

但是我手机访问的时候，请求的是手机上的tomcat！

手机上哪有tomcat 果断改为 axios.default.baseUrl ='http://192.168.0.9:8080'

vue中这么设置了一下

"scripts":
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server --open --port 3000 --hot --host 192.168.0.9"
,
然后执行 npm run dev 就可以手机输入地址访问了

数据显示出来的那一刻 我有种感动(chun)哭了的感觉！

寒假刚接触vue 爬了好多坑~ 继续爬

为啥我使用 axios 获取数据时出现错误 500

【中文标题】为啥我使用 axios 获取数据时出现错误 500

【英文标题】：Why i get Error 500 fetching data with axios为什么我使用 axios 获取数据时出现错误 500

【发布时间】：2020-05-15 09:35:06

【问题描述】：

我正在做一个小项目来学习并将它放在我的项目部分 我遇到这样的问题：

GET https://cors-anywhere.herokuapp.com/http://www.recipepuppy.com/api/?q=rice500（内部服务器错误）

未捕获（承诺中）错误：请求失败，状态码为 500 在 createError (createError.js:16) 定居时 (settle.js:17) 在 XMLHttpRequest.handleLoad (xhr.js:61)

我尝试使用 axios 标头（我在另一个论坛上发现了这个建议，但它不起作用） 我获取数据的代码如下所示

 export async function fetchData(text) 
    const proxy = `https://cors-anywhere.herokuapp.com/`;
    const base = `http://www.recipepuppy.com/api/`;
    const baseEnd = `q=$text`;
    const data = await axios
      .get(`$proxy$base?$baseEnd`)
      .then(data =>console.log(data));
    const recipes = data.data.results;
    return recipes.length > 0 ? recipes : false;
  

这里调用的函数：

async function getRecipes(e) 
  e.preventDefault(); 
  const text = e.target[1].value; 
  const loader = '<div class="loader"></div>'; 
  container.insertAdjacentHTML('beforebegin', loader); 
  const recipes = await fetchData(text); 
  document.querySelector('.loader').remove(); 
  displayRecipes(recipes); 

【问题讨论】：

如果您仍然有该错误，请添加该函数的完整代码以及您调用它的至少部分代码。

这是我调用提取的代码export async function fetchData(text) const proxy = cors-anywhere.herokuapp.com; const base = recipepuppy.com/api?; const baseEnd = q=$text; const data = await axios.get($proxy$base ?$baseEnd).catch(err => console.log(err)); console.log(data) return recipes.length > 0 ? recipes : false; 这是我调用函数的地方 `

这就是我调用我的函数async function getRecipes(e) e.preventDefault(); const text = e.target[1].value; const loader = '<div class="loader"></div>'; container.insertAdjacentHTML('beforebegin', loader); const recipes = await fetchData(text); document.querySelector('.loader').remove(); displayRecipes(recipes);

这是 2 天前的工作，昨天我想编写我的小应用程序，但它甚至没有获取数据

所以错误指向至少 3 个脚本。可能你是从另一个异步函数调用 getRecepies() 并且它也包含在 Promise 中？就在几天前，我与 Vuejs 中的授权流程作斗争并遇到了同样的错误。所以为了本地化它，我将所有逻辑移到“根”函数中，然后开始将部分代码移动到相关的“子”函数中。问题在某种程度上缺少 .catch()。

【参考方案1】：

您需要从 Promise 中捕获可能的错误（因为 axios.get() 返回 Promise 类型对象）。

axios.get(`$proxy$base?$baseEnd`)
  .then(data =>console.log(data))
  .catch(error => 
    console.log(error)
  )

【讨论】：

try await axios.get($proxy$base?$baseEnd) catch(err)console.log(err) -- 知道为什么没有使用 await 处理。