网络与请求级错误

📅 2026/8/11 19:41:30
网络与请求级错误
Axios 的错误回调主要可以分为三大类网络/请求级错误、HTTP 状态码错误如 401、502以及配置/取消类错误。 网络与请求级错误这类错误发生在请求无法成功发出或没有收到服务器响应时。此时错误对象中通常没有error.response属性。错误码 (Error Code)说明常见场景ERR_NETWORK网络相关的通用错误网络连接中断、DNS 解析失败、CORS 策略阻止、服务器无响应等。ECONNABORTED请求超时**由 Axios 配置的timeout触发**请求时间超过了timeout设定的值。ETIMEDOUT请求超时**操作系统/底层网络触发**服务器长时间未响应但可能没有超过 Axios 配置的超时时间。 HTTP 状态码错误 (4xx, 5xx)当请求成功发送但服务器返回了一个非 2xx的 HTTP 状态码时Axios 会将其视为错误。此时错误对象中包含error.response对象。4xx 客户端错误请求有问题。400 (Bad Request)请求参数错误。401 (Unauthorized)未授权通常需要重新登录。403 (Forbidden)禁止访问权限不足。404 (Not Found)请求的资源不存在。5xx 服务端错误服务器处理请求时出错。500 (Internal Server Error)服务器内部错误。502 (Bad Gateway)网关错误。503 (Service Unavailable)服务不可用。504 (Gateway Timeout)网关超时。注意特殊情况下withCredentials: true可能导致 401 等错误被归类为ERR_NETWORK。⚙️ 配置、请求与取消错误这类错误与请求的配置、构造过程或用户主动取消有关。ERR_BAD_OPTION/ERR_BAD_OPTION_VALUE: 提供给 Axios 的配置选项无效。ERR_BAD_REQUEST: 请求格式有误或缺少必要参数。ERR_BAD_RESPONSE: 服务器响应无法被正常解析。ERR_FR_TOO_MANY_REDIRECTS: 请求重定向次数超过最大限制。ERR_CANCELED: 请求被用户主动取消。ERR_INVALID_URL: 提供的 URL 无效。ERR_NOT_SUPPORT: 当前环境不支持该特性或方法。 总结与实践在实际开发中可以通过检查error对象来区分错误类型并作出对应处理例如axios.get(/api/data).catch(error{if(error.response){// 1. 服务器响应了但状态码不是 2xxconsole.log(HTTP 错误:,error.response.status);if(error.response.status401){/* 跳转登录 */}if(error.response.status502){/* 提示服务暂时不可用 */}}elseif(error.request){// 2. 请求已发出但没有收到响应 (网络层错误)console.log(网络错误:,error.code);// 可能是 ERR_NETWORK 等}else{// 3. 在发送请求前就触发了错误 (配置错误等)console.log(请求配置错误:,error.message);}});importaxiosfromaxios;import{MessageBox,Message}fromelement-ui;importcookiefromjs-cookie;// 创建axios实例constserviceaxios.create({baseURL:http://localhost:9001,// api的base_urltimeout:20000,// 请求超时时间});// http request 拦截器service.interceptors.request.use((config){//debuggerif(cookie.get(guli_token)){config.headers[token]cookie.get(guli_token);}returnconfig;},(err){returnPromise.reject(err);});// http response 拦截器service.interceptors.response.use((response){//debuggerif(response.data.code28004){console.log(response.data.resultCode是28004);// 返回 错误代码-1 清除ticket信息并跳转到登录页面//debuggerwindow.location.href/login;return;}else{if(response.data.code!20000){//25000订单支付中不做任何提示if(response.data.code!25000){Message({message:response.data.message||error,type:error,duration:5*1000,});}}else{returnresponse;}}},(error){debugger;// 网络/请求级错误、HTTP 状态码错误if(error.response){// 请求成功发送但服务器返回了一个非 2xx 的 HTTP 状态码时Axios 会将其视为错误。此时错误对象中包含 error.response 对象。// 400 (Bad Request)请求参数错误。// 401 (Unauthorized)未授权通常需要重新登录。// 403 (Forbidden)禁止访问权限不足。// 404 (Not Found)请求的资源不存在。// 500 (Internal Server Error)服务器内部错误。// 502 (Bad Gateway)网关错误。// 503 (Service Unavailable)服务不可用。// 504 (Gateway Timeout)网关超时。if(error.response.status401){// 401 Unauthorizedconsole.log(401 Unauthorized: 用户未授权或登录已过期。);}elseif(error.response.status403){// 403 Forbiddenconsole.log(403 Forbidden: 用户权限不足禁止访问。);}elseif(error.response.status404){// 404 Not Foundconsole.log(404 Not Found: 请求的资源不存在。);}elseif(error.response.status500){// 500 Internal Server Errorconsole.log(500 Internal Server Error: 服务器内部错误。);}elseif(error.response.status502){// 502 Bad Gatewayconsole.log(502 Bad Gateway: 网关错误。);}elseif(error.response.status503){// 503 Service Unavailableconsole.log(503 Service Unavailable: 服务不可用。);}elseif(error.response.status504){// 504 Gateway Timeoutconsole.log(504 Gateway Timeout: 网关超时。);}else{console.log(HTTP 错误: 状态码${error.response.status}, 信息:${error.response.statusText});}}else{// 处理网络错误// ERR_NETWORK 网络连接中断、DNS 解析失败、CORS 策略阻止、服务器无响应等// ECONNABORTED 由 Axios 配置的 timeout 触发// ETIMEDOUT 请求超时操作系统/底层网络触发//ECONNRESET 防火墙/安全组阻断if(error.message.includes(Network Error)){Message.error(网络错误请检查您的网络连接。);}elseif(error.message.includes(timeout)){Message.error(请求超时请稍后再试。);}elseif(error.message.includes(ECONNABORTED)){Message.error(请求被中止请稍后再试。);}elseif(error.message.includes(ETIMEDOUT)){Message.error(请求超时请稍后再试。);}elseif(error.message.includes(ECONNRESET)){Message.error(连接被重置请检查防火墙或安全组设置。);}else{Message.error(未知网络错误:${error.message});}}// 配置、请求与取消错误//这类错误与请求的配置、构造过程或用户主动取消有关。// ERR_BAD_OPTION / ERR_BAD_OPTION_VALUE: 提供给 Axios 的配置选项无效。// ERR_BAD_REQUEST: 请求格式有误或缺少必要参数。// ERR_BAD_RESPONSE: 服务器响应无法被正常解析。// ERR_FR_TOO_MANY_REDIRECTS: 请求重定向次数超过最大限制。// ERR_CANCELED: 请求被用户主动取消。// ERR_INVALID_URL: 提供的 URL 无效。// ERR_NOT_SUPPORT: 当前环境不支持该特性或方法。//处理配置错误if(error.codeERR_BAD_OPTION||error.codeERR_BAD_OPTION_VALUE){console.error(请求配置错误请检查 Axios 配置。,error.message);}elseif(error.codeERR_BAD_REQUEST){console.error(请求格式有误或缺少必要参数。,error.message);}elseif(error.codeERR_BAD_RESPONSE){console.error(服务器响应无法被正常解析。,error.message);}elseif(error.codeERR_FR_TOO_MANY_REDIRECTS){console.error(请求重定向次数超过最大限制。,error.message);}elseif(error.codeERR_CANCELED){console.warn(请求被用户主动取消。,error.message);}elseif(error.codeERR_INVALID_URL){console.error(提供的 URL 无效。,error.message);}elseif(error.codeERR_NOT_SUPPORT){console.error(当前环境不支持该特性或方法。,error.message);}returnPromise.reject(error);});exportdefaultservice;