I'm currently working on developing an Angular application that will be hosted on my GitHub pages using a custom verified domain.
Below is the code I am using to call the GitHub API in order to obtain the zip archive of one of my (public) repositories:
public getTemplate() {
return this.http.get(
'https://api.github.com/repos/crystal-nest/cobweb-mod-template/zipball/1.20.4',
{
headers: {
'X-GitHub-Api-Version': '2022-11-28'
}
}
);
}
I have verified that the URL is correct because when I paste it directly into my browser, the download process initiates successfully.
However, upon execution of the code, I encounter the following error message:
Access to XMLHttpRequest at 'https://codeload.github.com/Crystal-Nest/cobweb-mod-template/legacy.zip/refs/heads/1.20.4' (redirected from 'https://api.github.com/repos/crystal-nest/cobweb-mod-template/zipball/1.20.4') from origin 'https://crystalnest.it' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
To address this issue, I attempted to make JSONP requests as described here:
return this.http.jsonp('https://api.github.com/repos/crystal-nest/cobweb-mod-template/zipball/1.20.4', 'callback');
Unfortunately, this approach led to a different error:
{
"headers": {
"normalizedNames": {},
"lazyUpdate": null,
"headers": {}
},
"status": 0,
"statusText": "JSONP Error",
"url": "https://api.github.com/repos/crystal-nest/cobweb-mod-template/zipball/1.20.4?callback=ng_jsonp_callback_0",
"ok": false,
"name": "HttpErrorResponse",
"message": "Http failure response for https://api.github.com/repos/crystal-nest/cobweb-mod-template/zipball/1.20.4?callback=ng_jsonp_callback_0: 0 JSONP Error",
"error": {
"message": "JSONP injected script did not invoke callback.",
"stack": "Error: JSONP injected script did not invoke callback.\n stacktrace omitted for the sake of brevity"
}
}
You can find my code here, and view a live example here (simply click the download button and disregard everything else, as the website is still a work in progress).
On a side note: even if the retrieval of the file as an 'arraybuffer'
were successful (the necessary data format for processing with JSZip), it remains inconvenient that the appended code in the zip name and its root directory are unpredictable. Ideally, I would prefer to use the following URL
https://github.com/crystal-nest/cobweb-mod-template/archive/refs/heads/1.20.4.zip
due to its predictable naming convention making processing easier.