View in #ohif on Slack
@Isa_Mohammad: Hi everyone,
I have an authorization token like this
{Authorization: 'Basic WDh0TEVDUEhqNndzbEc5OmE3UDI0aGdDTTBCdTB5ZQ=='}
How do I pass the authorization headers in the request body
@Farid_Yagubbayli: I did something similar by following the example here.
<cornerstoneWADOImageLoader/examples/wadors/index.html at bb8d9777ccc91de5daaaae2d478e1f14482159ec · cornerstonejs/cornerstoneWADOImageLoader · GitHub | index.html>
@Isa_Mohammad: @Farid_Yagubbayli we are using OHIF and passed the Authorization header in the function named initWADOImageLoader in the file initWADOImageLoader.js like so.
beforeSend: function (xhr) {
//TODO should be removed in the future and request emitted by DicomWebDataSource
const sourceConfig = extensionManager.getActiveDataSource()?.[0].getConfig() ?? {};
const headers = {
Authorization: 'Basic AUTH_TOKEN',
};
const acceptHeader = utils.generateAcceptHeader(
sourceConfig.acceptHeader,
sourceConfig.requestTransferSyntaxUID,
sourceConfig.omitQuotationForMultipartRequest
);
const xhrRequestHeaders = {
Accept: acceptHeader,
};
if (headers) {
Object.assign(xhrRequestHeaders, headers);
}
console.log('API auth token:', xhrRequestHeaders);
return xhrRequestHeaders;
},
@Alireza_Sedghi: where do you get the token from? you can add it to the authentication service, see this one platform/app/src/routes/Mode/updateAuthServiceAndCleanUrl.ts
@Isa_Mohammad: its from Orthanc. Can you please give an example.
@Alireza_Sedghi: the file above has an example
@Isa_Mohammad: Thanks
/**
* Updates the user authentication service with the provided token and cleans the token from the URL.
* @param token - The token to set in the user authentication service.
* @param location - The location object from the router.
* @param userAuthenticationService - The user authentication service instance.
*/
export function updateAuthServiceAndCleanUrl(
token: string,
location: any,
userAuthenticationService: any
): void {
// if a token is passed in, set the userAuthenticationService to use it
// for the Authorization header for all requests
console.log('Token');
userAuthenticationService.setServiceImplementation({
getAuthorizationHeader: () => ({
Authorization: 'Basic AUTH_TOKEN',
}),
});
// Create a URL object with the current location
const urlObj = new URL(window.location.origin + window.location.pathname + location.search);
// Remove the token from the URL object
urlObj.searchParams.delete('token');
const cleanUrl = urlObj.toString();
// Update the browser's history without the token
if (window.history && window.history.replaceState) {
window.history.replaceState(null, '', cleanUrl);
}
}
here is my updateAuthServiceAndCleanUrl.ts file which is being called in the Mode.tsx file and the function updateAuthServiceAndCleanUrl is called without any condition. But I am still getting the 401 error, and no auth header is present in the request.
Off note:
I am using the OHIF in an iframe component in our react app. Which already has a login system.
@Alireza_Sedghi Can you kindly guide me on this?
@Alireza_Sedghi: can’t you send token from parent to the child
and then inject it to the userauthentication sevice
as i have example above?
@Ismail_Alam: Hey @Alireza_Sedghi thank you so much for your responses we appreciate it. As you can see we have injected the token into the UserAuthenticationService but still this error is happening. Can you please direct us to some article/github issue/documentation or anything to help us with this?
Also lets say its not only about Auth, what about if we need to pass something else in the headers?
Also I think there has been a misunderstanding
we are trying to pass the authentication header on the requests to our Orthanc server not OHIF
hopefully this should help you understand our problem
@Alireza_Sedghi: there is a beforeSend hook
you can take a look
have your custom service to inject stuff there
all those will get into the header if you register
search for initWadoImageLoader in OHIF
@Ismail_Alam: @Alireza_Sedghi thanks a lot we will try and get back to you. So sorry for bugging you a lot
Hey @Alireza_Sedghi sorry again. See I have added this but still I am getting the same error and nothing is getting passed on the Header. Maybe there are some changes that needs to be done on the config?
@Alireza_Sedghi: Hmmm, do you see the token being sent to in the chrome network panel?
@Ismail_Alam: no it doesn’t send, thats the problem
would you like me to provide me the config file?
maybe I have to provide something which I missed?
@Alireza_Sedghi: Do you have time on Thursday to come to ohif office hours?
@Ismail_Alam: not sure but I can try
the thing is that this is a bit urgent and 1st August might be a bit too late.
Would it be possible for you to arrange something a bit earlier then that?
@Alireza_Sedghi: I don’t have time unfortunatelly before that
but the gist of it is to get the token and put it in auth service
then it will automatically added here in beforeSend
@Ismail_Alam: > I don’t have time unfortunatelly before that
thats fine, thanks.
> but the gist of it is to get the token and put it in auth service
but as you can see I hardcoded the token into it so this should work even if auth service have it or not
right?
I will try to join the OHIF office hours on August 1st, thanks a lot for your time.
@Alireza_Sedghi: Yes hardcoed token should work
if it does not means it is not this service that has initiated the network request
check who is the initiator
@Ismail_Alam: I am sorry I am not too familiar with the code of OHIF could you please give some lead on this?
@Alireza_Sedghi: what is the request url
@Ismail_Alam: its the first request that gets called this one
<https://orthanc-radioview.neurocare.ai/dicom-web/studies?limit=101&offset=0&fuzzymatching=false&includefield=00081030%2C00080060|https://<orthanc-url>/dicom-web/studies?limit=101&offset=0&fuzzymatching=false&includefield=00081030%2C00080060>
@Alireza_Sedghi: i see
so that is going through another service called dicomwebclient
extensions/default/src/DicomWebDataSource/index.js
it is here
getAuthrorizationHeader = () => {
const xhrRequestHeaders = {};
const authHeaders = userAuthenticationService.getAuthorizationHeader();
if (authHeaders && authHeaders.Authorization) {
xhrRequestHeaders.Authorization = authHeaders.Authorization;
}
return xhrRequestHeaders;
};
this should work if you hardcode it
@Ismail_Alam: ok let me check
hmm, now this is weird in the console I do see that this is getting called but nothing is getting passed into the header
@Jakub_Legutko: I have same problem in beforeSend as it is not adding returned headers to network call.
beforeSend: async function (xhr: XMLHttpRequest, imageId: any, deafulatHeaders: any, params: any) {
const token = await keycloakService.getToken();
const headers = {
Authorization: Bearer ${token}
};
return headers;
}
@Ismail_Alam: I think there is probably something wrong with how headers are pased
I wasn’t able to join the Office hours yesterday but will try to join next week. I also created a github issue for this
https://github.com/OHIF/Viewers/issues/4325
#4325 [Bug] Headers don’t get passed on requests on orthanc dicom-web.
Hey @Alireza_Sedghi anything on this?
@Alireza_Sedghi: Office hours is starting now