美文网首页
看到的请求

看到的请求

作者: 糖醋里脊120625 | 来源:发表于2022-11-22 16:09 被阅读0次

    request.js

    import axios from 'axios';
    
    // 创建请求实例
    const instance = axios.create({
      baseURL: '/api',
      // 指定请求超时的毫秒数
      timeout: 1000,
      // 表示跨域请求时是否需要使用凭证
      withCredentials: false,
    });
    
    // 前置拦截器(发起请求之前的拦截)
    instance.interceptors.request.use(
      (config) => {
        /**
         * 在这里一般会携带前台的参数发送给后台,比如下面这段代码:
         * const token = getToken()
         * if (token) {
         *  config.headers.token = token
         * }
         */
        return config;
      },
      (error) => {
        return Promise.reject(error);
      },
    );
    
    // 后置拦截器(获取到响应时的拦截)
    instance.interceptors.response.use(
      (response) => {
        /**
         * 根据你的项目实际情况来对 response 和 error 做处理
         * 这里对 response 和 error 不做任何处理,直接返回
         */
        return response;
      },
      (error) => {
        const { response } = error;
        if (response && response.data) {
          return Promise.reject(error);
        }
        const { message } = error;
        console.error(message);
        return Promise.reject(error);
      },
    );
    
    // 导出常用函数
    
    /**
     * @param {string} url
     * @param {object} data
     * @param {object} params
     */
    export function post(url, data = {}, params = {}) {
      return instance({
        method: 'post',
        url,
        data,
        params,
      });
    }
    
    /**
     * @param {string} url
     * @param {object} params
     */
    export function get(url, params = {}) {
      return instance({
        method: 'get',
        url,
        params,
      });
    }
    
    /**
     * @param {string} url
     * @param {object} data
     * @param {object} params
     */
    export function put(url, data = {}, params = {}) {
      return instance({
        method: 'put',
        url,
        params,
        data,
      });
    }
    
    /**
     * @param {string} url
     * @param {object} params
     */
    export function _delete(url, params = {}) {
      return instance({
        method: 'delete',
        url,
        params,
      });
    }
    
    export default instance;
    

    api.js

    import { post } from '@/utils/request';
    
    export default class User {
      /**
       * 登录
       * @param {String} username 用户名
       * @param {String} password 密码
       * @returns
       */
      static async login(username, password) {
        return post('/login', {
          username,
          password,
        });
      }
    }
    
    

    vue

    <script setup>
    // This starter template is using Vue 3 <script setup> SFCs
    // Check out https://vuejs.org/api/sfc-script-setup.html#script-setup
    import HelloWorld from './components/HelloWorld.vue'
    import User from '@/api/user';
    
    
    
    async  function ceshi(){
      const res = await User.login("大佬", 123456);
          console.log(res);
    }
    
    
    </script>
    

    相关文章

      网友评论

          本文标题:看到的请求

          本文链接:https://www.haomeiwen.com/subject/ccrnxdtx.html