Description
Hi all,
I was looking at the documentation and some other suggestions in the issues list about how to inject new headers to Formio requests (more specifically when you want to use the Resources in a select Data Source Type, for example).
I know that I can set the formioToken and then use x-jwt-token in my backend, which would work fine for me if I didn't need to also have some other params passed along with the request (like location id, warehouse id, etc) that are selected in the frontend.
I tried a few different ways, but none of them worked. After implementing them, when I go to the form builder and select the Resources option in Data Source Type, it just doesn't trigger the http request anymore, if I remove those implementations then it comes back sending the request but, of course, without the headers I want to add.
Here's how I'm doing using Fetch API plugin:
`import { Formio } from 'formiojs';
const FetchPlugin = {
priority: 0,
preRequest: async (url, method, request, formio) => {
// Assuming you can get the JWT token asynchronously from your state
const jwtToken = await asyncFunctionToGetToken();
request.headers.set('Authorization', Bearer ${jwtToken}
);
return Promise.resolve(request);
},
};
Formio.registerPlugin(FetchPlugin);`
and here's another try using it right before I call the FormEdit component:
Formio.plugins = [{ priority: 0, requestOptions: function (value) { // Assuming you already have the token const jwtToken = state.userReducer.authJWT; value.headers.append("Authorization",
Bearer ${jwtToken}); return Promise.resolve(value); } }];
I also tried creating a XMLHttpRequest interceptor, but am having the same symptom.
The versions I'm running are @formio/react 5.3.0 and formiojs 4.17.1
Any ideas I can do that (so I don't need to use the x-jwt-token header) or how can I add new parameters (such location id and some other ids that are referenced in the frontend)?