Questions about backend.js and frontend folders in Twitch Extension

Extensions
1

Hey!
So, I’m trying to build my first twitch extension and as a starter I have some questions that after some time of research I couldn’t find the answer for.

  1. I’ve seen that to upload my extension to the hosted test, I can’t zip the folder itself and instead I need to zip the files. But can I create subfolders for my frontend such as js/ or css/ to organize my files and zip them or do I need to leave all .js and .css in the same folder as the .html?

  2. After uploading the files to the hosted test, I get the following error on the console when configuring the extension:
    Refused to load the script 'https://code.jquery.com/jquery-3.3.1.min.js' because it violates the following Content Security Policy directive: "script-src 'self' https://w1ftsfbmgyeebwfa503m3gwv5ayd4t.ext-twitch.tv https://extension-files.twitch.tv https://www.google-analytics.com". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.
    And then since it couldn’t import jQuery, after that I get errors from the “$” in the code. Why is that happening?
    I import this file in the html’s the same way the example I downloaded does
    <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>

  3. This is a bit of a silly question but for the backend.js, do I need to upload it to twitch together with the frontend or do I need it in my own server?

Thanks a lot!

2

  1. Yes, you can use folders to organise files. Your HTML files need to be at the root of the zip but those HTML files can reference things inside a folder, just make sure you use relative paths and not absolute paths.

  2. You can’t load code from external sources. The only exceptions are Google Analytics and the Twitch Extension Helper itself. All other files (and this includes libraries such as jQuery) you have to include in your zip.

  3. Twitch only host the front end, the EBS is entirely up to you to host and ensure it meets Twitch’s guidelines (such as only communicating with the frontend over HTTPS or WSS).

1 Like
3

That was perfect! Thanks a lot.