Fusion.js provides an RPC plugin that integrates with Redux and React. We recommend using that RPC plugin rather than writing HTTP endpoints manually.
HTTP endpoints can be created by writing a Fusion.js plugin with an exposed middleware:
To write a middleware plugin, we export a factory function that returns a middleware function. The middleware receives a ctx
argument that has various properties, and a next
function that it must call. It works the same way as a Koa middleware.
Let's say we want to implement a GET /api/ping
endpoint. This endpoint simply responds with {ok: 1}
. To do that, we check that the method
and path
are correct and we set body
to the data we want to return:
// src/plugins/example.js
import {createPlugin} from 'fusion-core';
export default createPlugin({
middleware() {
return (ctx, next) => {
if (ctx.method === 'GET' && ctx.path === '/api/ping') {
ctx.body = {ok: 1};
}
return next();
};
},
});
There's one issue left with the code above: Fusion.js code runs universally by default, but we only want to run that code in the server. To do so, add a code fence:
// src/plugins/example.js
import {createPlugin} from 'fusion-core';
export default __NODE__ &&
createPlugin({
middleware() {
return (ctx, next) => {
if (ctx.method === 'GET' && ctx.path === '/api/ping') {
ctx.body = {ok: 1};
}
return next();
};
},
});
Next, register the plugin:
// src/main.js
import App from 'fusion-react';
import Example from './plugins/example';
export default () => {
const app = new App();
app.register(Example);
return app;
};
That's it! Now, you can test your new endpoint. From your browser developer console:
fetch('/api/ping')
.then(r => r.json())
.then(console.log); // {ok: 1}
Let's implement POST /api/echo
, which responds with the body of a request. To do that, we can use the koa-bodyparser
package:
import bodyParser from 'koa-bodyparser';
export default __NODE__ &&
createPlugin({
middleware() {
const parseBody = bodyParser();
return async (ctx, next) => {
if (ctx.method === 'POST' && ctx.path === '/api/echo') {
await parseBody(ctx, () => Promise.resolve());
ctx.body = ctx.request.body;
}
return next();
};
},
});
Notice that we await parseBody()
because body parsing is asynchronous. You can similarly await other asynchronous calls such as database calls or microservice requests.