diff --git a/extensions/cornerstone-dicom-seg/package.json b/extensions/cornerstone-dicom-seg/package.json index 8b5de27fe..74ef75600 100644 --- a/extensions/cornerstone-dicom-seg/package.json +++ b/extensions/cornerstone-dicom-seg/package.json @@ -44,8 +44,8 @@ }, "dependencies": { "@babel/runtime": "^7.20.13", - "@cornerstonejs/adapters": "^1.32.2", - "@cornerstonejs/tools": "^1.32.2", + "@cornerstonejs/adapters": "^1.36.1", + "@cornerstonejs/tools": "^1.36.1", "@kitware/vtk.js": "27.3.1", "react-color": "^2.19.3" } diff --git a/extensions/cornerstone-dicom-sr/package.json b/extensions/cornerstone-dicom-sr/package.json index 5412da7c7..d069c32df 100644 --- a/extensions/cornerstone-dicom-sr/package.json +++ b/extensions/cornerstone-dicom-sr/package.json @@ -44,9 +44,9 @@ }, "dependencies": { "@babel/runtime": "^7.20.13", - "@cornerstonejs/adapters": "^1.32.2", - "@cornerstonejs/core": "^1.32.2", - "@cornerstonejs/tools": "^1.32.2", + "@cornerstonejs/adapters": "^1.36.1", + "@cornerstonejs/core": "^1.36.1", + "@cornerstonejs/tools": "^1.36.1", "classnames": "^2.3.2" } } diff --git a/extensions/cornerstone/package.json b/extensions/cornerstone/package.json index c3bb75ef8..119253ebe 100644 --- a/extensions/cornerstone/package.json +++ b/extensions/cornerstone/package.json @@ -36,7 +36,7 @@ "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2", "@cornerstonejs/codec-openjpeg": "^1.2.2", "@cornerstonejs/codec-openjph": "^2.4.2", - "@cornerstonejs/dicom-image-loader": "^1.32.2", + "@cornerstonejs/dicom-image-loader": "^1.36.1", "@ohif/core": "3.8.0-beta.26", "@ohif/ui": "3.8.0-beta.26", "dcmjs": "^0.29.12", @@ -52,10 +52,10 @@ }, "dependencies": { "@babel/runtime": "^7.20.13", - "@cornerstonejs/adapters": "^1.32.2", - "@cornerstonejs/core": "^1.32.2", - "@cornerstonejs/streaming-image-volume-loader": "^1.32.2", - "@cornerstonejs/tools": "^1.32.2", + "@cornerstonejs/adapters": "^1.36.1", + "@cornerstonejs/core": "^1.36.1", + "@cornerstonejs/streaming-image-volume-loader": "^1.36.1", + "@cornerstonejs/tools": "^1.36.1", "@kitware/vtk.js": "27.3.1", "html2canvas": "^1.4.1", "lodash.debounce": "4.0.8", diff --git a/extensions/measurement-tracking/package.json b/extensions/measurement-tracking/package.json index f8664b2e3..56d842dbb 100644 --- a/extensions/measurement-tracking/package.json +++ b/extensions/measurement-tracking/package.json @@ -30,8 +30,8 @@ "start": "yarn run dev" }, "peerDependencies": { - "@cornerstonejs/core": "^1.32.2", - "@cornerstonejs/tools": "^1.32.2", + "@cornerstonejs/core": "^1.36.1", + "@cornerstonejs/tools": "^1.36.1", "@ohif/core": "3.8.0-beta.26", "@ohif/extension-cornerstone-dicom-sr": "3.8.0-beta.26", "@ohif/ui": "3.8.0-beta.26", diff --git a/platform/app/.webpack/webpack.pwa.js b/platform/app/.webpack/webpack.pwa.js index 156b64455..c07fdfb36 100644 --- a/platform/app/.webpack/webpack.pwa.js +++ b/platform/app/.webpack/webpack.pwa.js @@ -166,6 +166,7 @@ module.exports = (env, argv) => { //writeToDisk: true, historyApiFallback: { disableDotRule: true, + index: PUBLIC_URL + 'index.html', }, headers: { 'Cross-Origin-Embedder-Policy': 'require-corp', diff --git a/platform/app/package.json b/platform/app/package.json index e94e8d829..22082a94f 100644 --- a/platform/app/package.json +++ b/platform/app/package.json @@ -50,8 +50,8 @@ "@cornerstonejs/codec-charls": "^1.2.3", "@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2", "@cornerstonejs/codec-openjpeg": "^1.2.2", - "@cornerstonejs/codec-openjph": "^2.4.2", - "@cornerstonejs/dicom-image-loader": "^1.32.2", + "@cornerstonejs/codec-openjph": "^2.4.5", + "@cornerstonejs/dicom-image-loader": "^1.36.1", "@ohif/core": "3.8.0-beta.26", "@ohif/extension-cornerstone": "3.8.0-beta.26", "@ohif/extension-cornerstone-dicom-rt": "3.8.0-beta.26", diff --git a/platform/app/public/serve.json b/platform/app/public/serve.json new file mode 100644 index 000000000..dbbe3ba69 --- /dev/null +++ b/platform/app/public/serve.json @@ -0,0 +1,12 @@ +{ + "rewrites": [{ "source": "*", "destination": "index.html" }], + "headers": [ + { + "source": "**/*", + "headers": [ + { "key": "Cross-Origin-Embedder-Policy", "value": "require-corp" }, + { "key": "Cross-Origin-Opener-Policy", "value": "same-origin" } + ] + } + ] +} diff --git a/platform/app/src/utils/OpenIdConnectRoutes.tsx b/platform/app/src/utils/OpenIdConnectRoutes.tsx index 4552b0527..7c83efd2a 100644 --- a/platform/app/src/utils/OpenIdConnectRoutes.tsx +++ b/platform/app/src/utils/OpenIdConnectRoutes.tsx @@ -147,7 +147,10 @@ function OpenIdConnectRoutes({ oidc, routerBasename, userAuthenticationService } const location = useLocation(); const { pathname, search } = location; - const redirect_uri = new URL(userManager.settings._redirect_uri).pathname; //.replace(routerBasename,'') + const redirect_uri = new URL(userManager.settings._redirect_uri).pathname.replace( + routerBasename !== '/' ? routerBasename : '', + '' + ); const silent_refresh_uri = new URL(userManager.settings._silent_redirect_uri).pathname; //.replace(routerBasename,'') const post_logout_redirect_uri = new URL(userManager.settings._post_logout_redirect_uri).pathname; //.replace(routerBasename,''); @@ -158,7 +161,7 @@ function OpenIdConnectRoutes({ oidc, routerBasename, userAuthenticationService } } return ( - + -### Build for non-root path - -If you would like to access the viewer from a non-root path (e.g., `/my-awesome-viewer` instead of `/`), -You can achieve so by using the `PUBLIC_URL` environment variable AND the `routerBasename` configuration option. - -1. use a config (e.g. config/myConfig.js) file that is using the `routerBasename` of your choice `/my-awesome-viewer` (note there is only one / - it is not /my-awesome-viewer/). -2. build the viewer with `PUBLIC_URL=/my-awesome-viewer/ APP_CONFIG=config/myConfig.js yarn build` (note there are two / - it is not /my-awesome-viewer). - - -:::tip -The PUBLIC_URL tells the application where to find the static assets and the routerBasename will tell the application how to handle the routes -::: - -:::tip -Testing, you can use `npx http-server` to serve the files in the generated `dist` folder and access the viewer from `http://localhost:8080/my-awesome-viewer`. To achieve -so, you should first rename the `dist` folder to `my-awesome-viewer` and then change the working directory -to the `platform/app` folder and run `npx http-server ./`. Then on the browser, you can access the viewer from `http://localhost:8080/my-awesome-viewer` -::: - ### Automating Builds and Deployments diff --git a/platform/docs/docs/deployment/cors.md b/platform/docs/docs/deployment/cors.md index bd88d0d1d..135c9f961 100644 --- a/platform/docs/docs/deployment/cors.md +++ b/platform/docs/docs/deployment/cors.md @@ -1,5 +1,5 @@ --- -sidebar_position: 6 +sidebar_position: 7 --- # Cross-Origin Information for OHIF diff --git a/platform/docs/docs/deployment/custom-url-access.md b/platform/docs/docs/deployment/custom-url-access.md new file mode 100644 index 000000000..16844ca31 --- /dev/null +++ b/platform/docs/docs/deployment/custom-url-access.md @@ -0,0 +1,74 @@ +--- +sidebar_position: 4 +title: Custom URL Access/Build +--- + + +## Build for non-root path + +Sometimes it is desired to access the viewer from a non-root path (e.g., `/my-awesome-viewer` instead of `/`). +You can achieve so by using the `PUBLIC_URL` environment variable AND the `routerBasename` configuration option. + +1. use a config (e.g. `config/myConfig.js`) file that is using the `routerBasename` of your choice `/my-awesome-viewer` (note there is only one / - it is not /my-awesome-viewer/). +2. build the viewer with `PUBLIC_URL=/my-awesome-viewer/` (note there are two / - it is not /my-awesome-viewer). + + +:::tip +The PUBLIC_URL tells the application where to find the static assets and the routerBasename will tell the application how to handle the routes +::: + + +### Testing in Development +For testing the build locally, you can use the following command: + +```bash +# we use default config file, so we assume you have already set the routerBasename to /my-awesome-viewer in the default config as an example +PUBLIC_URL=/my-awesome-viewer/ APP_CONFIG=config/default.js yarn dev +``` + + +### Testing in Build (production) +You need to build the viewer with the following command: + +```bash +PUBLIC_URL=/my-awesome-viewer/ APP_CONFIG=config/default.js yarn build +``` + +We can use the `npx serve` to serve the build folder. There are two things you need to consider however, +1. You need to change the public/serve.json file to reflect the new routerBasename in the destination (see the example below) + + +```json +// final serve.json +{ + "rewrites": [{ "source": "*", "destination": "my-awesome-viewer/index.html" }], + "headers": [ + { + "source": "**/*", + "headers": [ + { "key": "Cross-Origin-Embedder-Policy", "value": "require-corp" }, + { "key": "Cross-Origin-Opener-Policy", "value": "same-origin" } + ] + } + ] +} +``` + +```bash +cd platform/app; + +# rename the dist folder to my-awesome-viewer +mv dist my-awesome-viewer + +# serve the folder with custom json, note that we are using ../public/serve.json and NOT public/serve.json +npx serve -c ./public/serve.json +``` + + +:::note +When you want to authenticate against a sub path, there are a few things you should keep in mind: + +1. Set the `routerBasename` to the sub path and also update the `PUBLIC_URL` to match the sub path. +2. Don't forget to modify the `serve.json` file as mentioned earlier. +3. Ensure that the sub path is included in the list of allowed callback URLs. For example, in the Google Cloud dashboard, you can set it in the `Authorized redirect URIs` field under the `Credentials` section of the `APIs & Services` menu. +::: diff --git a/platform/docs/docs/deployment/docker.md b/platform/docs/docs/deployment/docker.md index addfeaa90..d79c3eb3d 100644 --- a/platform/docs/docs/deployment/docker.md +++ b/platform/docs/docs/deployment/docker.md @@ -1,5 +1,5 @@ --- -sidebar_position: 4 +sidebar_position: 5 --- # Docker diff --git a/platform/docs/docs/deployment/google-cloud-healthcare.md b/platform/docs/docs/deployment/google-cloud-healthcare.md index 54df8bb02..73b378554 100644 --- a/platform/docs/docs/deployment/google-cloud-healthcare.md +++ b/platform/docs/docs/deployment/google-cloud-healthcare.md @@ -1,5 +1,5 @@ --- -sidebar_position: 9 +sidebar_position: 10 --- # Google Cloud Healthcare diff --git a/platform/docs/docs/deployment/iframe.md b/platform/docs/docs/deployment/iframe.md index 50ae28cec..4642f7281 100644 --- a/platform/docs/docs/deployment/iframe.md +++ b/platform/docs/docs/deployment/iframe.md @@ -1,5 +1,5 @@ --- -sidebar_position: 7 +sidebar_position: 8 sidebar_label: iframe --- @@ -47,7 +47,7 @@ Then run the ```bash npx http-server unzipped-folder -# you can use npx serve ./dist -l 8080 -s as an alternative to http-server +# you can use npx serve ./dist -c ../public/serve.json as an alternative to http-server ``` You should be able to see diff --git a/platform/docs/docs/deployment/nginx--image-archive.md b/platform/docs/docs/deployment/nginx--image-archive.md index 5d96443e5..5f8dc5166 100644 --- a/platform/docs/docs/deployment/nginx--image-archive.md +++ b/platform/docs/docs/deployment/nginx--image-archive.md @@ -1,5 +1,5 @@ --- -sidebar_position: 8 +sidebar_position: 9 --- # Nginx + Image Archive diff --git a/platform/docs/docs/deployment/static-assets.md b/platform/docs/docs/deployment/static-assets.md index bd69312d9..4186a1b3c 100644 --- a/platform/docs/docs/deployment/static-assets.md +++ b/platform/docs/docs/deployment/static-assets.md @@ -155,18 +155,18 @@ accurate documentation, we will link to each provider's own recommended steps: ### Azure - - Deploying viewer to Azure blob storage as a static website: + - Deploying viewer to Azure blob storage as a static website: Refer to [Host a static website](https://docs.microsoft.com/en-us/azure/storage/blobs/storage-blob-static-website) - High level steps : - 1. Go to Azure portal and create a storage account. + High level steps : + 1. Go to Azure portal and create a storage account. 2. Under Overview->Capabilities, select Static website. - 3. Enable Static website. Set the index document as ‘index.html’. - 4. Copy the primary endpoint. This will serve as the root URL for the viewer. + 3. Enable Static website. Set the index document as ‘index.html’. + 4. Copy the primary endpoint. This will serve as the root URL for the viewer. 5. Save. A new container named ‘$web’ will be created. 6. Copy OHIF viewer’s build output from ‘platform\app\dist’ folder to the ‘$web’ container. 7. Open browser and navigate to the viewer root URL copied in the step above. It should display OHIF viewer with data from default data source. - ![image](https://github.com/OHIF/Viewers/assets/132684122/236a574b-0f05-4d90-a721-df8720d05949) + ![image](https://github.com/OHIF/Viewers/assets/132684122/236a574b-0f05-4d90-a721-df8720d05949) Special consideration while accessing DicomJson data source : • Due to the way routing is handled in react, it may error out in production when trying to display data through dicomJson data source. E.g. https://[Static Website endpoint]/viewer/dicomjson?url= https://ohif-dicom-json-example.s3.amazonaws.com/LIDC-IDRI-0001.json • Resolution to this is to set error page to ‘index.html’ at the website level. This will ensure that all errors are redirected to root and requests are further served from root path. diff --git a/platform/docs/docs/deployment/user-account-control.md b/platform/docs/docs/deployment/user-account-control.md index 78c9876fd..d67708df1 100644 --- a/platform/docs/docs/deployment/user-account-control.md +++ b/platform/docs/docs/deployment/user-account-control.md @@ -1,5 +1,5 @@ --- -sidebar_position: 10 +sidebar_position: 11 --- # User Account Control diff --git a/yarn.lock b/yarn.lock index 2113b22b5..8c5df712b 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1550,10 +1550,10 @@ resolved "https://registry.yarnpkg.com/@colors/colors/-/colors-1.5.0.tgz#bb504579c1cae923e6576a4f5da43d25f97bdbd9" integrity sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ== -"@cornerstonejs/adapters@^1.32.2": - version "1.32.2" - resolved "https://registry.yarnpkg.com/@cornerstonejs/adapters/-/adapters-1.32.2.tgz#f67ce50b6eab3a033c3847beeea3a54e4041eb30" - integrity sha512-ToxwxPp3A2bpR9TAlHasK4h7lQYiGENHIkwJ+Z0zdzrYwPGdFNaEHUk6XsA3vGhl6wWF3DhF7IU18nX20XL7kw== +"@cornerstonejs/adapters@^1.36.1": + version "1.36.1" + resolved "https://registry.yarnpkg.com/@cornerstonejs/adapters/-/adapters-1.36.1.tgz#ce6e1c7213adb629926d360f3fff327b22729846" + integrity sha512-dfiByBlH0Y97rSoqtGehik+e/Ydm+DNmVIfOpsBfbI6XuMoqBWXtcjI04Lwp5i0i4U64bKfQ8IfHA8UQ8jbrDQ== dependencies: "@babel/runtime-corejs2" "^7.17.8" buffer "^6.0.3" @@ -1607,10 +1607,10 @@ resolved "https://registry.yarnpkg.com/@cornerstonejs/codec-openjph/-/codec-openjph-2.4.5.tgz#8690b61a86fa53ef38a70eee9d665a79229517c0" integrity sha512-MZCUy8VG0VG5Nl1l58+g+kH3LujAzLYTfJqkwpWI2gjSrGXnP6lgwyy4GmPRZWVoS40/B1LDNALK905cNWm+sg== -"@cornerstonejs/core@^1.32.2": - version "1.32.2" - resolved "https://registry.yarnpkg.com/@cornerstonejs/core/-/core-1.32.2.tgz#02010a5a00c592dfbb7d49880fadd0e0b104af9f" - integrity sha512-z1dtIFjrcZ92aJqev5JV0mbRxOqPJnfRlyLn3TzcsPAzpwo8OPa4+iLR3nrXcXkORwPA1MZaA94JxiRAxvbfLA== +"@cornerstonejs/core@^1.36.1": + version "1.36.1" + resolved "https://registry.yarnpkg.com/@cornerstonejs/core/-/core-1.36.1.tgz#2fba0945cd5eff303ad7569a16cf7904779f5470" + integrity sha512-4vbXWz/4tlsYqnyI0unyY3yLv3gyn4+ARdPkaNFM03/jx1/8i/yp4r8VlXMds57/2XSzpav3ue9eFwCFuI4rVg== dependencies: "@kitware/vtk.js" "27.3.1" comlink "^4.4.1" @@ -1618,34 +1618,34 @@ gl-matrix "^3.4.3" lodash.clonedeep "4.5.0" -"@cornerstonejs/dicom-image-loader@^1.32.2": - version "1.32.2" - resolved "https://registry.yarnpkg.com/@cornerstonejs/dicom-image-loader/-/dicom-image-loader-1.32.2.tgz#0eceac4977562d90899f5454c477a677221eded9" - integrity sha512-sToKM5Ei+zllZl8UL1/3kWRyGZon99ds1lZs2Z4BN/0fr7/TIZCvajslY++JsYE0izUMhgAqaXFZZUNaLWFoqw== +"@cornerstonejs/dicom-image-loader@^1.36.1": + version "1.36.1" + resolved "https://registry.yarnpkg.com/@cornerstonejs/dicom-image-loader/-/dicom-image-loader-1.36.1.tgz#5059a4a45b99052457a222b12cd9207f3b298e13" + integrity sha512-lqkZLECZZKTe+88afX9z1KkejyHfcnpQmTWy5WFUsXW7e0dumrVbEKAxG/UAHYj0iY4RyY/Eo/k+LEZXYjB+YA== dependencies: "@cornerstonejs/codec-charls" "^1.2.3" "@cornerstonejs/codec-libjpeg-turbo-8bit" "^1.2.2" "@cornerstonejs/codec-openjpeg" "^1.2.2" "@cornerstonejs/codec-openjph" "^2.4.5" - "@cornerstonejs/core" "^1.32.2" + "@cornerstonejs/core" "^1.36.1" dicom-parser "^1.8.9" pako "^2.0.4" uuid "^9.0.0" -"@cornerstonejs/streaming-image-volume-loader@^1.32.2": - version "1.32.2" - resolved "https://registry.yarnpkg.com/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-1.32.2.tgz#9d29412f6af470fa4ce46d0b43735eed2aebc374" - integrity sha512-VisVikQrWAfVqg4rozDLv/3T1DHOsiqSfQUVUYIqmL8WP7hC88E9R/aJyrL2uj4J/zAIvxlbWJYN1RdkyaxFyQ== +"@cornerstonejs/streaming-image-volume-loader@^1.36.1": + version "1.36.1" + resolved "https://registry.yarnpkg.com/@cornerstonejs/streaming-image-volume-loader/-/streaming-image-volume-loader-1.36.1.tgz#3cf270b624a40e20a3163cdef338b507da83a29f" + integrity sha512-T9q36aPSUobTD0tJsgwayDKsgxlxVzav0cVOMkHxO10kOGC82DniZBm2WSg5mbn2caFo0YezPUaXfXuGqsqvMg== dependencies: - "@cornerstonejs/core" "^1.32.2" + "@cornerstonejs/core" "^1.36.1" comlink "^4.4.1" -"@cornerstonejs/tools@^1.32.2": - version "1.32.2" - resolved "https://registry.yarnpkg.com/@cornerstonejs/tools/-/tools-1.32.2.tgz#45961a1e6788ee7f660af3f1a013c0410b6ff2f6" - integrity sha512-kGL7m0Vk8OovqArTF8lyj/UpO6VBg+xqNnxnkyKXvi1sbLh7/4woRJS4W8sihOt6XBkMxHTMyHEiHEPHASuKbw== +"@cornerstonejs/tools@^1.36.1": + version "1.36.1" + resolved "https://registry.yarnpkg.com/@cornerstonejs/tools/-/tools-1.36.1.tgz#bb8e48d2363747b844a268205cb39f1bc39c7ce1" + integrity sha512-4Qu9hT+fx0tzPHte01wRsctYRSw8VznAu/xMOCVeniF9kIAxKzXLBvcxhKQS+gFr6HRD5nRxtflKKrKlna8nMw== dependencies: - "@cornerstonejs/core" "^1.32.2" + "@cornerstonejs/core" "^1.36.1" comlink "^4.4.1" lodash.clonedeep "4.5.0" lodash.get "^4.4.2" @@ -14227,7 +14227,7 @@ media-typer@0.3.0: resolved "https://registry.yarnpkg.com/media-typer/-/media-typer-0.3.0.tgz#8710d7af0aa626f8fffa1ce00168545263255748" integrity sha512-dq+qelQ9akHpcOl/gUVRTxVIOkAJ1wR3QAvb4RsVjS8oVoFjDGTc679wJYmUmknUF5HwMLOgb5O+a3KxfWapPQ== -medium-zoom@^1.0.8: +medium-zoom@^1.0.4: version "1.1.0" resolved "https://registry.yarnpkg.com/medium-zoom/-/medium-zoom-1.1.0.tgz#6efb6bbda861a02064ee71a2617a8dc4381ecc71" integrity sha512-ewyDsp7k4InCUp3jRmwHBRFGyjBimKps/AJLjRSox+2q/2H4p/PNpQf+pwONWlJiOudkBXtbdmVbFjqyybfTmQ==