Excel on the web Add-in using ASP.Net in server-side with CORS problems

Leonardo Santos 1 Reputation point

I developed an Excel Add-in using JavaScript API (office.js). Then, I'm using an Asp.Net MVC at the server-side. This works fine on excel desktop, but custom functions don't work in Excel on the web. When I inspect the task pane it shows these errors:


In Excel on the Web, the task pane and the commands work fine. The CORS problem in functions.json is strange because this archive belongs to the dist folder.

I see these documents and tried to modify the HTTP response headers but it doesn't work.



OBS: Everything is hosted at the same domain

Can you give me some direction?

A set of technologies in the .NET Framework for building web applications and XML web services.
3,315 questions
JavaScript API
JavaScript API
An Office service that supports add-ins to interact with objects in Office client applications.
902 questions
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. Yijing Sun-MSFT 7,071 Reputation points

    Hi @Leonardo Santos ,
    If you don’t control the server your frontend code is sending a request to, and the problem with the response from that server is just the lack of the necessary Access-Control-Allow-Origin header, you can still get things to work—by making the request through a CORS proxy.

    You can easily run your own proxy using code from https://github.com/Rob--W/cors-anywhere/.
    You can also easily deploy your own proxy to Heroku in just 2-3 minutes, with 5 commands:

    git clone https://github.com/Rob--W/cors-anywhere.git  
    cd cors-anywhere/  
    npm install  
    heroku create  
    git push heroku master  

    After running those commands, you’ll end up with your own CORS Anywhere server running at, e.g., https://cryptic-headland-94862.herokuapp.com/.

    Now, prefix your request URL with the URL for your proxy:


    Adding the proxy URL as a prefix causes the request to get made through your proxy, which then:

    1. Forwards the request to https://example.com.
    2. Receives the response from https://example.com.
    3. Adds the Access-Control-Allow-Origin header to the response.
    4. Passes that response, with that added header, back to the requesting frontend code.

    The browser then allows the frontend code to access the response, because that response with the Access-Control-Allow-Origin response header is what the browser sees.

    This works even if the request is one that triggers browsers to do a CORS preflight OPTIONS request, because in that case, the proxy also sends back the Access-Control-Allow-Headers and Access-Control-Allow-Methods headers needed to make the preflight successful.

    More details,you could refer to below article:
    Best regards,
    Yijing Sun

    If the answer is helpful, please click "Accept Answer" and upvote it.

    Note: Please follow the steps in our  documentation  to enable e-mail notifications if you want to receive the related email notification for this thread.

    0 comments No comments