Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Using Chrome Developer Tools to hack your way into concerts

Using Chrome Developer Tools to hack your way into concerts

Chrome Developer Tools is magical. It lets you record network traffic, step through code, modify the DOM, and more! To learn when we would use each of these features, I'll walk you through my adventures trying to trick Taylor Swift’s website into giving me concert tickets. Instead of reading through all of the JS files in her site and scrolling through hundreds of useless network activity logs, I learned how to use XHR breakpoints, filter network activity by type and domain, and recreate requests with CURL. I'll show you all of these tools and a few other tricks, and by the end of this talk, you will know how to reverse engineer any website and manipulate it to do your bidding.

Amy Nguyen

March 21, 2018
Tweet

More Decks by Amy Nguyen

Other Decks in Technology

Transcript

  1. Amy Nguyen @amyngyn JSConf AU 2018
    Using Chrome Developer Tools
    to hack your way into concerts

    View full-size slide

  2. Amy Nguyen @amyngyn JSConf AU 2018
    Using Chrome Developer Tools
    to hack your way into concerts
    please don't actually use this information

    View full-size slide

  3. Amy Nguyen @amyngyn JSConf AU 2018
    The Setup
    ● Swifties is selling tickets to Taylor Swift's concert!
    ● The users who watch her music video the most will be
    first in line to buy tickets.
    ● How can we convince Swifties that we have watched
    the music video more times than we have?
    ● (Based on a true story!)

    View full-size slide

  4. Amy Nguyen @amyngyn JSConf AU 2018
    Please raise your hand if you or
    someone near you can't read the
    screen! We can increase the font size!

    View full-size slide

  5. Amy Nguyen @amyngyn JSConf AU 2018

    View full-size slide

  6. Amy Nguyen @amyngyn JSConf AU 2018
    Can we watch the video faster?
    ● Check out the YouTube IFrame Player API!
    ● Open the Console tab and enter this code:
    var data = {
    event: 'command',
    func: 'setPlaybackRate',
    args: [2, true]
    };
    var message = JSON.stringify(data);
    $("#player")[0].contentWindow.postMessage(message, '*');

    View full-size slide

  7. Amy Nguyen @amyngyn JSConf AU 2018
    Can we figure out how the site is communicating
    with the server?
    ● Open the Network tab!
    ● Filter by domain and by XHR
    domain:127.0.0.1
    ● Check out the Initiator column for a stacktrace
    ● Look at both the response and the request data

    View full-size slide

  8. Amy Nguyen @amyngyn JSConf AU 2018

    View full-size slide

  9. Amy Nguyen @amyngyn JSConf AU 2018

    View full-size slide

  10. Amy Nguyen @amyngyn JSConf AU 2018

    View full-size slide

  11. Amy Nguyen @amyngyn JSConf AU 2018
    Can we repeat requests to the server?
    ● Select "Replay XHR" from the menu to repeat the exact
    same request!

    View full-size slide

  12. Amy Nguyen @amyngyn JSConf AU 2018
    Can we make our own requests to the server?
    ● Copy the request as a cURL command and try
    changing it!

    View full-size slide

  13. Amy Nguyen @amyngyn JSConf AU 2018
    Can we send a valid request to the server?
    ● There's something we're missing.
    ● Where is that ID coming from?
    ● To the Sources tab for debugging!

    View full-size slide

  14. Amy Nguyen @amyngyn JSConf AU 2018
    Can we put this all together?
    ● Why can't we get a successful response?
    ● Let's step back and look at the whole timeline of what
    happens in the lifecycle of our video viewing.

    View full-size slide

  15. Amy Nguyen @amyngyn JSConf AU 2018
    Can we automate our solution?
    1. Get a unique ID from the Swifties server.
    2. Send a request to the start endpoint.
    3. Send a request to the count endpoint.
    4. Repeat!

    View full-size slide

  16. Amy Nguyen @amyngyn JSConf AU 2018
    Can we prevent us from happening?
    ● CAPTCHAs
    ● Randomize the DOM
    ● Input validation and detection
    ● Shadow banning

    View full-size slide

  17. Amy Nguyen @amyngyn JSConf AU 2018
    What happened in the end?
    ● I didn't get shadow banned!
    ● I got a high priority position in the sale.
    ● I forgot that I'd have to pay money at some point.
    ● I got offered an internship at TicketMaster??????
    ● I got to give this talk!

    View full-size slide

  18. Amy Nguyen @amyngyn JSConf AU 2018
    It's all about asking questions and being curious.
    ● Can we watch the video faster?
    ● Can we figure out how the site is communicating with the server?
    ● Can we repeat requests to the server?
    ● Can we make our own requests to the server?
    ● Can we send a valid request to the server?
    ● Can we put this all together?
    ● Can we automate our solution?
    ● Can we prevent us from happening?

    View full-size slide

  19. Amy Nguyen @amyngyn JSConf AU 2018
    It's all about asking questions and being curious.
    ● Can we watch the video faster? Execute code in the console
    ● Can we figure out how the site is communicating with the server?
    Filtering out information and debugging intentionally
    ● Can we repeat requests to the server? Replay XHR
    ● Can we make our own requests to the server? Copy as cURL
    ● Can we send a valid request to the server? Request parameters
    ● Can we put this all together? Perseverance!
    ● Can we automate our solution? Scripting
    ● Can we prevent us from happening? Keep asking questions!

    View full-size slide

  20. Amy Nguyen @amyngyn JSConf AU 2018
    Thanks!
    ● Homepage: amynguyen.net
    ● Twitter: @amyngyn
    ● Slides: speakerdeck.com/amyngyn
    ● Code: github.com/amyngyn/swifties
    ● Blog post: here (or at medium.com/@amyngyn)
    ● Stripe is hiring: stripe.com/jobs

    View full-size slide