Vue+CornerstoneJS渲染DICOM报错：非有效DICOM P10文件求助

我在用CornerstoneJS库渲染某公司提供的DICOM文件时，浏览器控制台报错提示该文件不是有效的DICOM P10文件。另外，CornerstoneJS官方文档对代码导入的说明不够清晰，导致整个实现过程很吃力，希望技术人员能提供帮助。

我的代码如下： #

... 

import dicomParser from 'dicom-parser'
import * as cornerstone from 'cornerstone-core'
import * as cornerstoneTools from 'cornerstone-tools'
import * as cornerstoneWADOImageLoader from 'cornerstone-wado-image-loader'

export default {
  name: 'Viewport',
  data: () => ({
    helpers: {
      gridHelper: undefined
    },
    controls: {
      camera: undefined,
      scene: undefined,
      renderer: undefined,
      mesh: undefined,
      control: undefined
    }
  }),
  props: {
    axialImageId: { type: String, default: 'wadouri:https://example.com/SLZ000.dcm' },
    coronalImageId: { type: String, default: 'wadouri:https://example.com/SLZ000.dcm' },
    sagittalImageId: { type: String, default: 'wadouri:https://example.com/SLZ000.dcm' },
    axialStack: {
      type: Object,
      default: () => ({
        colormap: 'hot',
        invert: false,
        label: 'Axial',
        lut: '',
        modality: 'CT',
        rotation: 0,
        scale: 1.0,
        translation: { x: 0, y: 0 },
        voi: {
          windowCenter: 40,
          windowWidth: 400
        }
      })
    },
    coronalStack: {
      type: Object,
      default: () => ({
        colormap: 'hot',
        invert: false,
        label: 'Coronal',
        lut: '',
        modality: 'CT',
        rotation: 0,
        scale: 1.0,
        translation: { x: 0, y: 0 },
        voi: {
          windowCenter: 40,
          windowWidth: 400
        }
      })
    },
    sagittalStack: {
      type: Object,
      default: () => ({
        colormap: 'hot',
        invert: false,
        label: 'Sagittal',
        lut: '',
        modality: 'CT',
        rotation: 0,
        scale: 1.0,
        translation: { x: 0, y: 0 },
        voi: {
          windowCenter: 40,
          windowWidth: 400
        }
      })
    }
  },
  mounted () {
    // 初始化cornerstoneWADOImageLoader
    cornerstoneWADOImageLoader.external.cornerstone = cornerstone
    cornerstoneWADOImageLoader.external.typedArray = window.Uint8Array
    cornerstoneWADOImageLoader.external.dicomParser = dicomParser
    // cornerstoneWADOImageLoader.configure({
    //   beforeSend: function (xhr) {
    //     // 添加访问DICOM服务器所需的请求头
    //     xhr.setRequestHeader('Authorization', `Bearer ${authToken}`)
    //   }
    // })

    // 初始化断层扫描视图
    cornerstone.enable(this.$refs.axial, { renderer: 'webgl' })
    cornerstone.enable(this.$refs.coronal, { renderer: 'webgl' })
    cornerstone.enable(this.$refs.sagittal, { renderer: 'webgl' })

    cornerstone.loadImage(this.axialImageId).then(image => {
      cornerstone.displayImage(this.$refs.axial, image)
      cornerstoneTools.addStackStateManager(this.$refs.axial, ['stack'])
      cornerstoneTools.addToolState(this.$refs.axial, 'stack', this.axialStack)
    })

    cornerstone.loadImage(this.coronalImageId).then(image => {
      cornerstone.displayImage(this.$refs.coronal, image)
      cornerstoneTools.addStackStateManager(this.$refs.coronal, ['stack'])
      cornerstoneTools.addToolState(this.$refs.coronal, 'stack', this.coronalStack)
    })

    cornerstone.loadImage(this.sagittalImageId).then(image => {
      cornerstone.displayImage(this.$refs.sagittal, image)
      cornerstoneTools.addStackStateManager(this.$refs.sagittal, ['stack'])
      cornerstoneTools.addToolState(this.$refs.sagittal, 'stack', this.sagittalStack)
    })

...

内容的提问来源于stack exchange，提问作者GabrielTura