javascript - Web API call to controller not working, breakpoints not hit, prior versions of code no longer work (UPDATED WITH ANSWER) -
a view in intranet asp.net mvc website uses web api render image thumbnails when user hovers on documents (normally, graphic appears looks first page of document). i'm stuck because code working before; i'm not sure if outside code modification third party (or bad code on part) broke it, don't see image thumbnails.
i'm having difficulty determining happened. here's i've done far:
- modified code directly
this 1 of first things do: presume mistake due kind of error (or forgot do). problem area focused on javascript/jquery snippet, inside <script>
area of code on view:
$(".tile2").each(function () { $(this).tooltip({ content: "<img src='/jportal/api/portaldocument/thumbnail?u=" + this.id + "' />" }); });
the .tile2
class reference each individual document rendered on page. $(this).tooltip
*has code thumbnail functionality. *this.id
is reference unique id each file (which looks long 32 or 64-character "hash", used render document graphic in thumbnail).
i tried modifying html <img>
tag inside tooltip section (because thought modified render incorrectly), still fails (the thumbnail shows no image inside it). when commented whole line of code out, no preview frame appears @ all, that's how reasoned problem must close.
- looked @ multiple files try , find inconsistencies (aka "viewing problem above")
i tried looking @ supporting model , controller code see if problem going out either 1 of them:
controller
the web api controller looks convert , return information can rendered:
public httpresponsemessage getthumbnailimage(string u) { string url = new hex(u); httpresponsemessage response = new httpresponsemessage(); using (var webclient = new system.net.webclient() { credentials = sharepointcredential.credential }) { var data = webclient.downloaddata(url); using (var ms = new system.io.memorystream(data)) { using (bitmap img = new bitmap(ms)) { using (bitmap b = new bitmap(img, new size(img.width / 3, img.height / 3))) { using (graphics gr = graphics.fromimage(b)) { using (var ia = new imageattributes()) { ia.setcolormatrix(new colormatrix(documentviewer.gray_matrix)); ia.setthreshold(0.8f, coloradjusttype.default); gr.drawimage(b, new rectangle(0, 0, b.width, b.height), 0, 0, b.width, b.height, graphicsunit.pixel, ia); using (system.io.memorystream mms = new system.io.memorystream()) { b.save(mms, system.drawing.imaging.imageformat.png); response.content = new bytearraycontent(mms.toarray()); response.content.headers.contenttype = new system.net.http.headers.mediatypeheadervalue("image/png"); return response; } } } } } } } }
i proceeded throw breakpoints on api controller call see if them hit, nothing happened. it's if action never used, though there actual graphic rendered each document (it's generic x graphic, "no image found").
model
i tried throwing breakpoints on couple of model files thought called api controller, none of breakpoints got hit either. (i add code here, since neither model traversed call, might not worth it.)
- restored prior working versions of code test (and watched them fail too)
here's gets real weird. restored 1 or 2 copies of code past (just see if old code worked, , indeed botched something). prior copies failed show thumbnail.
update: simple fixes save day! (subtitle: watch when debugging)
thank people responded earlier. discussed in responses below, fix came through combination of using browser developer tools , paying close attention urls. here's did:
- i had modify javascript code rendered each "tooltip"
the <img>
tag had src
value set /jportal/api/portaldocument/thumbnail?u=
. indeed bad url; is, full tag read like
<img src='/jportal/api/portaldocument/thumbnail?u=3409802204320321309280342...'/>
when url needed closer to
<img src='http://...actual site url prefix (e.g. mywebsite.com).../jportal/api/portaldocument/thumbnail?u=340980...'/>
i stumbled across during debugging yesterday, didn't put 2 , 2 until morning. had tried insert correct url prefix <img>
tag directly, still failed:
$(this).tooltip({ content: "<img src='" + '@model.documentcontext' + this.id + ...' /> });
produces img tag resembling
<img src='http://website.com'/jportal/api/portaldocument...u=340980...'/>
which fails. (you see single quote, right? seems botch up.)
when separated url prefix own variable, worked:
var imageurlprefix = '@model.documentcontext'; //that whole http://website.com/jportal/api/portaldocument/thumbnail?u= deal $(this).tooltip({ content: "<img src='" + imageurlprefix + this.id + "' />" }); //a little cleaner, , works :)
phew! learned new website debugging api actions: had past typical solution path - being thrown off scent because breakpoints put on api actions , model files weren't being hit; after looked @ code broken (by viewing page source) had needed. (i hadn't applied until today.)
i go path pin point location of problem:
- fire fiddler or browser developer tools (f12) , check network activity - page call web api action? (i.e gets image expected url)
- assuming does, url contains correct parameter?
- if of above ok - assume server problem. otherwise, client application sure (the browser / application javascript code etc.) , maybe server.
to test server - navigate url of image know should work using standard browser url bar - if image loads server doing it's part fine.
to test client application - start replacing code parts tag static url of thumbnail know works. (could image load static resource on server , not web api call)
when sure it's browser side, can:
- debug code using developer tools see goes wrong
- check source control changes since last version worked
- test other browsers (!) maybe browser vendor changed on you. example did little off-standard , became strict following standard.
last, provide more info after these tests more.
Comments
Post a Comment