Developing A Footlocker IL Alert Bot - From Proccess of thinking To Code

Note: Don't be afraid to google something you don't understand, that's how you learn new stuff.

Hello everybody, my name is Itay and I decided to publish my first blog post about making a footlocker alert bot, from my perspective of thinking to actually coding. I would make a general guideline of approaching rather then the full coding process.

On one of the days of my first semester as SE student, I was curious about how people get a chance at getting shoes from footlocker's website as the shoes gets out of stock really fast, moreover sometimes they don't even publish the release on their Instagram (Internal workers launches?, you will decide yourself). 

Why not make something automatically that will alert me that there has been a launch of new shoes and give me a fair chance of getting a pair. (By the way the process is almost identical to every site, unless the DOM is manipulated by Javascript and then we would have to use selenium library to execute our plan).

Alright, so I jumped to inspect the site under https://www.footlocker.co.il/release

First thing I noted that every new shoe is on a different element, opening the devtools and inspecting the

DOM and HTTP response in the network tab :

DOM:

HTTP response:

I could actually see that the DOM is generated by Javascript, which means we can't make a simple Python script parsing the HTTP response of the website without the Selenium library to follow if a new element (new shoe) is added and even then, we can see that there is a label on it which says "Coming Soon" so additional checks would be needed.

We can see the label of "Coming Soon", and the general idea of checking 
new shoe element in the DOM.

We cant make simple HTTP request unless we can get the API that provides the information about launches, and if we won't be able to find it, we would have to use selenium. jumping to the network tab in the devtools, see what AJAX requests are being made by the browser.

After some inspections about the requests that are being sent, I found the API that is responsible for the releasing of stock😶:

The general idea would be to make an HTTP request to the API with a legit user-agent (I have encountered several times APIS that blocks illegitimate user-agents), receive the entire HTTP JSON response and check if new shoe is added.

Starting to actually code, the most fitted coding language I found to that task is Python, as the script would be running repeatedly. We would need some timeout so we won't flood the server with requests, if a new shoe (key pair value) is added to the stock we would like to get notified on Whatsapp/Slack/Discord whatever we have a webhook to..

First of all we would need to make an HTTP request, we would use urllib.request library, after we receive the web request we would want to parse it as lxml, the beautifulsoup4 library would do the job, after we parse it, we would want to search for specific keyword that would indicate a new shoes has been launched to stock, for that we would use regexes which in python is the re library, the time library for timeout between requests and my personal preference for notification would be Discord, so discord_webhook library.

After I have identified which libraries would fit the job, I get to actually coding, I would divide the script to a few functions in addition to the main function, one function that would make an alert to Discord, one function that will actually search in the response if a new shoe has been added.

 Making the request:

Back to our API request, I had to inspect it a bit to see what would indicate a new shoes launch, and as I noted that every new shoe model is indicated by the key "isReleased":

So we would want to split the request by the "isReleased". Alright we now know if a new shoe launch is coming up, now its the time to indicate when it goes for sale, we can see the key "isPublish" which indicates if it did.  

We could just stop here and grab a simple indication such as the name of the model, send it to our alert function and get the job done.

I had to make it a little more prettier so I used regex to grab the existing published models, from there grabbing the picture URL of the shoe, its ID etc..

and assembling all the previous make request and the theory together, we would get the following checkStock() function:

I made an array for the shoes IDs, photos, availability and the indexes of the photos because of unsynchronism between the indexes and the photos.

In the main function we will follow a simple logic to make the request go on and on and check if there is a new shoe in stock. Checking if the productsAvailable is now different than the previousAvailable and then check if its greater, we would then make an alert.

  

30 seconds delay to not make too many requests to the server and in case of encountering some kind of error, 60 seconds would be enough. The sendAlert() function can use whatever webhook you would like to use as I noted previously, Discord/Slack etc..

And our final result:

More interesting task would be to fully automate the process and make a fully automatic purchase script which I might make you a post about it.

Well, with a total of two hours I just needed to get the things work fast as I didn't had much spare time back than (I think my code is poorly written), I hope you learned a few new things and enjoyed my short article, Thank you for your time. 

 

Note: Everything I have done here, I studied independently, using google and online sources only, as I also believe education and knowledge should be free to everyone asking.