Unable to change the new CLI src= {{appClient}}} in Index.html file using vue.js file FDK Version 2.3 and node 18

[Freddy (Freddy for Developers)]

Freddy said @Bharath_Raghuraja,

Thank you for providing the console log. The error message with a status code of 400 and the response “error while substituting templates” indicates that there might be an issue with the template rendering or substitution when making an API request.

Please review the following points to troubleshoot this issue:

1. Ensure that your server.js file has the correct implementation of handling $request.invokeTemplate() and the required callback for the function call.

2. Verify that the template syntax for your server.js app.set('views', './server/views', 'ejs'); is correct, and placeholders in the request schema are properly defined and implemented.

3. Make sure that you are passing the correct context to invokeTemplate. Double-check the key names and variable values to ensure they match your request schema.

4. Additionally, check your Freshdesk API Key, ensure it is set up correctly in your code, and is passed correctly to the template.

If you are still facing issues after verifying these points, please consider sharing a minimal code sample or repository demonstrating the issue. This would allow us to provide more specific guidance on resolving the error.

[Bharath_Raghuraja]

@Freddy

We are using the API request in the client file (app.js), not in server.js. For us server.js is working fine.

This is our API function from the app.js

 getContactList: async function (client) {
 
    console.log("EVENT PAYLOAD", client);

    var domainName = client.context.productContext.url;
    console.log("DOMAIN NAME", domainName)
  
    var getContactListPayload = await client.request.invokeTemplate("getContactList", {
      context: {
        domain: domainName,
        apiKey: "DjVMMJR3ofCCKngcepSa"
      }
    });
    console.log("GET CONTACT LISTSSSSSS", getContactListPayload);

This is our schema from requests.js:

"getContactList":{
    "schema":{
        "protocol": "https",
        "method": "GET",
        "host":"<%= context.domain %>",
        "path": "/api/v2/contacts",
        "headers": {
            "Authorization": "Basic <%= encode(iparam.freshdesk_apiKey) %>",
            "Content-Type": "application/json"
        }
    }
},

This is our registered function in the manifest.json

"requests": {
      "getContactList":{},
 },

"functions": {
    "getContactList": {
      "timeout": 20
    }

We are still facing the same error message

[Freddy (Freddy for Developers)]

Freddy said @Bharath_Raghuraja,

Based on the details provided, it seems like the error might be tied to the usage of Vue.js in your project. Here are some steps to troubleshoot this issue:

1. Examine the initialization process of Freshdesk API in your Vue.js app. Make sure the setup is properly configured for Freshworks SDK in the Vue.js app.

2. Revisit your Vue.js app’s import and configuration settings to ensure that all necessary dependencies and configurations are applied correctly.

3. Consider creating a minimal test implementation of Freshworks SDK using Vue.js to identify and isolate the issue in a simplified environment.

4. As a temporary workaround, you might want to create a separate method within server.js to handle the API request. Once the response is retrieved, you can send the data to your client-side Vue.js app. This approach could help you mitigate the issue caused by invoking templates from the Vue.js client-side.

If you could share any additional logs, code snippets, or a repository that reproduces the problem, it would be easier for us to provide more specific guidance on fixing the issue.

[Bharath_Raghuraja]

Hi @Gopi @zach_jones_noel,

Thank you for your support.

We have identified the exact reason for the issue. The problem lies in the schema requests.json file. When we hardcoded the domain, the app worked fine. However, when we tried to pass the domain via context, we encountered a substituting template error message.

 "getContactList":{
    "schema":{
        "protocol": "https",
        "method": "GET",
        "host":"<%= context.host%>",
        "path": "/api/v2/contacts",
        "headers": {
            "Authorization": "Basic <%= encode(iparam.freshdesk_apiKey) %>",
            "Content-Type": "application/json"
        },
        "query": {
            "per_page": "100"
        }
    }

Since we have multiple domains for our Freshdesk PROD account, we cannot provide the domain in iparams.

Is there any other solution to pass the domain via context to the schema host?

[Gopi]

Hi @Bharath_Raghuraja ,

Please ensure that when providing the host in the context, exclude the “https://” prefix. Use the following format: “subdomain.freshdesk.com”.

[Bharath_Raghuraja]

Hi @Gopi

Yes, we passed the domain name without the “https” like below

getContactList: async function (client) {

    // var domainName = client.context.productContext.url;


    var domainName = "parkonectcaresandbox.freshdesk.com";
    console.log("DOMAIN NAME", domainName)
          
    var getContactListPayload = await client.request.invokeTemplate("getContactList", {
        context: {
          host: domainName,
        }
      });
    
    console.log("GET CONTACT LISTSSSSSS", getContactListPayload);

[Gopi]

@Bharath_Raghuraja can you please share the console how it prints.

[Bharath_Raghuraja]

@Gopi

This is console for domain name

This is console for response

We also changed the domain name to string and tried but same error occurd

[Bharath_Raghuraja]

Hi Glen,
Hope you are doing well and We apologize for the delay in providing you with an update.

We have made significant progress with the Freshdesk technical team, with 98% of the upgrading processes completed. However, we are currently facing an issue with passing the domain name to the API dynamically.

The Freshworks support team suggested setting the domain name in the Installation configuration page, but since we have multiple domains in our Production environment, we need to find a way to pass the domain name dynamically to the API. We have also raised a ticket in the Freshworks community and are actively following up with them for a resolution.

Despite this challenge, all other necessary changes have been completed. We are optimistic that we will resolve this issue before your return. Thank you for your understanding.