This package provides the following services:
service-fetch
Provides the fetch API through a web worker
Installation
Package Manager
Install service-fetch
from the editor's Package Manager or the command-line equivalent:
$ ppm install service-fetch || apm install service-fetch
Using Git
Change to your packages directory:
Windows
# Powershell
$ cd $Env:USERPROFILE\.atom\packages
:: Command Prompt
$ cd %USERPROFILE%\.atom\packages
Linux & macOS
$ cd ~/.atom/packages/
Clone the repository as service-fetch
:
$ git clone https://github.com/idleberg/atom-service-fetch service-fetch
Install dependencies:
$ cd service-fetch
$ ppm install || apm install
Build source:
$ ppm run build || apm run build
Usage
This is an experiment
Have you ever thought that your Atom package should perform HTTP requests using web workers? Would it be great if you could use the standard Fetch API and something would handle the web worker part for you?
This package is service provider that aims to achieve that. You use a common interface, the services handles the rest. Let's take a look at this through an example implementation.
To consume the service in your package, add the following to your package.json
:
"consumedServices": {
"service-fetch": {
"versions": {
"0.2.0": "consumeFetch"
}
}
},
"package-deps": [
{
"name": "service-fetch"
}
]
Install atom-package-deps
to handle the package dependency and any fetch implementation for NodeJS as a fallback for when the service is unavailable:
Example:
npm install atom-package-deps cross-fetch
Next up, let's create a package:
import { CompositeDisposable, Disposable } from 'atom';
import crossFetch from 'cross-fetch';
export default {
// Fallback implementation for when the service is unavailable
fetch: crossFetch,
// Consume the service
consumeFetch(fetchService) {
this.fetch = fetchService;
return new Disposable(() => {
this.fetch = null;
});
},
// Optional: Add a demo command
activate() {
this.subscriptions = new CompositeDisposable();
this.subscriptions.add(
atom.commands.add('atom-workspace', {
"my-package:fetch-demo": async () =>
await this.demoCommand(),
})
);
},
async demoCommand() {
const response = await this.fetch('https://atom.io/api/packages', {
headers: {
'Accept': 'application/json'
}
});
console.log(await response.json());
}
};
⚠️ Due to the limitations of event messages, the response only contains the method matching the Accept
header:
Accept | Response Method |
---|---|
application/json |
response.json() |
application/octet-stream |
response.arrayBuffer() |
multipart/form-data |
response.formData() |
text/* |
response.text() |
When no Accept
header has been specified, application/json
will be used as default.
Again, this is an experiment. I'm not sure where this is going, but I'm looking forward to your feedback!
License
This work is licensed under the MIT License