使用AJAX调用删除对象时,为什么会返回2个响应200和204?

斯马汀

我在下面创建了一些示例代码。您只需单击要删除的文本(或li元素)即可删除项目。

当您在删除时查看“网络”标签时,您会同时获得204和200的响应。为什么有两个?我只打1个电话。

请求方法“ OPTIONS”来自何处?

//Cache DOM
var $content 	= $( 'ul' );
var $name		= $( '#name' );
var $bike		= $( '#bike' );
var $addButton	= $( '#add-item' );
var $liElems 	= $( 'li' );

//Functions


$( function () {

	function addItem( data ) {
		$content.append( '<li id="' + data.id + '">' + data.name + ' likes ' + data.bike + '</li>' );
	}

	$.ajax( {
		type: 'GET',
		url: 'http://rest.learncode.academy/api/sjm/bikes',
		success: function( response ) {
			$.each( response, function( index, bikes ) {
				addItem( bikes );
			});
		},
		error: function( ) {
			console.log ( 'error loading orders' );
		}
	});

	$addButton.on( 'click', function(){
		var data = {
			name: $name.val(),
			bike: $bike.val()
		};

		$.ajax( {
			type: 'POST',
			url: 'http://rest.learncode.academy/api/sjm/bikes',
			data: data,
			success: function( response ) {
				addItem( response );
			},
			error: function( ) {
				console.log( 'error while saving' );
			}
		});
	});

	$content.delegate( 'li', 'click', function ( ) {
		var id = $( this ).attr( 'id' );
		var $this = $( this );

		console.log ( 'delete ' + id);
		$.ajax({
			type: 'DELETE',
			url: 'http://rest.learncode.academy/api/sjm/bikes/' + id,
			success: function( response ){
				$this.fadeOut( 300, function ( ) {
					remove( );
				});
			},
			error: function( ){
				console.log( 'error deleting data' );
			}
		});
	});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="content">
	<section>
		name <input type="text" id="name">
		bike <input type="text" id="bike">
		<button id="add-item">add data</button>
	</section>
	<ul></ul>
</div>

尚旭金

当您尝试将XMLHttpRequest发送到与托管页面不同的域时,您违反了同源策略。但是,这种情况在某种程度上变得很普遍,引入了许多技术。CORS就是其中之一。

简而言之,您正在发送DELETE请求的服务器允许跨域请求。在此过程中,应该有一个预检调用,也就是HTTP OPTION调用。

因此,您对OPTIONDELETE调用有两个响应

有关CORS的信息,请参见MDN页面

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

为什么即使我添加takeUntil和skipWhile,ngrx也会返回2个对象?

为什么在日期对象上调用 Object.getOwnPropertyDescriptors 会返回一个空数组?

在添加空数组和对象时,为什么控制台会这样返回?

为什么平面映射和收集树集列表会返回一个对象?

Rails:当不使用它返回的对象时,调用 ActionController::Parameters#permit() 会实现什么?

为什么一个 API 响应只返回一个对象和一组对象?

Jersey'NoContent'响应返回200而不是204

为什么JQuery AJAX调用返回未定义的对象?

如何使用ServiceStack成功删除后返回HTTP 204响应

为什么在使用 2 个 if 语句时使用 and 运算符比较 if 语句中的 2 个对象会抛出错误

为什么在Django上使用bulk_create通过外键插入数据会返回“属性对象不可调用”?

比较2个“精确” JavaScript对象值时,为什么Object.is()返回false?

调用instanceMethodSignatureForSelector会返回nil。为什么?

为什么在Pandas中使用std()时返回一个对象?

为什么在使用默认构造函数创建对象时,Lombok的@Builder会删除默认字段值?

为什么tslint会删除对象键?

当可调用对象是生成器时,为什么iter(v,w)返回一个类?

为什么有时使用点表示法访问对象属性会返回未定义?

为什么删除请求使用 ajax 在 Laravel 中返回 404

为什么在对象和shared_ptrs上使用从std :: mem_fn返回的可调用对象?

SharePoint REST-为什么更新元数据返回204而不是200?

当最后一个条件调用有条件时,为什么C#编译器会删除方法调用链?

为什么POST响应为204(无内容)会触发Angularjs错误函数?

使用Python调用Bash脚本时为什么返回256

Laravel-为什么json响应有时返回数组有时是对象

为什么添加日期对象和时间对象会返回不正确的值?

为什么使用 cv2.getRotationMatrix2D 和 cv2.warpAffine 旋转图像会返回零矩阵

为什么从另一个类调用使用自动装配对象的方法时,该对象为null?

Redis似乎在启动时删除了dump.rdb。使用Kubernetes PVC和KubeDB。为什么会这样呢?