第2のパッケージ要求axios

/ * * 
 *封装取得方法
 * @paramのURL 
 * @paramデータ
 * @returns {約束} 
 * / 

エクスポート機能をGET（URL、のparams ）{
   返す 新しい（）=>拒否、解決（プロミス{ 
    axiosを。取得（URLを、 {
         paramsは：paramsは
      }）
      .then（応答 => { 
        解決（response.data）; 
      }） 
      。キャッチ（ERR => { 
        （ERR拒否）
      ）} 
  }）
} 


/ * *  
 *封装ポスト请求
 * @param URLを
 paramsはを@param * 
 *プロミス@Returns {} 
 * / 

//   Form1のデータ
 //   ヘッダ：{
 //     "コンテンツタイプ"： 'ファイルアプリケーション/ x-www-form-urlencodedで;のcharset = UTF-8'
 //   } 

/ / フォームデータ要求ペイロード
//リクエストヘッダは、JSONリクエストを送信するが、あなたの背景には、ヘッダーに渡すためにFORMDATA方法インタフェースがある場合は適量をFORMDATAをシリアライズする必要がありますすることができます来てたときに
、我々はJSONにより受け入れているので、楽屋//ここではデフォルトが自分たちのニーズをJSONに応じて、この文字列を回すように、私は変更することができますJSONはそれ以外の歪みである
 
エクスポート機能のPOST（URL、のparams = {}、ヘッダ）{
   返す 新しい新しい約束を（（解決、拒否）=> {
     IF（ヘッダ==未定義）{
      axios.post（URL、JSON.stringify（paramsは 
        }））、{ 
          ヘッダー：{ 
            " コンテンツタイプ"：" アプリケーション/ JSON;のcharset = UTF-8 " 
          } 
        }）
        .then（RES => { 
          解決（res.data）; 
        }） 
        。キャッチ（ERR => { 
          リジェクト（err.data）
        }）
    } 他{ 
      axios.post（URL、QS.stringify（paramsは）、ヘッダ）
        .then（RES => { 
          解決（res.data） 
        。 {キャッチ（ERR =>
          リジェクト（err.data）
        }）
    } 

  }）。
}

/ * * 
 *封装パッチ请求
 * @paramのURL 
 * @paramデータ
 * @returns {プロミス} 
 * / 

エクスポート機能パッチ（URL、データ = {}）{
   戻り 、新たな約束（（決意、リジェクト）=> { 
    axios.patchを（URL、データ）
      .then（応答 => { 
        解決（response.data）; 
      }、ERR => { 
        リジェクト（ERR）
      }）
  }）
} 

/ * * 
 *封装置く请求
 * @param URLを
 * @paramデータ
 * @returns {}の約束
 * / 

エクスポート機能に置く（URL、データ ={}）{
   戻り 、新たな約束（（決意、リジェクト）=> { 
    axios.put（URL、データ）
      .then（応答 => { 
        解決（response.data）; 
      }、ERR => { 
        リジェクト（ERR）
      }）
  }）
}

main.jsで

インポート{ 
  ポスト、
  取得、
  パッチ、
  置く、
} から ' ./assets/utils/http ' 


// 定义全局变量 
Vue.prototype $ポスト=。ポスト; 
Vue.prototype $。GET = GET 。
。Vue.prototype $パッチ = パッチ。
Vue.prototype $置く。置い=;

使用

この。$ を取得（" /ロール/ getAllRole "、{}）.then（RES => { }）;

この。$ポスト（" /裁判官/ editJudgeInfoRole " {、
        OID：この.rowData.oid、
        roleid：この.roleid 
      }）。次に、（RES => { }）。

傍受

すべてのコード

インポートaxios から 「axios 」
インポートQS から 「QS 」
インポートストアから 「@ /ストア/インデックス」
インポートルータから 「@ /ルーター/インデックス」
インポート{mapState、mapMutations} から 「vuex 」。
インポート{ 
  メッセージ
} から 「要素-UI 」。
axios.defaults.timeout = 10000 ; 
axios.defaults.baseURL = process.env.API_ROOT。

axios.defaults.headers.post [' コンテンツタイプ' ] = ' アプリケーション/ x-www-form-urlencodedで。文字セット= UTF-8 " ; 
axios.defaults.headers.common [ ' 認証' ] = store.state.token？store.state.token：localStorage.token。

axios.interceptors.request.use（
  設定 => { 
    config.headersは = {
       ' 認可'？：store.state.token store.state.token：localStorage.token 
    } 
    戻り値の設定; 
  }、
  エラーが => {
     戻りPromise.rejectを（ERR）。 
  } 
）。


// HTTPレスポンス拦截器
axios.interceptors.response.use（
  応答 => {
     場合（response.data.code！= 0 ）{ 
      Message.error（{ 
        メッセージ：response.data.msg、
      }）
      であれば（response.data .CODEの== 40001 ）{ 
        たsetTimeout（（） => { 
          localStorage.token = '' ;
           この .setToken（'' ）; 
          router.replace（{ 
            パス：' /ログイン' 
          }）
        }、）。1500
      } 
    } 
    を返す応答。

  }、
  エラー => {
     戻りPromise.reject（エラー）
  } 
）

おすすめ