Domo.js is trying to JSON.parse a png

While developing a custom app for my organization, I am trying to request the name and the avatar of the individual accessing the card. I am able to get the name of the individual without any problems, but when requesting the avatar image I get the following console error:
Uncaught (in promise) Error: Invalid JSON response at XMLHttpRequest.d.onload (domo.ts:309:18)

I have looked into the domo.js code, and after making some limited sense of things, I found that it tries to JSON.parse the .png that is returned.

When checking the network dev tools tab I can see the correct image getting returned, but it doesn’t get passed to the app.

Here is the function that returns the error:

d.onload = function() {
                            var e;
                            if( u(d.status) ) {
                                !["csv","excel"].includes(r.format) && d.response || i(d.response), "blob" === r.responseType && i(new Blob([d.response], { type:d.getResponseHeader("content-type") }));
                                var t = d.response;
                                try{
                                    e = JSON.parse(t)
                                }
                                catch(e){
                                    return void c(Error("Invalid JSON response"))
                                }i(e)
                            }else c(Error(d.statusText))
                        }

As far as I can tell, e refers to the Domo environment, although I am not 100% sure of that.

Note: I am turning to stackoverflow because my organization still has open support tickets with Domo that are more than 2 years old with no response, so I have little faith in getting a timely response from Domo regarding this issue.

UPDATE: Here is the full function that is called-

function i(e,t,r,n,a) {
                    return r = r || {}, new Promise((function(i,c) {
                        var d = new XMLHttpRequest;
                        if (n?d.open(e,t,n):d.open(e,t), p(d,t,r), function(e,t) {
                            t.contentType ? 
                            "multipart" !== t.contentType && e.setRequestHeader("Content-Type", t.contentType)
                            : e.setRequestHeader("Content-Type", o.DataFormats.JSON)
                        } (d,r), function(e) {
                            s && e.setRequestHeader("X-DOMO-Ryuu-Token", s)
                        } (d), function(e,t) {
                            void 0 !== t.responseType && (e.responseType = t.responseType)
                        } (d,r), 
                        d.onload = function() {
                            var e;
                            if( u(d.status) ) {
                                !["csv","excel"].includes(r.format) && d.response || i(d.response), "blob" === r.responseType && i(new Blob([d.response], { type:d.getResponseHeader("content-type") }));
                                var t = d.response;
                                try{
                                    e = JSON.parse(t)
                                }
                                catch(e){
                                    return void c(Error("Invalid JSON response"))
                                }i(e)
                            }else c(Error(d.statusText))
                        },
                        d.onerror = function() {
                            c(Error("Network Error"))
                        }, a) 
                        if (r.contentType && r.contentType !== o.DataFormats.JSON) d.send(a);
                        else {
                            var f = JSON.stringify(a);
                            d.send(f)
                        }
                        else d.send()
                    }))

Here is the domo.js method that is being called to get the image:

e.get = function(e, t) {
                        return i(o.RequestMethods.GET, e, t)
                    },

Answer

@Skousini you can get the avatar for a user by providing this URL directly to the src property of the <img> tag (obviously replacing the query params with the relevant information):

<img src="/domo/avatars/v2/USER/846578099?size=300&defaultForeground=fff&defaultBackground=000&defaultText=D" />

This documentation is available on developer.domo.com: https://developer.domo.com/docs/dev-studio-references/user-api#User%20Avatar

If you want to pull down data from endpoints, you don’t have to use domo.js. You could use axios or any other HTTP tool. domo.js is trying to make HTTP requests simpler by automatically parsing json (since most requests are json based). There are a few other options for what data format that domo.get can support provided in this documentation: https://developer.domo.com/docs/dev-studio-tools/domo-js#domo.get

Advertisement

Answer