首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Angular:如何检查post或put请求后的http代码?

在Angular中,可以使用HttpClient模块来发送HTTP请求,并且可以通过订阅返回的Observable来获取响应结果。当发送POST或PUT请求后,可以通过检查HTTP响应的状态码来判断请求是否成功。

以下是一个示例代码,展示了如何检查POST或PUT请求后的HTTP代码:

代码语言:typescript
复制
import { HttpClient, HttpHeaders } from '@angular/common/http';

// 在构造函数中注入HttpClient
constructor(private http: HttpClient) {}

// 发送POST请求的示例代码
postData(url: string, data: any) {
  const headers = new HttpHeaders({ 'Content-Type': 'application/json' });

  this.http.post(url, data, { headers, observe: 'response' })
    .subscribe(response => {
      console.log('HTTP code:', response.status);
      // 在这里可以根据HTTP代码进行相应的处理
    }, error => {
      console.error('Error:', error);
    });
}

// 发送PUT请求的示例代码
putData(url: string, data: any) {
  const headers = new HttpHeaders({ 'Content-Type': 'application/json' });

  this.http.put(url, data, { headers, observe: 'response' })
    .subscribe(response => {
      console.log('HTTP code:', response.status);
      // 在这里可以根据HTTP代码进行相应的处理
    }, error => {
      console.error('Error:', error);
    });
}

在上述代码中,我们使用HttpClient的post和put方法发送POST和PUT请求,并通过observe参数设置为'response'来获取完整的HTTP响应。在订阅返回的Observable时,可以通过response.status来获取HTTP响应的状态码。

对于HTTP状态码的含义和常见的状态码,可以参考HTTP协议规范。根据不同的状态码,可以进行相应的处理,例如:

  • 2xx:请求成功,可以根据具体的状态码进行进一步的处理。
  • 4xx:客户端错误,例如请求的资源不存在或请求参数错误。
  • 5xx:服务器错误,例如服务器内部错误或服务不可用。
页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Go | Go 发送 http 请求: post,get,put,delete请求示例代码

Go 发送 http 请求: post,get,put,delete请求示例代码 ---- HTTP 请求方法请求示例GETPOSTkv 形式jsonPUTPATCHDELETE处理响应源码参考完成测试代码...在日常开发中大多数会用到 5 种请求方法:GET、POSTPUT、PATCH 和 DELETE 方法 描述 GET 请求指定页面信息,并返回实体主体。...POST 向指定资源提交数据进行处理请求(例如提交表单或者上传文件)。数据被包含在请求体中。POST 请求可能会导致新资源建立和/已有资源修改。...PUT 从客户端向服务器传送数据取代指定文档内容。 DELETE 请求服务器删除指定页面。 PATCH 是对 PUT 方法补充,用来对已知资源进行局部更新。...(req) PUT 由于 net/http 没有提供简化 PUT 请求,这里需要使用 http.NewRequest 来创建请求 targetUrl := "https://b959e645-00ae

