JSON - Sending a request to Neopets through Chrome

[Peaches_and_Mocha]

Hi there,

I'm interested in getting into coding and wanted to start by learning how to send requests to Neopets through Chrome. I am trying to send a request to the rewards page for the wheel of monotony in response to the auto-play link no longer working

Please log in to view spoilers.

There are a few things I want to achieve here

1. Understand how the autoplay link worked originally (note the amfphp and json.php requests in the above link)
2. Understand how to create my own unique request through the JS console

So far, my understanding is that the above link was a pre-made request that could be used to redirect the user to the rewards page without having to wait. Now that it has been patched by TNT, I have to make a request from my personal client

However, I don't understand the language that I need to input into the JS console to get to that point. What are the values/keys that I need to include so that I can be redirected to the rewards page? Also, how does AMFPHP and JSON come into play here?

Inspecting the source code provides me with this information:

Please log in to view spoilers.

The fetch and POST (methods?) caught my eye and led me to believe that it has something to do with it. Is this something I would include in my request?

[Bat]

1. The very first rendition of this trick immediately awarded the prize without bothering to check whether or not you had previously spun or waited the for the duration of spin cycle. While the Neopets team eventually modified the page to require waiting for the spin cycle to complete, they didn't add any additional verification for how you navigated to the page, so spinning and collecting your prize simply required you to visit the page twice. Once to trigger the spin, and once after the spin completed to claim your prize.
   
   
2. The new page is coded to require the POST verb when navigating, the XMLHttpRequest header, as well a url encoded payload containing instructions telling the page what action to perform in order to spin or claim your prize. The code in your screenshot is not relevant to the Wheel of Monotony - it's code from an unrelated webpage that the Neopets team accidentally left behind when they copied the source to create the new Wheel of Monotony page. The source code you're looking for is in wheelgame.js. You'll want to recreate the functions in that source code in order to trigger a spin and prize collection based on the result of the spin.

[Peaches_and_Mocha]

1. The very first rendition of this trick immediately awarded the prize without bothering to check whether or not you had previously spun or waited the for the duration of spin cycle. While the Neopets team eventually modified the page to require waiting for the spin cycle to complete, they didn't add any additional verification for how you navigated to the page, so spinning and collecting your prize simply required you to visit the page twice. Once to trigger the spin, and once after the spin completed to claim your prize.
   
   
2. The new page is coded to require the POST verb when navigating, the XMLHttpRequest header, as well a url encoded payload containing instructions telling the page what action to perform in order to spin or claim your prize. The code in your screenshot is not relevant to the Wheel of Monotony - it's code from an unrelated webpage that the Neopets team accidentally left behind when they copied the source to create the new Wheel of Monotony page. The source code you're looking for is in wheelgame.js. You'll want to recreate the functions in that source code in order to trigger a spin and prize collection based on the result of the spin.

This is tricky. I combed through the code a couple times and a couple things I noticed:

1. The first section of the code includes a list of variables, three of which I have the option to change from false to true

Please log in to view spoilers.

2. There is another variable later on in the code titled gameOptions.monotony. This seems like an important variable to get the wheel to actually spin

Please log in to view spoilers.

Please log in to view spoilers.

3. gameOptions.monotony is also a requirement, and asks that the var wheelMonotonyDone be set to true

Please log in to view spoilers.

4. Just after the process WheelDone string, the function this.canSpin is set to false


I'm thinking to start the spinning, I set this.canSpin to true, and wheelMonotonyDone to true, that should get it to work.

So I tried it, and it didnt work. This error came up

Please log in to view spoilers.

So I looked for playGame and this is all I could find

Please log in to view spoilers.

So I'm stuck again. Do you know what the error means?

[Bat]

That series of variables controls which functions are called when the player interacts with the wheel, and what sort of visualizations are happening in the wheel scene. If your goal is to control the wheel scene itself through automation, then you'll want to work your way backwards from the buttons on the page that cause the wheel to perform an action. For example, you can figure out how to spin the wheel programmatically automatically by observing the code that is executed when you press the "Spin the Wheel" button. Trigger the event that causes the wheel to spin and you're good to go. If you're not interested in seeing the wheel spin, then all you need to do is follow the aforementioned trigger back to the source and replicate what that code is doing with its server submission process. Duplicate that code, submit the server commands, then wait and collect based on the server response.

[Peaches_and_Mocha]

That series of variables controls which functions are called when the player interacts with the wheel, and what sort of visualizations are happening in the wheel scene. If your goal is to control the wheel scene itself through automation, then you'll want to work your way backwards from the buttons on the page that cause the wheel to perform an action. For example, you can figure out how to spin the wheel programmatically automatically by observing the code that is executed when you press the "Spin the Wheel" button. Trigger the event that causes the wheel to spin and you're good to go. If you're not interested in seeing the wheel spin, then all you need to do is follow the aforementioned trigger back to the source and replicate what that code is doing with its server submission process. Duplicate that code, submit the server commands, then wait and collect based on the server response.

How do you observe the code? I've tried console.log but nothing seems to be working

[Bat]

How do you observe the code? I've tried console.log but nothing seems to be working

