I need a bit of help making this Catalog script

  1. What do you want to achieve? Keep it simple and clear I need a little help on making a script for my gui.

  2. What is the issue? Ok so, as you can see right here I have a catalog gui made and i need a little bit of help on being able to have only gears in it, and nothing else.


    https://gyazo.com/233bcff0b0613a370f6e34336da125e9

I want it similar to the game “Catalog Heaven” but instead of the whole catalog, only gears.


https://gyazo.com/45908cda39af2d2d53b231bdc7f599a4

  1. What solutions have you tried so far? I haven’t tried anything so far, that’s why i am searching for a bit of help. You do not need to send me a script for it.
4 Likes

Introduction

Ok so, here’s the thing. Typically, roblox doesn’t allow you to use their own API from roblox. You’ll have to get a little bit hacky with JavaScript.

Fortunately enough, there’s a website for FREE JavaScript app hosting. It’s called glitch. You can do this very simply using a library called request and the built in node.js library called http.

Setting It Up

First, once you’ve signed up: Create a new hello-express app.
Secondly, clear out the server.js and go to package.json.
Once you’re in package.json, you will want click Add Package.
Search “request” and click it. It should install. Once you’ve done that, you should delete the folders called “/views” and “/public”.

Adding Packages




JavaScript Code

You can now type this code into the file called server.js

const http = require("http");
const request = require("request");

http.createServer((req, res) => {
  try {
    let url = request.get("https://www.roblox.com" + req.url);
    url.on("response", response => {
      if (response && response.headers) {
        url.pipe(res);
      }
    });
  } catch (e) {
    res.write(e);
    res.end();
  }
}).listen(process.env.PORT, () => console.log("listening on " + process.env.PORT))

Done! Now you can go to https://yourapp.glitch.me/catalog/json (replace yourapp with the name of your app)
and you can view the api of the catalog!

Alternatively, you can use my app for this and copy it: app link

Roblox End

On roblox, you can use HttpService on the client and get the items on the server. Keep in mind, I’m on mobile so I can’t show you what it will look like.

local HttpService = game:GetService("HttpService")
local ReplicatedStorage = game:GetService("ReplicatedStorage")

local RemoteFunction = ReplicatedStorage:WaitForChild("RemoteFunction") -- change the name to your liking, also don't forget to create a RemoteFunction

local appName = "robloxdevforumproxy" -- replace it with your app
local baseUrl = "https://" .. appName .. ".glitch.me/catalog/json"

function RemoteFunction.OnServerInvoke()
	return HttpService:JSONDecode(HttpService:GetAsync(baseUrl))
end
local ReplicatedStorage = game:GetService("ReplicatedStorage")
local RemoteFunction = ReplicatedStorage:WaitForChild("RemoteFunction") -- change the name to your liking, also don't forget to create a RemoteEvent

local CatalogApi = RemoteFunction:InvokeServer() -- returns a list, use this to duplicated ui elements to your liking.
local GearFrame = script.Parent.GearFrame

Conclusion

Anyways, you can learn about the catalog api here:

Feel free to ask me any questions if you have any! :slight_smile:

7 Likes

Appreciate it, i’ll ask you questions if needed.

1 Like

Do you mind dming me on discord?

I don’t have access to discord right now, unfortunately I can’t help you on there. :frowning:

How would you iterate through pages in the local scripts CatalogApi table when your results are limited to ten?

Very nice script and great explanation. But this will only be able to reach www.roblox.com and not the other api’s like auth.roblox.com or economy.roblox.com.
Or the External Catalog Queries | Documentation - Roblox Creator Hub

I made a small very change the server.js script for anyone who needs this.
You can now add the target api in the header:

JavaScript Code

const http = require("http");
const request = require("request");

http.createServer((req, res) => {
  try {
    const requestedTarget = req.headers['proxy-target'];
    let url = request.get("https://"+ requestedTarget + req.url);
    url.on("response", response => {
      if (response && response.headers) {
        url.pipe(res);
      }
    });
  } catch (e) {
    res.write(e);
    res.end();
  }
}).listen(process.env.PORT, () => console.log("listening on " + process.env.PORT))

Roblox End

local appName = "robloxdevforumproxy" -- replace it with your app
local url= "https://" .. appName .. ".glitch.me/catalog/json?CatalogContext=2&Category=4&PxMax=1000"
local sendHeaders = {
	["proxy-target"] = "search.roblox.com"
}
local response = HttpService:RequestAsync({Url = url, Method="GET", Headers = sendHeaders})
print(response)

for people who need a more complex proxy with more protocols etc. try this: ProxyService by Froast

1 Like