关于javascript：从JS访问REST API

Access to REST API from JS

需要从 JS 代码访问 REST API，使用 jQuery ajax:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

function tryQwintry () {
var data = {
“params[weight]” :“100”,
“params[dimensions]” :“100x100x100”,
“params[delivery_pickup]” :“msk_1”,
“params[insurance]” :“false”,
“params[items_value]” :“350”,
“params[retail_pricing]” :“1”
};

$.ajax({
url:“http://logistics.qwintry.com/api/cost”,
type:“POST”,
dataType:“jsonp”,
contentType:“application/json”,
headers: {“Authorization”:“Bearer” + MY_API_KEY},
data: data,
success: function (cost) {
console.log(“стоимость доставки $”+cost);
},
error: getErrorMsg
});
}

API 文档(所有示例均为 PHP)：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

<?php
define(‘SITE_URL’, ‘logistics.qwintry.com’);
define(‘API_KEY’, ‘YOUR_API_KEY’); //don’t forget to set your key!

$url = ‘http://’. SITE_URL .‘/api/cost’;

$data = array (
‘params’ => array(
‘weight’ => 5, // in lb
‘delivery_pickup’ => ‘msk_1’, // full list of pickup points can be retrieved from /api/locations-list
‘insurance’ => true,
‘items_value’ => 500, // declaration items total cost in USD
‘retail_pricing’ => true // retail / wholesale pricing?
),
);
$data_string = http_build_query($data);

$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_HTTPHEADER, array(‘Authorization: Bearer ‘. API_KEY));
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, $data_string);
curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, 0);
curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, 0);
$response = curl_exec($ch);
curl_close($ch);
var_dump($response);

我用 Java 编写的代码相同：

1
2
3
4
5
6
7
8
9
10
11
12
13
14

public double getCostPickup(String weight, String dimensions, String toPickup, String insurance, String value) throws Exception {

Map<String, Object> params = new HashMap<>();
params.put(“params[weight_kg]”, weight);
params.put(“params[dimensions_cm]”, dimensions);
params.put(“params[delivery_pickup]”, toPickup);
params.put(“params[insurance]”, insurance);
params.put(“params[items_value]”, value);
params.put(“params[retail_pricing]”, RETAIL_PRICING);

String url = BASE_URL+“/api/cost”;
HttpResponse<JsonNode> jsonResponse = Unirest.post(url).fields(params).asJson();
return getCost(jsonResponse, insurance);
}

配置ajax请求数据有问题。
所以任何帮助将不胜感激。

更新：更改了我的 JS 代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

$.ajax({
url:“http://logistics.qwintry.com/api/cost”,
type:“POST”,
dataType:“json”,
contentType:“application/json”,
headers: {“Authorization” :“Bearer”+MY_API_KEY,“Access-Control-Allow-Origin” :“true”},
data: JSON.stringify(data),
success: function (cost) {
console.log(“стоимость доставки $”+cost);
},
error: getErrorMsg
});
}

在 Chrome 的开发者模式下出现此错误：
enter image description here

相关讨论

您不能使用 jsonp 使用 POST 请求。设置 GET 请求或不使用 jsonp
它的 POST 请求，但是它的跨域请求
所以将 jsonp 替换为 json 作为数据类型。再次如前所述，无法将 POST 用于 jsonp stackoverflow.com/a/3860117/1414562

你在使用 CORS 请求吗？

如果不是，则将数据类型更改为 “json” 而不是 “dataType: “jsonp”。

如果您正在执行 CORS，则启用 CORS 请求，那么您需要添加 php 代码以允许 CORS 请求。

1	header(“Access-Control-Allow-Origin: *”);

使用 php 标头检查此链接 CORS

Json 数据格式：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

var data = {
weight : 100,
dimensions :“100x100x100”,
delivery_pickup :“msk_1”,
insurance : false,
items_value : 350,
retail_pricing : 1
};

$.ajax({
url:“http://logistics.qwintry.com/api/cost”,
dataType:“jsonp”,
contentType:“application/json”,
headers: {“Authorization”:“Bearer” + MY_API_KEY},
data: JSON.stringify(data),
success: function (cost) {
console.log(“стоимость доставки $”+cost);
},
error: getErrorMsg
});

注意：JOSNP

不允许使用方法：”POST”

Access to REST API from JS

猜你喜欢