I was wondering if it’s possible to modify the content of the header component in the study list to add custom UI components such as a button to open a modal.
Thank you in advance.
here.
Thanks for your question @edcheyjr.
At present there is not way to dynamically modify the content of the header component in the study list/work list, other than by editing the Worklist code itself and add the components you desire as children of the Header there.
However, you bring up a good point and perhaps it would be a good idea to add a CustomizationService hook for the Worklist to look up what to add as a child of the Header. Since we invite all members of the community to submit PRs, please consider doing this on your own and submitting it as a PR.
I know it would be greatly appreciated!
There is an example of using the configuration service so that someone could create their own DICOM upload dialogue. Instead, the Worklist could look up say a WorklistHeaderComponent and add it as the child of the Header.
I hope this helps.
1 Like
Thanks for the reply I will take a look at it, Also I had another question regarding userAuthenticationService. According to the doc, it will inject the token as an Authorization header in the requests that are sent to the server. i wanted to know if it only applies to oidc or I can also use it with my own token say for my own authentication request when a user is logging in.
Hello
I was able to change the logo in the previous version with a “whitelabelling”. Am yet to try that for this new version.
You might want to have a look.
Check the ohif documentation
Thanks
Holakunle
1 Like
Hi @edcheyjr,
I am not all too familiar, but as what is described in the OHIF docs and from what I can tell, if you launch OHIF say with http://localhost:3000/viewer?StudyInstanceUIDs=1.2.840.113619.2.290.3.3767434740.226.1600859119.501&token=blahblah, the token will be inserted into various requests with header Authorization: Bearer blahblah. You can see this when you open the network tab in the browser’s developer tools.
Hope this helps.
1 Like
Okay, I have tried it works, thanks.
I think this will work well if you are redirecting from another page but I don’t know how the token would be inserted from Worklist when a user clicks on a mode button. If you can suggest a better approach on how I should authenticate users you can share also.
Thanks for the reply.
Hello
You can place keycloak over ohif for authentication. Theres
Hello @jbocce and @holakunle69, thank you for the reply. I decided to try the token approach; however, after adding the token, the request is being sent twice with and without the token, leading to CORS errors on the server. The one with the token is being blocked by CORs but my guess is because of the request being sent twice. Could you please help me resolve this issue?
Hi @edcheyjr.
I suspect what you are seeing with the two requests is that one (the first) is the preflight request with the token and the next is the actual request and this is expected.
If it is indeed a CORS error (I really could not tell by the screen shot), then I suspect you will have to configure your data source to allow the CORS requests. See the following for more information Cross-Origin Information for OHIF | OHIF.
Hope this helps.
Hi @jbocce
Thanks for the reply,
Have all the necessary nginx header configurations to make it works because the request goes through if don’t add any extra headers such as that Authorization header.
It is indeed a CORs, but very strange as it only happens if I add extra headers to the request.
Here is the Nginx conf
worker_processes 1;
events { worker_connections 1024; }
http {
client_max_body_size 300M;
upstream orthanc-server {
server orthanc:8042;
}
server {
listen 9042;
client_max_body_size 300M;
# CORS Magic
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow_Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Accept,Origin,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range';
add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS,PUT,DELETE,PATCH';
location / {
if ($request_method = 'OPTIONS') {
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow_Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Accept,Origin,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range';
add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS,PUT,DELETE,PATCH';
add_header 'Access-Control-Max-Age' 1728000;
add_header 'Content-Type' 'text/plain charset=UTF-8';
add_header 'Content-Length' 0;
return 204;
}
proxy_pass http://orthanc:8042;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Host $server_name;
# CORS Magic
add_header 'Access-Control-Allow-Origin' '*';
add_header 'Access-Control-Allow_Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Authorization,Accept,Origin,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range';
add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS,PUT,DELETE,PATCH';
}
}
}
I am really not sure to be honest.
Perhaps try the following proxy - Authorization header in Nginx for proxying to basic auth backend does't work - Stack Overflow - in particular using…
proxy_set_header Authorization $http_authorization;
proxy_pass_header Authorization;
Thank you, let me try.
We recently added several recipes for implementing authentication with Keycloak in OHIF. You can find them here:
Okay thanks for the update