Asp Net Core 3.1 - Problem displaying images calling dicom server via api controllers

Hello,

I have embedded the ohif viewer in an asp net core 3.1 web app following this guide : https://docs.ohif.org/deployment/recipes/embedded-viewer.html

Everything works fine when I am using the configuration provided by the app-config.js (with wado / qido urls pointing to https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE).

Then I wanted to connect the viewer to a orthanc dicom server, calling it via an api controller class on my web app. Everything works fine until I click on a study in the study list, the images displayed are either wrong or don't display at all.

Here is my html :

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />

    <meta name="description" content="Open Health Imaging Foundation DICOM Viewer" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <meta name="theme-color" content="#000000" />
    <meta http-equiv="cleartype" content="on" />
    <meta name="MobileOptimized" content="320" />
    <meta name="HandheldFriendly" content="True" />
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <!-- WEB FONTS -->
    <link href="https://fonts.googleapis.com/css?family=Sanchez" rel="stylesheet" />
    <link rel="stylesheet" href="~/css/googlefontroboto.css" />

    <title>OHIF Standalone Viewer</title>
</head>

<body>
    <noscript> You need to enable JavaScript to run this app. </noscript>

    <div id="root"></div>

    <script src="~/lib/ohif/viewer/dist/index.umd.js"></script>
    <script src="~/lib/ohif/viewer/dist/app-config.js?refresh=2"></script>

    <script>
        var containerId = "root";
        var componentRenderedOrUpdatedCallback = function () {
            console.log('OHIF Viewer rendered/updated');
        }
        window.OHIFViewer.installViewer(
            window.config,
            containerId,
            componentRenderedOrUpdatedCallback
        );
    </script>
</body>

</html>

My api controller action :

[HttpGet]
        [Route("{*catchall}")]
        public async Task<IActionResult> CatchAllAPIMethods(string catchall, int limit, int offset, string fuzzymatching, string includefield, string StudyDate)
        {   
            try
            {
                //HttpClient client = _httpClientFactory.CreateClient("OrthancClient");
                HttpClient client = _httpClientFactory.CreateClient("ServerDCMJSClient");

                //string apiUrlOrthanc = "dicom-web/";
                string apiUrlOrthanc = "dcm4chee-arc/aets/DCM4CHEE/rs/";
                if (catchall == "studies")
                {
                    apiUrlOrthanc += "studies?limit=" + limit + "&offset=" + offset + "&fuzzymatching=" + fuzzymatching + "&includefield=" + includefield + "&StudyDate=" + StudyDate;
                }
                else
                {
                    apiUrlOrthanc += catchall;
                }

                HttpResponseMessage responseOrthancGetStudies = await client.GetAsync(apiUrlOrthanc);

                var jsonString = await responseOrthancGetStudies.Content.ReadAsStringAsync();

                return Ok(jsonString);

            }
            catch (Exception e)
            {
                var messageErreur = e.Message;
                return Ok();
            }                        
        }

Here is my app-config.js :

window.config = {
  // default: '/'
  routerBasename: '/Home/OhifViewer',
  whiteLabelling: {},
  extensions: [],
  showStudyList: true,
  filterQueryParam: false,
  servers: {
    dicomWeb: [
      {
        name: 'Orthanc', // 'DCM4CHEE' 'Orthanc'
        wadoUriRoot: 'https://localhost:44393/api/WadoQidoAPI', // 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/wado' 'https://localhost:44393/api/WadoQidoAPI'
        qidoRoot: 'https://localhost:44393/api/WadoQidoAPI', // 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs' 'https://localhost:44393/api/WadoQidoAPI'
        wadoRoot: 'https://localhost:44393/api/WadoQidoAPI', // 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs' 'https://localhost:44393/api/WadoQidoAPI'
        qidoSupportsIncludeField: false,
        imageRendering: 'wadors',
        thumbnailRendering: 'wadors',
      },
    ],
  },
  // Extensions should be able to suggest default values for these?
  // Or we can require that these be explicitly set
  hotkeys: [
    // ~ Global
    {
      commandName: 'incrementActiveViewport',
      label: 'Next Viewport',
      keys: ['right'],
    },
    {
      commandName: 'decrementActiveViewport',
      label: 'Previous Viewport',
      keys: ['left'],
    },
    // Supported Keys: https://craig.is/killing/mice
    // ~ Cornerstone Extension
    { commandName: 'rotateViewportCW', label: 'Rotate Right', keys: ['r'] },
    { commandName: 'rotateViewportCCW', label: 'Rotate Left', keys: ['l'] },
    { commandName: 'invertViewport', label: 'Invert', keys: ['i'] },
    {
      commandName: 'flipViewportVertical',
      label: 'Flip Horizontally',
      keys: ['h'],
    },
    {
      commandName: 'flipViewportHorizontal',
      label: 'Flip Vertically',
      keys: ['v'],
    },
    { commandName: 'scaleUpViewport', label: 'Zoom In', keys: ['+'] },
    { commandName: 'scaleDownViewport', label: 'Zoom Out', keys: ['-'] },
    { commandName: 'fitViewportToWindow', label: 'Zoom to Fit', keys: ['='] },
    { commandName: 'resetViewport', label: 'Reset', keys: ['space'] },
    // clearAnnotations
    { commandName: 'nextImage', label: 'Next Image', keys: ['down'] },
    { commandName: 'previousImage', label: 'Previous Image', keys: ['up'] },
    // firstImage
    // lastImage
    {
      commandName: 'previousViewportDisplaySet',
      label: 'Previous Series',
      keys: ['pagedown'],
    },
    {
      commandName: 'nextViewportDisplaySet',
      label: 'Next Series',
      keys: ['pageup'],
    },
    // ~ Cornerstone Tools
    { commandName: 'setZoomTool', label: 'Zoom', keys: ['z'] },
    // ~ Window level presets
    {
      commandName: 'windowLevelPreset1',
      label: 'W/L Preset 1',
      keys: ['1'],
    },
    {
      commandName: 'windowLevelPreset2',
      label: 'W/L Preset 2',
      keys: ['2'],
    },
    {
      commandName: 'windowLevelPreset3',
      label: 'W/L Preset 3',
      keys: ['3'],
    },
    {
      commandName: 'windowLevelPreset4',
      label: 'W/L Preset 4',
      keys: ['4'],
    },
    {
      commandName: 'windowLevelPreset5',
      label: 'W/L Preset 5',
      keys: ['5'],
    },
    {
      commandName: 'windowLevelPreset6',
      label: 'W/L Preset 6',
      keys: ['6'],
    },
    {
      commandName: 'windowLevelPreset7',
      label: 'W/L Preset 7',
      keys: ['7'],
    },
    {
      commandName: 'windowLevelPreset8',
      label: 'W/L Preset 8',
      keys: ['8'],
    },
    {
      commandName: 'windowLevelPreset9',
      label: 'W/L Preset 9',
      keys: ['9'],
    },
  ],
  cornerstoneExtensionConfig: {},
};

Do you know why the images are not rendering when I call the dicom server via my api controller action ?

Thanks a lot for your help !

Sylvain

OHIFViewerProblem1 OHIFViewerProblem2

OHIF / Viewers

Asp Net Core 3.1 - Problem displaying images calling dicom server via api controllers #1568