# Using ComponentOne Web API Edition Template

## Content



If you have installed Web API Edition from C1Studio installer, then it is easy to create a project pre-configured with FlexReport Web API. Use the C1 Web API Template to create a new project named FlexreportWebAPI and follow the steps below:

*   [Step 1: Create a new WebAPI application](/componentone/docs/webapi/online-webapi/Services/ReportServices/WorkingwithReports/UsingC1WebAPITemplate#step1-create-a-new-webapi-application)
*   [Step 2: Add Report files to Web API Application](/componentone/docs/webapi/online-webapi/Services/ReportServices/WorkingwithReports/UsingC1WebAPITemplate#step-2-add-report-files-to-web-api-application)
*   [Step 3: Set Report's Root Location](/componentone/docs/webapi/online-webapi/Services/ReportServices/WorkingwithReports/UsingC1WebAPITemplate#step-3-set-reports-root-location)
*   [Step 4: Deploy FlexReport Web API Service](/componentone/docs/webapi/online-webapi/Services/ReportServices/WorkingwithReports/UsingC1WebAPITemplate#step-4-deploy-report-web-api-service)

### Step1: Create a new WebAPI application

1.  In Visual Studio, select **File | New | Project** to create a new Web API Service Project.
2.  Under installed templates, select **Visual C# | Web | C1 Web API Application** to create a new C1 Web API Service application.
3.  Set a **Name** and **Location** for your application, and then Click **OK.**
4.  In the **ComponentOne ASP.NET Web API Application Wizard**, select **Report services** option.<br /><br />![](https://cdn.mescius.io/document-site-files/images/66c72527-2495-47b0-9257-2ee31dae74e5/images/report.png)<br />
5.  Once you have selected the **Services** from the wizard, click **OK** to create a new **C1 Web API Service application**.

### Step 2: Add Report files to Web API Application

Complete the following steps to add report files to your application.

1.  Add a folder named **Files** to your application.
2.  Add the FlexReport's report definition file to it.<br />If the report is using any local database (such as an MDB or an MDF file), then add the database to the **App\_Data** folder of your application. However, make sure that the connection string of the reports are pointing to the **App\_Data** folder accordingly.<br /><br />![](https://cdn.mescius.io/document-site-files/images/66c72527-2495-47b0-9257-2ee31dae74e5/images/flexreportdatasource.png)<br />
	> type=note
	> **Note**: Make sure you add **Microsoft.Owin.Cors** Nuget package in your application, for app.UseCors();

### Step 3: Set Report's Root Location

1.  In the **Startup.cs** file, add the following code inside **Configuration** method of the **Startup class**.
    
    ```csharp
    app.UseCors(CorsOptions.AllowAll);
    app.UseReportProviders()
    .AddFlexReportDiskStorage("ReportsRoot", GetFullRoot("Files"))
    ```
    
    This code registers the folder/location where the Report files will be stored, in this case it is the "Files" folder.
    
2.  Add the **GetFullRoot** function inside **Startup** class.
    
    ```csharp
    private static string GetFullRoot(string root)
    {
            var applicationBase = AppDomain.CurrentDomain.SetupInformation.ApplicationBase;
            var fullRoot = Path.GetFullPath(Path.Combine(applicationBase, root));
            if (!fullRoot.EndsWith(Path.DirectorySeparatorChar.ToString(), StringComparison.Ordinal))
            {
                    fullRoot += Path.DirectorySeparatorChar;
            }
            return fullRoot;
    }
    ```

### Step 4: Deploy Report Web API Service

1.  Compile the project.
2.  Deploy the project to IIS.

The Web API URL, for service will be hosted on local IIS.


> type=note
> **Note**: Once you have successfully created **Web API URL** for Report Services, you can access and view reports stored in the service using FlexViewer for MVC and Wijmo Viewer. For more information on how to view reports, see [Viewing Reports in FlexViewer](http://helpcentral.componentone.com/nethelp/c1mvchelpers/webframe.html#ViewingReportsinFlexViewer.html).