When the code is executing server submissions and waiting on replies, you can follow it back to the source by using the call stack in the "Network" tab. You can also use the "Debug" tab to insert breakpoints in the code to pause it during execution and observe the current context. I'm not sure what you're trying to do with console.log, but if you're trying to dump the variables created in the window context, then you could need to reference them by name. For example, console.log(game) will dump the declared Phaser wrapper for the wheel, but you can't interact with the private functions like setWheelInteraction contained within the playGame class that way. You would either need to replicate the playGame class and expose those functions yourself, hijack the private context where those functions were created, or simply trigger the events on the html elements in the interface that call back to those private functions, effectively remote controlling the wheel with code.

[Peaches_and_Mocha]

When the code is executing server submissions and waiting on replies, you can follow it back to the source by using the call stack in the "Network" tab. You can also use the "Debug" tab to insert breakpoints in the code to pause it during execution and observe the current context. I'm not sure what you're trying to do with console.log, but if you're trying to dump the variables created in the window context, then you could need to reference them by name. For example, console.log(game) will dump the declared Phaser wrapper for the wheel, but you can't interact with the private functions like setWheelInteraction contained within the playGame class that way. You would either need to replicate the playGame class and expose those functions yourself, hijack the private context where those functions were created, or simply trigger the events on the html elements in the interface that call back to those private functions, effectively remote controlling the wheel with code.

Sorry, I am confusing myself with the console.log then. I tried to look up "button clicking function" on google and thats what came up.

I couldnt find a callback dropdown under Network but I found one under Source

I looked at the call stack and tried it in 3 different spots. First upon page refresh with the debugger paused, then I unpaused it but didn't spin the wheel, then i clicked the button to spin the wheel

upon refreshing the page with debugger paused

Please log in to view spoilers.

upon unpausing debugger and repausing

Please log in to view spoilers.

upon spinning the wheel

Please log in to view spoilers.

In Network, I found this

Please log in to view spoilers.

When I tired to copy and paste the URL into chrome, I got a request denied response.


How do I go about interpreting these results? Also, you mentioned replicating the playGame class to expose the functions. How would I do that?

[Bat]

Pausing the debugger at random times isn't guaranteed to catch the code you're targeting in the process of performing an operation. You'll want to specifically set breakpoints on line numbers in code in order to catch that code in action and observe the state of the variables. If you're unsure about what code to observe, then you can use the "Stack Trace" tab by selecting the server submission in the "Network" tab to walk backwards through the functions that were called prior to submitting. In the case of the Wheel of Monotony, the call stack should end in jQuery, but a few steps back should land you in wheelgame.js. That's where you need to be inserting breakpoints if you'd like to observe the wheel's inner workings. You can also use the inspector in your developer tools to find elements in the page that interact with the wheel, like the "Spin the Wheel" button, then check which events are tied to that element. The same is true with any code that you're unfamiliar with: try to find the action that sets the code in motion, then work from that.

You can't navigate to the url on its own to execute the wheel actions. You need to recreate the POST process that I mentioned previously in (you need an account to see links).

You can replicate the playGame class in a number of different ways. For example, you can intercept the load request for wheelgame.js, load it in yourself as plain text, inject your own code into it to manipulate the functions, then execute the code as though it had been loaded normally. That would give you direct control of every action the wheel performs. It's a good option if you want to have direct interaction with the parts of the code that render the wheel actions visually.

The easier option would be to trigger a click event on the button that starts the spin action, but given that you've been asking a lot of technical questions about the code, I'm not sure if that's what you're going for.

[Peaches_and_Mocha]

Pausing the debugger at random times isn't guaranteed to catch the code you're targeting in the process of performing an operation. You'll want to specifically set breakpoints on line numbers in code in order to catch that code in action and observe the state of the variables. If you're unsure about what code to observe, then you can use the "Stack Trace" tab by selecting the server submission in the "Network" tab to walk backwards through the functions that were called prior to submitting. In the case of the Wheel of Monotony, the call stack should end in jQuery, but a few steps back should land you in wheelgame.js. That's where you need to be inserting breakpoints if you'd like to observe the wheel's inner workings. You can also use the inspector in your developer tools to find elements in the page that interact with the wheel, like the "Spin the Wheel" button, then check which events are tied to that element. The same is true with any code that you're unfamiliar with: try to find the action that sets the code in motion, then work from that.

You can't navigate to the url on its own to execute the wheel actions. You need to recreate the POST process that I mentioned previously in (you need an account to see links).

You can replicate the playGame class in a number of different ways. For example, you can intercept the load request for wheelgame.js, load it in yourself as plain text, inject your own code into it to manipulate the functions, then execute the code as though it had been loaded normally. That would give you direct control of every action the wheel performs. It's a good option if you want to have direct interaction with the parts of the code that render the wheel actions visually.

The easier option would be to trigger a click event on the button that starts the spin action, but given that you've been asking a lot of technical questions about the code, I'm not sure if that's what you're going for.

Sorry, I'm asking a lot of technical questions because I don't have much experience with code so I don't know what I'm doing. A lot of your verbiage was completely new to me so I've been trying things in an attempt to follow your directions.

I want to figure out how to trigger a click event and bypass the wait time so that I get instant results.


I found the piece of code that triggers the click,

document.getElementById("wheelButtonSpin").onclick = function ()

How do I get it to trigger on its own? I tried changing it to:

document.getElementById("wheelButtonSpin").click()

but nothing happened

[Bat]

You're overwriting the click event handler assigned to the button by playGame by setting your own click event handler that way. If your goal is to spin the wheel, then just call wheelButtonSpin's click function without setting the onclick function.