Ajax 调用 API return 错误 HTTP/1.1 405 方法不允许
Ajax call to an API return error HTTP/1.1 405 Method Not Allowed
我写了一个非常简单的应用程序(在页面上),它有一张地图,用户可以在上面画圈。第一个圆圈是源,下一个圆圈是目的地。我必须对 API URL 进行 Ajax 调用,以便获取用户在地图上绘制的圆圈内的所有单元 ID。
这是我到目前为止尝试过的方法:
<html>
<head>
<title>Drawing tools</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<link type="text/css" href="res/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="res/jquery.min.js"></script>
<script type="text/javascript" src="res/jquery-ui.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=drawing,places"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
var latitude;
var longitude;
var radius;
(function () {
var circle;
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(-34.397, 150.644),
zoom: 8
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.MARKER,
drawingControl: true,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.MARKER,
google.maps.drawing.OverlayType.CIRCLE,
google.maps.drawing.OverlayType.POLYGON,
google.maps.drawing.OverlayType.POLYLINE,
google.maps.drawing.OverlayType.RECTANGLE
]
},
markerOptions: {
icon: 'images/beachflag.png'
},
circleOptions: {
fillColor: '#ffff00',
fillOpacity: 1,
strokeWeight: 5,
clickable: false,
editable: true,
zIndex: 1
}
});
drawingManager.setMap(map);
google.maps.event.addListener(drawingManager, 'circlecomplete', onCircleComplete);
}
function onCircleComplete(shape) {
var map=shape.getMap();
var circle;
//create an array where we store the circles
if(!map.get('circles')){
map.set('circles',[]);
}
shape.setOptions(
(!map.get('circles').length)
?//first circle
{type:'source',
fillColor:'#ff0000'
}
://other circles
{type:'destination'}
);
//push the circles onto the array
map.get('circles').push(shape);
circle = shape;
radius = circle.getRadius();
center = circle.getCenter();
latitude = circle.getCenter().lat();
longitude = circle.getCenter().lng();
doStuff();
// alert(radius);
}
google.maps.event.addDomListener(window, 'load', initialize);
})();
function doStuff() {
var where_stm = 'within_circle('+latitude+','+longitude+','+radius+')';
$.ajax({
url: 'https://api.dandelion.eu/datagems/v2/SpazioDati/milano-grid/data?$limit=10&$offset=0&$app_id=7b22cb45&$app_key=dc836a05b4f775d8813d253ba07a4570',
type: 'GET',
contentType: "application/json",
dataType: "json",
data: {where:where_stm},
success: function(response) {
var ParsedObject = JSON.parse(response);
console.log(ParsedObject);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log("error :"+XMLHttpRequest.responseText);
}
});
}
</script>
</head>
<body>
<div id="container">
<div id="sidebar-left">
<p> Please select your source place by using drawing tools on the map. </p>
<div id="destinations">
Now you can select one or more destination on the map using the same drawing tools
</div>
<button onClick="doStuff()">Run Code</button>
</div>
<div id="map-canvas"></div>
</div>
</body>
</html>
我的问题:当我在地图上画一个圆圈时,我在控制台上看到这个错误:
OPTIONS https://api.dandelion.eu/datagems/v2/SpazioDati/milano-grid/data [HTTP/1.1 405 Method Not Allowed 350ms]
当我点击它时,我看到了这个:
我会很感激你所有的想法,
谢谢
我尝试通过 Postman 请求,使用 GET 和(仅!)您在代码片段中提供的 URL:200/OK,没有缺陷。在没有 'data' 的情况下尝试。它只能用于 POST 请求,而不是 GET 请求!
但是由于您需要传递 'within_circle' 数据集,您应该考虑使用 POST,这样您就可以使用数据属性,
或者通过在 URL 中传递您的数据参数来发出 GET 请求。由于我不知道 API,因此无法为您做出选择。
我写了一个非常简单的应用程序(在页面上),它有一张地图,用户可以在上面画圈。第一个圆圈是源,下一个圆圈是目的地。我必须对 API URL 进行 Ajax 调用,以便获取用户在地图上绘制的圆圈内的所有单元 ID。
这是我到目前为止尝试过的方法:
<html>
<head>
<title>Drawing tools</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<link type="text/css" href="res/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" src="res/jquery.min.js"></script>
<script type="text/javascript" src="res/jquery-ui.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=drawing,places"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
var latitude;
var longitude;
var radius;
(function () {
var circle;
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(-34.397, 150.644),
zoom: 8
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.MARKER,
drawingControl: true,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.MARKER,
google.maps.drawing.OverlayType.CIRCLE,
google.maps.drawing.OverlayType.POLYGON,
google.maps.drawing.OverlayType.POLYLINE,
google.maps.drawing.OverlayType.RECTANGLE
]
},
markerOptions: {
icon: 'images/beachflag.png'
},
circleOptions: {
fillColor: '#ffff00',
fillOpacity: 1,
strokeWeight: 5,
clickable: false,
editable: true,
zIndex: 1
}
});
drawingManager.setMap(map);
google.maps.event.addListener(drawingManager, 'circlecomplete', onCircleComplete);
}
function onCircleComplete(shape) {
var map=shape.getMap();
var circle;
//create an array where we store the circles
if(!map.get('circles')){
map.set('circles',[]);
}
shape.setOptions(
(!map.get('circles').length)
?//first circle
{type:'source',
fillColor:'#ff0000'
}
://other circles
{type:'destination'}
);
//push the circles onto the array
map.get('circles').push(shape);
circle = shape;
radius = circle.getRadius();
center = circle.getCenter();
latitude = circle.getCenter().lat();
longitude = circle.getCenter().lng();
doStuff();
// alert(radius);
}
google.maps.event.addDomListener(window, 'load', initialize);
})();
function doStuff() {
var where_stm = 'within_circle('+latitude+','+longitude+','+radius+')';
$.ajax({
url: 'https://api.dandelion.eu/datagems/v2/SpazioDati/milano-grid/data?$limit=10&$offset=0&$app_id=7b22cb45&$app_key=dc836a05b4f775d8813d253ba07a4570',
type: 'GET',
contentType: "application/json",
dataType: "json",
data: {where:where_stm},
success: function(response) {
var ParsedObject = JSON.parse(response);
console.log(ParsedObject);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.log("error :"+XMLHttpRequest.responseText);
}
});
}
</script>
</head>
<body>
<div id="container">
<div id="sidebar-left">
<p> Please select your source place by using drawing tools on the map. </p>
<div id="destinations">
Now you can select one or more destination on the map using the same drawing tools
</div>
<button onClick="doStuff()">Run Code</button>
</div>
<div id="map-canvas"></div>
</div>
</body>
</html>
我的问题:当我在地图上画一个圆圈时,我在控制台上看到这个错误:
OPTIONS https://api.dandelion.eu/datagems/v2/SpazioDati/milano-grid/data [HTTP/1.1 405 Method Not Allowed 350ms]
当我点击它时,我看到了这个:
我会很感激你所有的想法, 谢谢
我尝试通过 Postman 请求,使用 GET 和(仅!)您在代码片段中提供的 URL:200/OK,没有缺陷。在没有 'data' 的情况下尝试。它只能用于 POST 请求,而不是 GET 请求!
但是由于您需要传递 'within_circle' 数据集,您应该考虑使用 POST,这样您就可以使用数据属性, 或者通过在 URL 中传递您的数据参数来发出 GET 请求。由于我不知道 API,因此无法为您做出选择。