GrapeCity ActiveReportsJS How to pass Authorization Header for DataSource

Posted by: bardic-04spans on 11 October 2022, 6:59 pm EST

  • Posted 11 October 2022, 6:59 pm EST - Updated 11 October 2022, 8:31 pm EST


    Seem this query regarding Active Reports JS is erroneously posted in ComponentOne Forums, Would suggest you to post it in the appropriate forum i.e Active Reports JS

  • Posted 4 November 2022, 7:40 am EST

    Hi, today I want to bring up the topic of crowdfunding. How much is why humanity has invented such a thing as collecting if dmi and making everyone a common product. Many small startups have grown into huge billion dollar companies because of it. I recommend you to read about all the benefits of crowdfunding in this article: .

  • Posted 23 November 2022, 10:29 pm EST

    Sorry, probably off-topic, I’m considering buying JavaScript Report Designer but Do you have any tutorial video or document on how to create a report with the HTTP POST method for react.js? I always get an “Incorrect query string” error.

  • Posted 30 November 2022, 1:07 am EST

    I take it no one knows the answer? This error is repeated over and over again

  • Posted 22 December 2022, 12:48 am EST

    Hi, LinkedIn lead generation is in high demand right now and there are CRMs to help with this and save you time. You just create your own funnel for the audience you want and your leads are generated. LinkedIn lead generation is a central focus for any B2B organisation in 2023 that’s interested in driving consistent and reliable revenue. We suggest to use Octopus CRM LinkedIn lead generation tool for your business.

  • Posted 3 January 2023, 11:29 pm EST

    To pass an authorization header for a data source in ActiveReportsJS, you can use the ‘headers’ property of the data source configuration object. This property should be set to an object containing the headers that you want to send with the data source request. For example:

    const dataSource = {
      type: 'odata',
      url: '',
      headers: {
        Authorization: 'Bearer YOUR_TOKEN_HERE'

    You can also set the headers property to a function that returns an object containing the headers. This can be useful if you need to dynamically generate the headers based on the current context or user input.

    For example:

    const dataSource = {
      type: 'odata',
      url: '',
      headers: () => {
        const token = getAuthToken();
        return {
          Authorization: `Bearer ${token}`

    I hope this helps! Let me know if you have any additional questions.

Need extra support?

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

Learn More

Forum Channels