tooling to bundle a browser build #1253
Open
+6,842
−1
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
* uses WebPack to bundle the library into a single JS file,
which can be downloaded by web browsers from a CDN
* same-origin policy requires that this library
can only be called from a page hosted by 'youtube.com',
which limits the use-cases for this build to mainly:
- browser extensions
- userscripts
status:
=======
* the example userscript indicates that the Promise returned from:
window.ytdl.getInfo(window.location.href)
catches an Error caused by the server response status code: 410
* the corresponding request looks OK:
https://www.youtube.com/get_video_info?video_id=...
but something is clearly breaking;
a closer look is required.
* the issue was the dependency: 'miniget'
- it performs a GET request,
with some configurable behavior
- it uses several native node modules,
for which I had previously included polyfill libraries
- ultimately, it just wasn't working
- I replaced it with a mock implementation,
which uses 'window.fetch' to perform the network request
status:
=======
* the example userscript works great
add support for:
options.requestOptions.headers
options.requestOptions.proxyUrl
options.requestOptions.debug
example:
========
window.ytdl.getInfo(
'https://www.youtube.com/watch?v=CICY20dQUPk',
{
requestOptions: {
headers: {"x-requested-with": "ytdl-core"},
proxyUrl: "https://cors-anywhere.herokuapp.com/",
debug: false
}
}
)
where:
======
https://cors-anywhere.herokuapp.com/corsdemo
test temporary access to demo proxy server:
===========================================
{
const proxy = 'https://cors-anywhere.herokuapp.com/'
const target = 'http://httpbin.org/get'
const url = proxy + target
fetch(url, {headers: {"x-requested-with": "ytdl-core"}})
.then(req => req.text()).then(console.log)
}
related:
========
* using with proxyAgent in node
https://github.com/fent/node-ytdl-core/blob/v4.11.5/example/proxy.js
* using with proxyUrl in browser
https://www.npmjs.com/package/ytdl-core-browser
https://www.npmjs.com/package/ytdl-core-info-browser
notes:
======
* 'cors-anywhere' limits 50 requests per hour per URL origin
- apparently, this count is not per-user
- as such, the example userscript tests on a low-traffic domain:
'example.com'
* using a proxyUrl, such as 'cors-anywhere', only works on sites
having a permissive CSP that allows cross-origin fetch
to 'www.youtube.com'
- for example, it won't work on 'github.com'
|
note (to self):
|
in addition to the existing es2020 target, add a new es5 target.. along with examples.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Admittedly, a browser build is limited in where and how it can be used (ie: CORS and CSP restrictions).
However, when wanting to write a browser extension or userscript that runs on the 'youtube.com' domain.. it's super useful.
You do a great job in keeping this library up-to-date, as Youtube makes occasional breaking changes.
It would be so nice for you to be able to say to such developers:
release a minor version bump to trigger a fresh download