Question

我创建了自己的后端api，当我在chrome上测试api时，它可以正常工作，但是当我使用axios使用api时，它不返回任何数据。我正在使用vue。

axios.get('http://192.168.149.12:8888/api/user/5120')
            .then(res => {
                this.data = res; 
            }) 
            .catch(err => {
                this.data = err;
            });

响应：

{ "data": "", "status": 200, "statusText": "OK", "headers": { "content-length": "0" }, "config": { "url": "http://192.168.149.12:8888/api/user/5120", "method": "get", "headers": { "Accept": "application/json, text/plain, */*" }, "transformRequest": [ null ], "transformResponse": [ null ], "timeout": 0, "xsrfCookieName": "XSRF-TOKEN", "xsrfHeaderName": "X-XSRF-TOKEN", "maxContentLength": -1 }, "request": {} }

如您所见，数据为空，但是当我尝试使用一些公共api（例如JSONPlaceholder）时，它可以很好地工作。

这是我的json API的格式：

{
"user": {
  "example": false,
  "example1": "/zTxHf9iIOCqRbxvl8W5QYKrsMLq.jpg"
 }
}

编辑：

问题出在我的api上，当我使用一个api时，我会先测试会话是否有效

if user := AuthenticateSession(userCookie.Value); user != 0 {
    switch true {
        case strings.HasPrefix(r.URL.Path, "/user"):
            User(w, r, db, user)
    }
}

我不明白，因为会话有效并且用户!= 0，后端API运行在端口8888上，而Vue.js运行在端口8080上。我在邮递员上进行了测试，发现如果直接在端口8888上调用API（必须先登录），它就可以工作，但是如果您在端口{{1}上运行的Vue.js上使用它，就可以了}状态代码仍为8080，但不会返回任何数据（即使您已经登录并且会话有效）。

Answer 1

我怀疑问题可能出在您的API上。

在Postman / Postwoman / Insomnia上测试API以查看响应。如果API在API测试工具上返回了数据，则在axios上使用时应该可以正常工作。

请参见以下示例：

var app = new Vue({
       el: '#app',

       data: {
        response: '',
       },     
 
       methods:{
        runApi:function(){
            axios.get('https://jsonplaceholder.typicode.com/todos/1').then(response=>{
                this.response = response.data;
                console.log(this.response);
                
            }).catch(function(error){
                console.log('error : ',error);
            })  
        }
       },

       mounted:function(){
           this.runApi();        
        }
    })

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>


<div id="app">
<p>
{{ response }}
</p>
</div>

Vue.js Axios不返回数据

1 个答案: