Bootstrap

解决vue+axios请求报错POST http: net::ERR_CONNECTION_REFUSED,在封装的请求中统一处理请求异常的问题

axios请求报错POST http: net::ERR_CONNECTION_REFUSED,通常都是服务端问题,因为第一次与服务器的链接服务器没有做出任何响应,找服务端吧。但是对于这种报错我们也要做一下处理,用户体验会更好。

这种错误的详细解释:
浏览器控制台错误 101 (net::ERR_CONNECTION_RESET) 的本身含义就是这个网站存在故障暂时无法访问,也就是说这个网站服务器被关闭或者是你的网络提供商将这个网站IP屏蔽,可以尝试刷新这个页面,或者搜索这个网站以方便寻找更多的访问途径。

解决办法:

  1. 将域名解析到国内的某个大站(如baidu等),过几天后有可能会被解封,看pr了;
  2. 换回国内的空间;
  3. 更换网络IP;
  4. 换域名(将被墙域名解析到国内空间,然后做301重定向到新域名,以减少流量和权重的丢失)。

可以让服务端解决

0.先写如何封装 axios请求

    import axios from 'axios'
    import qs from 'qs'
    import {
        Message
    } from 'element-ui'
    
    //post请求
    export const post = (url, data = {}) => {
        return new Promise((resolve, reject) => {
            axios.post(url, qs.stringify(data, {
                    indices: false
                }), {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
                    }
                })
                .then(response => {
                    resolve(response.data);
                }, err => {
                    Message.error({
                        message: '请求错误或服务器异常!请联系管理员!'
                    });
                    reject(err)
                })
        })
    }
    //get请求
    export const get = (url, params = {}) => {
        return new Promise((resolve, reject) => {
            axios.get(url, {
                    params: params
                })
                .then(response => {
                    resolve(response.data);
                })
                .catch(err => {
                    reject(err)
                })
        })
    }
  1. 解决vue+axios请求报错 POST http: net::ERR_CONNECTION_REFUSED,在封装的请求中统一处理请求异常的问题。
err => {
                Message.error({
                    message: '请求错误或服务器异常!请联系管理员!'
                });
                reject(err)
            })
;