ActivereportNet Viewer for React application questions

Posted by: khang.pham on 17 March 2026, 1:48 am EST

  • Posted 17 March 2026, 1:48 am EST - Updated 17 March 2026, 1:53 am EST

    Hello

    I’m trying to integrate ActiveReportNet 20 to my current project. I’m using .NET Core for backend and React for frontend. In React app, I’m using @mescius/activereportsnet-viewer version 20.0.1. I’m able to load the Report viewer, all using default setting. And I have some questions:

    1. In the Export panel, I tried to put the file name in, but when I hit Export button. The export files always have the name “download”?



    2. I’m trying to hide some options in the Export Panel. My code:

    let jsViewer = createViewer({
      element: "#viewer-host",
      reportService: {
        url: xxx,
        securityToken: xxx,
      },
      themes: themeConfig,
      availableExports: ["Pdf"],
      defaultExportSettings: {
        pdf: {
          Application: {
            visible: false,
          },
          EmbedFonts: {
            visible: false,
          },
          Text: {
            visible: false,
          },
          FontName: {
            visible: false,
          },
        },
      },
    });

    Other fields can be hidden correctly except for those in WaterMark section (Text, FontName,…). How can I hide these fields?

  • Posted 18 March 2026, 4:46 am EST

    Hi Khang,

    Thank you for reaching out to MESCIUS support.

    We have investigated the behaviors you described: -

    1. Exporting filename as download: We haven’t been able to reproduce this behavior at our end. We tried to export the report with a different filename, and it’s working fine at our end. Could you please share a stripped-down reproducible sample with us to further investigate and provide you with a more accurate solution?

      Note: We recommend you check if the

      Name
      property of your report object is being set in your C# code.

      Or if you are assigning your name to the PDF export settings then use the
      FileName
      property and use ‘value’ to specify the name.

    2. Hiding Watermark Fields: To hide the options from the Watermark section, you can use the specific naming convention given below.

    WatermarkTitle: { visible: false },
    WatermarkFontName: { visible: false },
    

    You can refer to this link for more properties related to watermarks.

    We have also attached a sample for your reference.

    Thanks,

    Anand

    ViewerForReactApplication.zip

  • Posted 19 March 2026, 1:57 am EST - Updated 19 March 2026, 2:02 am EST

    Hi Anand, thanks for responding

    The Watermark hiding works good.

    For the download report name, it still does not work when using your attached sample unfortunately (it’s very similar to mine).

    Here what’s I found:

    When put in the name and click Export button, I checked the API called from the viewer to backend. It seemed correct to me. The response headers include content-disposition with the correct file name:

    But the browser seemed to ignore that and added the generic file name “download.pdf”

    I copy the endpoint and tried to use postman to call it. The result returned with correct file name

    I tried on Chrome, Firefox, Edge and all had the same issue. I don’t set any Name or FileName in C# code. And the fact that calling from Postman works indicates that my backend seems to be correct. It’s hard to share you the sample code though because it also needs to have a database to bind to it.

  • Posted 20 March 2026, 12:47 am EST

    Hi Khang,

    Thank you for the detailed observation.

    Since the export API returns the correct Content-Disposition header and works as expected in Postman, the backend appears to be functioning correctly.

    Also, as the same behavior is observed across multiple browsers and even with the provided sample, this points towards an environment-specific issue on the client side rather than a problem with ActiveReports itself.

    We recommend that you check the following:-

    • Check for Blob Handling: If you are using a proxy in React, ensure it isn’t stripping headers before they reach the @mescius/activereportsnet-viewer component.
    • Manual handling of exported file:: If you are managing the export API to be downloaded from your client-side code, then make sure, before calling the ‘download’ method, you specify a file name to the blob.
    • PDF Extensions: The issue may be related to some PDF Extensions installed on your browser, such as a PDF viewer that may be opening the PDF file directly, and downloading it may be renaming the file. Check whether downloading the PDF in an incognito tab resolves the issue, if yes then there is some extension that is overriding the file name.
    • Try to run these samples in other environments: Please try running the same sample in a different or clean environment (e.g., another machine or a minimal React setup). If the issue does not reproduce there, it will confirm that the behavior is specific to your current environment. You can then compare configurations to identify the exact difference causing the issue.

    As this issue is not specific to ActiveReports we’ll also suggest you to check out other forums such as StackOverflow to find posts where users may be facing a similar issue, as it may lead to towards the cause of the issue.

    Thanks,

    Anand

Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels