How to upload file contents into variable Javascript/HTML?

Question

I'm making a script that uploads a script, or "payload" to a site with these steps:

1. User enters URL with * in place of query
2. User selects payload, which is simply a file with a pre-written JS script.
3. The * is replaced with the contents of the payload.
4. The URL with a script replacing the query is opened in an iframe.

How would I do this? My main problem is the file-uploading-into-variable part. Here's my code so far:

<!DOCTYPE html>

<html>

  <head>

    <title>Slingshot.XSS</title>

  </head>

  <body style="font-family:monospace;" align="center">

    <h2>Slingshot.XSS</h2>
    <h3>Slingshot.XSS is a script that launches pre-loaded XSS payloads at a target to test its vulnerabilities.</h3>
    <h4>Please report all issues to <a href="https://github.com/keeganjk/slingshot.xss/issues"></a> or contact me at [email protected].</h4>
    <a href="github.com/keeganjk/slingshot.xss" style="font-family:monospace" align="center">Source Code / Learn More</a>
    <br />

    <h4>Enter a URL with <b>*</b> in the place of query.</h4>
    <h5>Example: https://www.google.com/#q=*</h5>
    <input type="text" id="myText" placeholder="Enter a URL"> <button onclick="myFunction()">Submit</button>
    <p id="demo">No Submitted URL</p>

    <h4>Select a payload:</h4>
    <input type="text" id="myPayload" placeholder="Enter payload path"> <button onclick="selectPayload()">Submit</button>


    <script>

      function myFunction() {

        var errors = [];
        var x = document.getElementById("myText").value;

        if ( !x.includes("http://") && !x.includes("https://") ) {

          errors.push('missing HTTP or HTTPS in URL');

        }

        if (!x.includes("*")) {

          errors.push('missing * in place of query')

        }

        // Renders errors
        if (errors.length) {

           x = 'Error: ' + errors.join(', ') + '!'; 

        }

        document.getElementById("demo").innerHTML = x;

        }

      function selectPayload() {



      }

    </script>

  </body>

</html>

How would I let the user browse through files and then select one and upload it to a variable?

Which files are you referencing? What is being uploaded?

guest271314
– guest271314

2017-04-28 00:22:41 +00:00
Commented Apr 28, 2017 at 0:22 — guest271314
– guest271314, Commented Apr 28, 2017 at 0:22

david25272 · Accepted Answer · 2017-04-28 00:35:57Z

2

First, change the type attribute of your input tag to be "file", e.g.:

<input type="file" id="file">

Then create a filereader:

var fr = new FileReader();

Since the file will be read asynchronously, you should add a callback to proceed further, e.g. something like:

fr.onload = function(){... do something ...};

To read the file call readAsText (for example, add this to an onclick event):

fr.readAsText(document.getElementById('file').files[0]);

Once the file has been loaded the content will be a string in fr.result.

MDN has more documentation and examples.

answered Apr 28, 2017 at 0:35

david25272

9546 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

anonymous Over a year ago

This is kind of vague... Could you go into more detail?

david25272 Over a year ago

Which parts are vague/where do you want more detail?

anonymous Over a year ago

Maybe just add a full block of code putting all the parts together.

Collectives™ on Stack Overflow

How to upload file contents into variable Javascript/HTML?

1 Answer 1

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Linked

Related