js axios請求方式

 引入

  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

 

get請求

        //默認請求為get
        axios('http://localhost:5000/Test/g1')
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //無參數，
        axios.get('http://localhost:5000/Test/g1' )
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //無參數,傳對象
        axios({
            url:'http://localhost:5000/Test/g1',
            method:'get'
            })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //url上帶參請求 
        axios({
            url: 'http://localhost:5000/Test/g2?a=3&str=abc',
            method: 'get'
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //帶參
        axios({
            url: 'http://localhost:5000/Test/g2',
            method: 'get',
            //params是URL拼接
            params: {
                a: 3,
                str: 'abc'
            }
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //參數是集合
        axios({
            url: 'http://localhost:5000/Test/g4',
            method: 'get',
            data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

Post

        //無參數
        axios.post('http://localhost:5000/Test/p1')
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //傳對象
        axios({
            url: 'http://localhost:5000/Test/p3',
            method: 'post',
            data: {
                age: 18,
                name: 'tom',
                id: 1
            }
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //數組
        axios({
            url: 'http://localhost:5000/Test/p4',
            method: 'post',
            data: ["ab", "cd"]
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //傳集合對象
        axios({
            url: 'http://localhost:5000/Test/p5',
            method: 'post',
            data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //傳對象和URL參數混合
        axios({
            url: 'http://localhost:5000/Test/p6',
            method: 'post',
            params: { a: 'aaaa', b: 'bbbb' },
            data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //dynamic 對象
        axios({
            url: 'http://localhost:5000/Test/p7',
            method: 'post',
            data: { "age": 18, "name": "tom" }
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });

 

        //dynamic 數組對象
        axios({
            url: 'http://localhost:5000/Test/p7',
            method: 'post',
            data: [{ "age": 18, "name": "tom" }, { "age": 22, "name": "liu" }]
        })
            .then(function (response) {
                console.log(response.data)
            }).catch(function (err) {
                console.log(err)
            });