How to Make HTTP Request in TypeScript

Rana Hasnain Khan Feb 02, 2024
How to Make HTTP Request in TypeScript

We will introduce how to make an HTTP request in TypeScript with an example.

HTTP Request in TypeScript

The HTTP requests in TypeScript are created to fetch or get the data from an outer web server or post the data to an outer web server. The full abbreviation of HTTP is HyperText Transfer Protocol, a layer protocol application.

They are models for collaborative, hypermedia information systems and distribution. It is designed for communication between web browsers and servers and other purposes.

TypeScript is a high-quality programming language especially developed and supported by Microsoft. It is used for the development of large applications and transpiles to JavaScript.

It is a syntax-type language and provides better tools for any scale.

To make HTTP requests in TypeScript, we use a function known as fetch(). This function takes in two parameters, URL and options.

The URL is the link to the webpage we are trying to fetch, whereas, in the options, we send methods that are GET or POST. We can use the GET method to fetch the data from the web server.

We can use the POST method if we want to post or send the data to the web server.

Now we will discuss some rules for giving requests in TypeScript.

  1. The HTTP request in a TypeScript is used to order or fetch the data from the external webservers, and collected data is posted on the external web server.
  2. The HTTP request in TypeScript is placed in the program by using the functions as the primary function is the fetch() function.
  3. The fetch function in TypeScript uses two parameters to run the function: URL and options. After this, it gives a response object.
  4. text(), headers, json(), status, and statusText are all valuable sources provided by the response object in the fetch function.
  5. When the options passed, in the parameters to the fetch function, is post. We have several options for using it.

We will learn all the HTTP request functionality in TypeScript and the working of the fetch function. We pass through the example of an HTTP request in TypeScript.

In this example, we will see the programs where we place a sample of HTTP GET requests to a website using the fetch function. The URL of the website is passed as a parameter in the fetch function.

The whole program converts the responses from the website, given in the parameter, into the text type and prints it as an output.

We loaded the fetch module to use the fetch function at the start.

const fetch = require('node-fetch');

In this step, we will enter the website URL as a parameter to the fetch function.

fetch('https://instagram.com')

Then this function extracts the data from the website, converts it into the text type data, and gives the result.

.then(result => result.text())

Now the text is given as an output box.

.then(textformat => console.log(textformat))
Rana Hasnain Khan avatar Rana Hasnain Khan avatar

Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.

LinkedIn