2017-06-01 62 views
0

我用一個招搖腳本來生成一個休息api。Jquery ajax調用與招搖'休息API a'錯誤'

{ 
    "swagger": "2.0", 
    ... 
}, 
"host": "localhost:8080", 
"basePath": "/swagger-item-jaxrs", 
"schemes": [ "http" ], 
"consumes": [ "application/json" ], 
"produces": [ "application/json" ], 
"paths": { 
"/item/{cd}": { 
    "get": { 
    "description": "Returns an item based on the item code passed.", 
    "operationId": "findItemById", 
    "produces": [ 
     "application/json", 
     "application/xml", 
     "text/xml", 
     "text/html" 
    ], 
    "parameters": [ 
     { 
     "name": "cd", 
     "in": "path", 
     "description": "CD of item to fetch", 
     "required": true, 
     "type": "string" 
     } 
    ], 
    "responses": { 
     "200": { 
     "description": "item response", 
     "schema": { 
      "$ref": "#/definitions/item" 
     } 
     }, 
     "default": { 
     "description": "unexpected error", 
     "schema": { 
      "$ref": "#/definitions/errorModel" 
     } 
     } 
    } 
    } 
} 
}, 
"definitions": { 
"item": { 
    "type": "object", 
    "required": [ 
    "cd", 
    "name" 
    ], 
    "properties": { 
    "cd": { 
     "type": "string" 
    }, 
    "name": { 
     "type": "string" 
    }, 
    "tag": { 
     "type": "string" 
    } 
    } 
}, 
"errorModel": { 
    "type": "object", 
    "required": [ 
    "code", 
    "message" 
    ], 
    "properties": { 
    "code": { 
     "type": "integer", 
     "format": "int32" 
    }, 
    "message": { 
     "type": "string" 
    } 
    } 
} 
} 
} 

我可以調用api使用客戶端生成java類,我甚至可以在瀏覽器中輸入url並獲得響應。

瀏覽器:http://localhost:8080/swagger-item-jaxrs/item/0446840

響應:{"cd":"0446840","name":"ROYAL BASMATI RICE "}

招搖UI甚至可以得到相同的響應返回,並表示curl命令是:curl -X GET "http://localhost:8080/swagger-item-jaxrs/item/0446840" -H "accept: application/json"

我的Ajax代碼:

$.ajax({ url: "http://localhost:8080/swagger-item-jaxrs/item/0446840" , method: "GET" , headers: { "accept": "application/json" } }) .done(function(data) { alert('success'); console.log('success: '); console.log(data); }) .fail(function(err) { console.log('error: '); console.log(err); });

Chrome開發人員工具公司nsole結果:

error: Object {readyState: 0, getResponseHeader: function, getAllResponseHeaders: function, setRequestHeader: function, overrideMimeType: function…}

任何幫助將不勝感激。

回答

0

我看你的代碼不起作用兩個可能的原因:

  1. 您提供的例子招搖文件是無效的。至少在開始時應該多一個{。由於$.ajax會自動嘗試解析,因此您需要確保以有效的JSON接收數據。 但是可以防止解析JSON的$​​ .ajax。爲此,您需要將dataType: "text"添加到$ .ajax的設置對象中。

  2. 使用localhost會導致問題,因爲安全設置不同於 訪問Internet上的普通網站。所以我建議你使用 你的機器和localhost的名字。

爲了找出問題所在,您需要查看錯誤文本。改變你的代碼是這樣的:console.log(err.statusText)

你需要弄清楚這個錯誤是發生在客戶端還是服務器端。看看你的服務器的日誌文件。你能看到你的要求嗎?什麼是http狀態碼?

下一步:在google chrome/deveopler工具中查看網絡選項卡。你能看到請求和迴應嗎?雙擊可以讓你看到所有細節。你能看到服務器的響應嗎?

然後在服務器上,您應該嘗試更改日誌級別以跟蹤甚至調試。這可以讓你看到你的請求的所有細節。

+0

我仔細檢查了json的招搖。我在http://editor.swagger.io/#!/的Swagger Editor中使用了yaml,並下載了json,這就是它的生成過程。我添加了dataType:「text」,將localhost更改爲我的計算機名稱,將console.log更改爲err.statusText。我所得到的是'錯誤'一詞。 –

+0

我能夠得到捲曲並運行curl命令,它可以工作。我現在唯一不能工作的是來自ajax調用,它發生錯誤,這是唯一給出的信息。 –

+0

我終於明白了這個問題。我需要在我的JavaScript中添加一個函數來防止默認提交。 –

0

這是由於沒有阻止提交函數在我的JavaScript。 $('#form').submit(function(e){ e.preventDefault(); });

一旦添加了該頁面,該頁面就可以工作。