[cornerstone] CORS problem when load segmentation via DicomWeb api (Can load Dicom , Cannot Dicom-Seg)

Describe Your Question

I hope to load segmentation on localhost via cornerstone,
but I meet CORS problem packages/adapters/examples/segmentationStack/index.ts , line 171

// @link https://github.com/cornerstonejs/cornerstone3D/blob/e0522fd764aae828ac93e05003593f21fc1b406f/packages/adapters/examples/segmentationStack/index.ts#L171

const arrayBuffer = await client.retrieveInstance({
    studyInstanceUID: configSeg.StudyInstanceUID,
    seriesInstanceUID: configSeg.SeriesInstanceUID,
    sopInstanceUID: configSeg.SOPInstanceUID
});

I can load dicom on localhost ,
api is /dicom-web/studies/{study}/series/{series}/instances/{instance}/frames/1

But I will meet CORS problem when load segmentation ,
api is /dicom-web/studies/{study}/series/{series}/instances/{instance} ,

I use docker Orthanc and docker Nginx.
Here is my nginx.conf

server {
    listen 18502;
    server_name localhost;
    
    location /dicom-web/ {
        // to docker orthanc
        proxy_pass http://orthanc:8042;
        proxy_set_header HOST $host;
        proxy_set_header X-Real-IP $remote_addr;
        
        # Hope solve CORS , but fail for load segmentation
        add_header 'Access-Control-Allow-Credentials' 'true' always;
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type' always;
        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS' always;
        add_header 'Access-Control-Allow-Origin' '*' always;
        add_header 'Access-Control-Expose-Headers' '*' always;
        
        // Use the "public" user with the "hello" password
        proxy_set_header Authorization "Basic cHVibGljOmhlbGxv";
    }
}

Would you have ideas ?

Thanks in advance !

What steps can we follow to reproduce the bug?

  1. Git clone cornerstone3d at master branch
  2. Modify the dicom and dicom-seg in packages/adapters/examples/segmentationStack/demo.ts to localhost
  3. Run yarn run example segmentationStack
  4. Press the button Load DICOM Seg

Is anyone know the Access-Control-Allow-Headers should be for dicom-web api ?

I try many times , trying add the header I see shown in chrome dev tool , but still fails

You can look at our recipes and nginx and see how we handle CORS Viewers/platform/app/.recipes at master Β· OHIF/Viewers Β· GitHub

1 Like