How can I run Javascript code from duplicated Scratch website?

Jack Ro 0
Viewed 31

I'm trying to duplicate Scratch website and run it locally

https://scratch.mit.edu/projects/editor/?tutorial=getStarted

I downloaded all of the files including HTML, CSS and JS by HTTrack website copier but when I run the index file, the browser shows nothing but a blue background. I figured out it is a JavaScript Application and thought I should run JavaScript file too, but I don't know how I can run it. I also tried downloading website code by source download supported by the browser, but the website doesnt function correctly, for example the drag and drop doesnt work. (I have already tried to run the downloaded folder with react, but it shows me npm ERR! code ENOENT error. I'm not sure if I'm doing it correctly)

Home directory

Scratch directory inside Home directory

Hts-cache

Scratch.mit-edu directory

JS directory

Can anyone help me?

httrack reactjs javascript css html
2 Answers

This should work

<iframe allowtransparency="true" width="485" height="402" src="//scratch.mit.edu/projects/embed/XXXXXX/" frameborder="0" allowfullscreen>Not working sorry</iframe>

kitis0

The Wrong Way

This is not the right way to go about what you're trying to do. Downloading source code straight from the browser only gives you, at best, half the picture. That is it only provides the HTML and JS code being used on the page, and potentially, depending on how you sourced the data, not even the full story there. A lot, if not most, of that code will be dependent on how it is being served. Cookies, Sessions, API endpoints, etc are all information that cannot be reproduced simply by copying the source code from the browser.

The IFrame Way

So what can you do? If the full source is not available in any way, and the site doesn't provide any embed feature or API for use, your best option is to try the iframe approach as kitis suggested. This can have it's own set of challenges, however, depending on how you serve the page. The biggest challenge you will likely face is cross-domain security blocks that are designed to prevent malicious script from being executed by a remote host. There are other pitfalls and plenty of discussion on this topic elsewhere on stackoverflow, so suffice it to say just this on the topic: If you have no other option, try iframe. It might work, it might not, but if you do run into problems, you might be able to get more help when you have a more specific problem.

The Right Way

Thankfully in our case the code you want to copy is already freely available as an opensource project on github. Simply follow the instructions in their readme and you'll be running with your own local copy of scratch in less time than it took for me to write this response. You'll need to have node installed to make it work. You can find plenty of tutorials on that topic all over google.

richbai900
Related