Hello I have to admit that I have been solely developing on the freshworks platform that I have seemed to lost my touch utilizing 3rd party libraries like Axios.
My issue is that for a front-end application I am trying to simply make a GET request to the freshchat API and when I run my application locally using ?dev=true I get the following error
I have installed axios via npm, it created the package-lock.json file here
The application then is ran in the test environment but fails to the above error claiming that “require is not defined”. I am sure it is something simple but what am I missing here? Does this library work in the locally served test environment as part of FDK?
As far as I know, it’s not possible to use libs on the front end.
When you declare a lib in manifest, you are declaring it to use on the server side.
To use axios from frontend, you could export a function from serverless that uses it and then call it via SMI from frontend.
That would make sense, as I was looking at past applications where I have been successful in using Axios and realized they are all serverless applications. I will have to do some research as I am not fluent in using SMI. I appreciate your help and the quick response.
Might I suggest you explore the newly added frontend frameworks support to the FDK, this might help you in using npm libraries in a react or a vue application,
Wow you guys are awesome. I love how responsive this community is!!! Thank you for all the suggestions and I will take a look at each. I am pumped that there looks like there will be a viable solution for my use case. Maybe it’s time to learn React and Vue
@velmurugan, is the ability to create react applications available for the freshchat platform? When I run fdk create and select that product, there isn’t an available selection for react or vue templates.
@Zach React and Vue frameworks are supported for all the products. It is just the template is not available when choosing Freshchat.
You can create a Freshdesk app and change the product and the placeholder in the manifest.json post the app creation.
If you are going to use Axios to make API requests with an API key from the secure installation parameter, you would have to forego the secure attribute and expose the API key in plain text in the developer tools while making API requests.
So, I would recommend making use of Server Method Invocation to make API requests with any secure installation parameters since they will be available in the argument for the serverless function. Axios can be easily imported after mentioning in the manifest.json as a dependency. This sample app shows exactly the same flow but uses a different library to make API.
While this is indeed the best approach in my opinion, the 5s timeout for SMI kind of make it impossible to use for some use cases.
Hopefully the team will take this feedback in consideration
@Raviraj, @samuelpares, and @velmurugan, Thank you so much for the information and explanations. I will work this out and be sure to reference any further inquires in this thread. Appreciate you all taking the time to help find a reasonable solution.
I am struggling to figure out how to pass the api key in the options object for SMI. When I get the server response it does show the iparams object but its empty.
I have this set in the iparams.json file
And this is what I have so far in the app,js file to make the request to the server.js file
What would the code need to look like for the iparams object sent as the options argument, right now its just an empty string because trying to use something like <%= iparam.apiKey %> didn’t work. Thank for any help offered.
You don’t need to send it from frontend.
Automatically it’s added on the payload received from the server method.
So on the server side, you can just use it like you said
