How to get a REST API Response from a Glitch Project

Glitch Tutorials
1

How to get your Rest APi Response from Glitch Project

Well - well - well, Someone may want to get JSON or Some response from their REST APi Project. But, The Server didn’t response to the Response that client(You) want. Soo… How can we fix it?

You’re in right Post boi ( ͡° ͜ʖ ͡°)

Today, i will Tell you How to get your REST APi Response from your Glitch Project

Everything that you need:

  • NodeJS v8+,
  • request Module,
  • and Your REST API Glitch Project.

Okok, So what do i need to do Next?

  1. Prepare your Client Project at your PC, Mobile, or at hosting Service (Example is Glitch.com)

  2. In your Client Project, install request module. Yes, Only Client project.

  3. Prepare your REST API server. Idle or Online is no problem.

  4. In Client Project, Write This code below:

const request = require("request")
// Create request Variable.

// Now send request to your REST APi Server
// We will set User-Agent header since Glitch will throw you to Fake Waking Up page when you request it without User-Agent.
// Or it give 403 response code

// Set your User Agent here. Anything.
var myuseragent = "Get REST APi Response! - Your Client!";

request("https://rest-api.glitch.me", { 
   headers: {
       "User-Agent": myuseragent
   }
}, function (err, res, body) {
if (err) {
/* */
}

// Your Code
});
  1. Run the client codes and See the Result.
  2. Do not misuse this Code that can cause Glitch TOS Violation.
  3. Alternative, You can try got module:
const got = require("got");

got("https://rest.api").then(r => {
     let body = r.body;
 //Your Code
});
5 Likes
2

  1. Fyi, request has been deprecated, it’s better to use an alternative like Axios or Fetch API.

  2. You can’t use require('') statements in client side code, unless you mean running it in the server side.

6 Likes
3

Hmm, when I did this I just set up a basic path route in express:

app.get("/test", (req, res) => {
res.send("hello world";
})

And then on the client:

fetch("myproject.glitch.me/test")
 .then(res => res.json())
 .then(text => console.log(text))

Like what @khalby786 said, request has been deprecated in favor of newer, faster options like Fetch. Additionally, the fetch option doesn’t return any waking headers - there’s just a delay as the server wakes up and then your stuff appears.

4

? I thought the fetch API is not in Node. Like:

async function fetchurl(url) {
  var promise = await fetch(url);
  var res = await promise.text();
  return res;
}
5

That makes me wonder, is this tutorial for client or server side? If it’s server side you can use axios or postman-fetch or something to get an API.
Or if you want to be a total power user (and waste lots of time) curl the api endpoint, write it to a file with echo >> (I think) and then read the file with javascript.

6

In Node, you can use node-fetch, which is Fetch API for Node.js.

const fetch = require('node-fetch');
fetch("https://example.com")
   .then(res => res.text())
   .then(data => console.log(data))
2 Likes
7

Is it built in? Are there any built in fetch modules?

8

No, you need to first install node-fetch.

# NPM
npm i node-fetch --save

# YARN
yarn add node-fetch

const fetch = require('node-fetch');
fetch("https://example.com")
   .then(res => res.text())
   .then(data => console.log(data))
2 Likes
9

why not res.json() ?

Also what’s the benefit of yarn/pnpm over normal npm?

10

I used res.text() for the sake of the example :sweat_smile:

It’s faster. Remember, time is precious

1 Like
11

It would be nice if Glitch had yarn, its faster from what I’ve heard.

1 Like
12

Yeah, I think you can install yarn on Glitch using npm. And don’t use the Add Package button for this.

npm i yarn

You’re actually supposed to install yarn globally but you can’t do global installations in Glitch.

1 Like
13

I suppose you could just add the “g” switch.

14

Global? Like -g?

15

Yep, maybe. Not the NPM expert sorry, hehe

16

That’s what I said, you can’t install npm packages globally on Glitch.

:point_up:

2 Likes
17

Oh that sucks.

18

Some trick: Install it with --save-dev Instead.

19

My newest question post may be resolved using this.

Did you mean I need "User-Agent":"Get REST APi Response! - Your Client!" in my headers field? - I’m not sure if I have this ‘User-Agent’ field in ky.

I am using Nuxt.js/$http - which is using the new ky module.

20

Looks like ky doesn’t have an option for setting request headers, although some GitHub issues that I’ve come across suggests using something like this:

ky.extend({
    headers: { 'User-Agent': 'Get REST APi Response! - Your Client!' }
});
1 Like