skip to Main Content

First of all, the specifications are as follows.

The module settings are as follows.

export const SetSciChartSurface = () => {
  SciChartSurface.setRuntimeLicenseKey(window.REACT_APP_SCICHART_KEY);
  SciChartSurface.configure({
    wasmUrl: "./scichart2d.wasm",
    dataUrl: "./scichart2d.data",
  });

  SciChartDefaults.useSharedCache = true;

  return SciChartSurface;
};

My problem is nginx, so I can set it as below

location / {
 root "C:\nginx\build\indexViewer";
 index index.html index.htm;
 try_files $uri $uri/ /index.html;
}

If you write it as below, you will get an error like the picture. Of course, the scichart2d.wasm file and the scichart2d.data file have been received well in 200 OK.

location /indexViewer {
    alias   "C:\nginx\build\IndexViewer";
    sub_filter assets/ indexViewer/assets/; 
    sub_filter_once off;
    sub_filter_types *;
}

enter image description here

Could not load SciChart WebAssembly Module.Check your build process and ensure that your scichart2d.wasm, scichart2d.data and scichart2d.js files are from the same version

I’ve been struggling for months now. I’ve been sharing projects with different ports through nginx, but I don’t want to do that, so I’ve been using alias. But if you do it with alias instead of root, these problems happen.

I’m hoping that that error doesn’t come out.

2

Answers


  1. Chosen as BEST ANSWER

    My web is good at importing .wassm, .data files. 404 doesn't show up. CDN is not available because the web is a closed network.

    I bring the .wassm, .data file well, but the console window displays an error and the chart is not displayed. What you should know here is that if you divide the ports into nginx and distribute it, it works normally. But I don't want to use multiple ports, so if I divide them into nginx alias and distribute them to the same port, there will be a problem. Of course, if you distribute the chart as root on the same port, it works fine.

    For example, there was no error in project deployment using 50080 and 50081 ports, but errors occur when distributing 50080 ports divided by path.

    an existing thing

    • 127.0.0.1:50080
    • 127.0.0.1:50081

    What I want

    • 127.0.0.1:50080/
    • 127.0.0.1:50080/indexViewer

  2. To understand the root cause of the error, firstly check if the expected files are loaded properly: no 404 errors and the appropriate contents of .data and .wasm files are fetched.
    Then, to match your location structure use SciChartSurface.configure (or SciChart3DSurface.configure) method to customize URLs for those files.

    Refer to the documentation page on Deploying Wasm files for more info.

    There is also another tutorial on the scichart site which details errors if Wasm files are not found and the potential solutions. Find this here.

    Calling SciChartSurface.configure() with incorrect URL/file path, or if the files are incorrectly served can result in a multitude of errors in the output console.

    Some of the errors include

    Failed to load resource: the server responded with a status of 404 (Not Found) …scichart2d.wasm

    Could not load SciChart WebAssembly module. Check your build process and ensure that your scichart2d.wasm, scichart2d.data
    and scichart2d.js files are from the same version

    ….

    All these errors essentially mean the same thing: either the URL/Path to the *.wasm files is incorrect, or the files are incorrectly served.

    The page suggests some solutions how to debug this using developer tools – first by checking the request URL and next testing that the *.wasm files are served with the correct MIME type and application/octet-stream

    Debugging WASM not loading scichart.js

    Finally, there is a boilerplate example using React and Vite on the scichart Github page: https://github.com/ABTSoftware/SciChart.JS.Examples/tree/master/BoilerPlates/react-vite

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search