23.7K42
  • python中property装饰器,迭代器,生成器,http请求postput区别,URL和URI, RESTfulAPI

    python property() 函数: @property装饰器就是负责把一个方法变成属性来进行调用结构,实现既可以检查参数,又可以以点形式进行调用类中方法。...请求postput区别: 如果一个方法(API)重复执行多次,产生效果是一样,那它就是idempotent 假如我们发送两个http://superblogging/blogs/post.../Sample请求,服务器端是什么样行为?...如果产生了两个博客帖子,那就说明这个服务不是idempotent,因为多次使用产生了不同效果;如果一个请求把第一个请求覆盖掉了,那这个服务就是idempotent。...前一种情况,应该使用POST方法,一种情况,应该使用PUT方法, post是发送请求put也是发送请求,但是put一个请求会把前一个请求覆盖掉。

    1.1K40

    【Hybrid开发高级系列】AngularJS(二)——常用$服务

    $apply()方法可以在angular框架之外执行angular JS表达式,例如:DOM事件、setTimeout、XHR其他第三方库。..., POST, PUT     url: 字符串,请求目标     params: 字符串或者对象,会被转换成为查询字符串追加url后面     data: 在发送post请求时使用,作为消息体发送到服务器...XSFR令牌cookie名称     transformRequest: 函数或者函数数组,用来对http请求请求体和头信息进行转换,并返回转换结果。     ...拦截器允许你: 通过实现 request 方法拦截请求:         该方法会在 http 发送请求道后台之前执行,因此你可以修改配置做其他操作。...$scope.names = response; }).error(function(data){     //错误代码 }); 1.4.8 $http post实例     $http  post实例

    42040

    前端MVC学习总结(三)——AngularJS服务、路由、内置API、jQueryLite

    一、服务 AngularJS功能最基本组件之一是服务(Service)。服务为你应用提供基于任务功能。服务可以被视为重复使用执行一个多个相关任务代码块。...1.1.2、发送http请求服务 ($http) $http服务从AngularJS代码直接与Web服务器进行交互,底层是通过AJAX实现,与jQuery中$.ajax类似 通过$http封装方法:...jsonp(url,[config]) 发送通过jsonp实现跨域同步请求请求 post(url,data,[config]) 发送谓词为post异步请求 put(url,data[config...]) 发送谓词为put异步请求 基本用法: $http({method: 'GET', url: '/someUrl'})....Angularpostput请求Content-Type: application/json默认情况下,jQuery传输数据使用Content-Type: x-www-form-urlencodedand

    6.1K30

    前端MVC学习总结(三)——AngularJS服务、路由、内置API、jQueryLite

    一、服务 AngularJS功能最基本组件之一是服务(Service)。服务为你应用提供基于任务功能。服务可以被视为重复使用执行一个多个相关任务代码块。...1.1.2、发送http请求服务 ($http) $http服务从AngularJS代码直接与Web服务器进行交互,底层是通过AJAX实现,与jQuery中$.ajax类似 通过$http封装方法:...jsonp(url,[config]) 发送通过jsonp实现跨域同步请求请求 post(url,data,[config]) 发送谓词为post异步请求 put(url,data[config...]) 发送谓词为put异步请求 基本用法: $http({method: 'GET', url: '/someUrl'})....Angularpostput请求Content-Type: application/json默认情况下,jQuery传输数据使用Content-Type: x-www-form-urlencodedand

    6.3K50

    Selenium结合Unirest和JTwig进行API测试

    REST API测试:与Selenium WebDriver UI测试相比,REST API测试并不难,大多数api都是GET / POST / PUT / PATCH / DELETE请求之一: GET...这样框架,并使用Selenium进行应用程序UI测试 --而现在希望在相同框架中也包含API测试 --可能需要快速设置数据断言等,那么接下来就让我们看看如何在本文中完成。...HTTP请求库 JTwig是一个非常简单模板引擎 程序示例: 我将考虑这个应用程序[5]进行测试。...接下来可以发送POST请求创建新联系人了(发送POST请求之后,在这里还可以通过UI界面进行检查联系人是否成功显示在UI界面,此处不做详细Demo) String postApi = "https:...4- 编辑请求 要编辑联系人,我们需要发送如下所示PUT请求

    1.4K20

    AngularDart4.0 英雄之旅-教程-08HTTP

    让用户添加,编辑和删除英雄名字。 将更改保存到服务器。 您将教会应用程序对远程服务器Web API进行相应HTTP调用。 当你完成这个页面,应用程序应该看起来像这个实例(查看源代码)。...这与@Component注解中提供者列表具有相同效果。 注意:除非您有适当配置后端服务器(模拟服务器),否则此应用程序不起作用。 下一节将展示如何模拟与后端服务器交互。...getHeroes()类似,但它使用HTTP put()来保持服务器端更改。...put()请求体是通过调用JSON.encode获得英雄JSON字符串编码。 正文内容类型(application / json)在请求头中被标识。...您将HeroService扩展为支持post(),put()和delete()方法。 您更新了组件以允许添加,编辑和删除英雄。 您配置了内存中Web API。 您了解了如何使用Streams。

    11K30

    剥开比原看代码07:比原节点收到“请求区块数据”信息如何应答?

    请求区块数据”信息BlockRequestMessage发送给peer节点,那么本文研究重点就是,当peer节点收到了这个信息,它将如何应答?...那么这个问题如果细分的话,也可以分为三个小问题: 比原节点是如何收到对方发过来信息? 收到BlockRequestMessage,将会给对方发送什么样信息? 这个信息是如何发送出去?...比原节点是如何接收对方发过来信息? 如果我们在代码中搜索BlockRequestMessage,会发现只有在ProtocolReactor.Receive方法中针对该信息进行了应答。...如果我们对前一篇《比原是如何请求区块数据信息发出去》有印象的话,会记得比原在发送信息时,最后会把信息写入到MConnection.bufWriter中;与之相应,MConnection还有一个bufReader...好在前半部分问题我们在前一篇文章《比原是如何请求区块数据信息发出去》中进行了专门讨论,这里就不讲了,有需要的话可以再过去看一下(可以先看最后“总结”那一小节)。

    36820

    Selenium WebDriver—如何测试REST API

    REST API测试:与Selenium WebDriver UI测试相比,REST API测试并不难,大多数api都是GET / POST / PUT / PATCH / DELETE请求之一: GET...这样框架,并使用Selenium进行应用程序UI测试 --而现在希望在相同框架中也包含API测试 --可能需要快速设置数据断言等,那么接下来就让我们看看如何在本文中完成。...HTTP请求库 JTwig是一个非常简单模板引擎 程序示例: 我将考虑这个应用程序[5]进行测试。...接下来可以发送POST请求创建新联系人了(发送POST请求之后,在这里还可以通过UI界面进行检查联系人是否成功显示在UI界面,此处不做详细Demo) String postApi = "https:...4- 编辑请求 要编辑联系人,我们需要发送如下所示PUT请求

    1.7K10

    RxJS 处理多个Http请求

    管理多个异步数据请求会比较困难,但我们可以借助 Angular Http 服务和 RxJS 库提供功能来实现上述功能。处理多个请求有多种方式,使用串行并行方式。...仅当内部 Observable 对象发出值,才会合并源 Observable 对象输出值,并最终输出合并值。...这个例子很简单,它只处理一个请求,接下来我们来看一下如何处理两个请求。 Map 和 Subscribe 有些时候,当我们发送下一个请求时,需要依赖于上一个请求数据。...即我们在需要在上一个请求回调函数中获取相应数据,然后在发起另一个 HTTP 请求。...最后我们来看一下如何处理多个并行 Http 请求。 forkJoin 接下来示例,我们将使用 forkJoin 操作符。

    5.8K20

    Angular HttpClient 拦截器

    在之前 Angular 6 HttpClient 快速入门 文章中,我们已经简单介绍了 Http 拦截器。本文将会进一步分析一下 Http 拦截器。拦截器提供了一种用于拦截、修改请求和响应机制。...在上面的 AuthInterceptor 拦截器中,我们实现功能就是设置自定义请求头。接下来我们来介绍如何利用拦截器实现请求日志记录功能。...): HttpResponse| null —— 用于获取 req 请求对象对应响应对象; put(req: HttpRequest, res: HttpResponse): void; —— 用于保存...== null) { return of(cachedResponse); } // 发送请求至API站点,请求成功保存至缓存中...这里只是简单介绍了如何为 AuthInterceptor 拦截器写单元测试,对于单元测试同学,建议阅读官方其他学习资料。

    2.6K20

    AngularJS XMLHttpRequest

    使用格式: // 简单 GET 请求,可以改为 POST $http({     method: 'GET',     url: '/someUrl' }).then(function successCallback...(response) {         // 请求成功执行代码     }, function errorCallback(response) {         // 请求失败执行代码 }); 简写方法...POST 与 GET 简写方法格式: $http.get('/someUrl', config).then(successCallback, errorCallback); $http.post('/...$http.put $http.delete $http.jsonp $http.patch 读取 JSON 文件 以下是存储在web服务器上 JSON 文件: https://www.runoob.com...get 请求是本站服务器,你不能直接拷贝到你本地运行,会存在跨域问题,解决办法就是将 Customers_JSON.php 数据拷贝到你自己服务器上,附:PHP Ajax 跨域问题最佳解决方案。

    2.4K30
    领券