DEV Community: 𝐉𝐚𝐢𝐦𝐞 𝐁𝐚𝐥𝐭𝐨𝐝𝐚𝐧𝐨

Create a C# API Controller to launch SSRS Report

𝐉𝐚𝐢𝐦𝐞 𝐁𝐚𝐥𝐭𝐨𝐝𝐚𝐧𝐨 — Tue, 24 Aug 2021 22:15:38 +0000

In this article I am going to build a C# API Controller to launch a SSRS Report using windows credentials and send back the response to client.

The first thing to do is know the URL of our SQL SSRS,
for this sample let's suppose it is:
http://devsqlserver/Reports/Payrol/CancelationReport

Be aware this is not the web server URL, this is just the browser URL, here it's necessary to identify the folder name and the report name.

The way to know the webserver URL is look into the configuration of SSRS server. Regularly should look like this
http://<SERVERNAME>/ReportServer

So, in my case it is in fact http://devsqlserver/ReportServer

Here launch an SSRS report in a browser you can read a good article about this.

At this point I have the three data necessary to complete URL
http://devsqlserver/ReportServer/Payrol/CancelationReport

Get report path using SQL query

If you have problems getting the correct report path, you could also use a simple select query

select * from [reportserver].[catalog]

The result of this query will give you all the existing reports on the SSRS Server, so you can know the right path of every one.

Once I have the URL, it's now time to start working with the C# code of my controller

In this example I will assume the SSRS server is configured to accept windows credentials to launch reports

So if you already have created an empty API Controller, this is the segment code you need to know

C# Fragment Code

string ssrsServer = "http://devsqlserver/ReportServer?";
string rptname = "/Payrol/CancellationReport";
string param = "&rc:Parameters=false&rs:Command=Render&rs:Format=PDF&WarrantyPurchaseDateTo=6/02/2021";

try
  {
    Uri ssrsUrl = new Uri(ssrsServer + rptname + param);
    ICredentials credentials = CredentialCache.DefaultCredentials;
    NetworkCredential credential = credentials.GetCredential(ssrsUrl, "Basic");

    WebClient client = new WebClient();
    client.Credentials = credential;
    //Read response
    var response = client.DownloadData(ssrsUrl);
    //Convert response into Base64 string
    var base64format = Convert.ToBase64String(response);
    return = base64format;
  }

Now it is time to explain the code fragment:
First I have the string variable that save the webserver, other variable to save the report path and the last one to save the parameters this report is going to use.

Please take note of "?" after web server , this is mandatory

This variable that save the parameters also needs to save other information that tells SSRS how to render the report, in this case I using a PDF format, but it can also support some other formats like: XML, HTML4.0, EXCEL, WORD, CSV, RPL.
You can find more detail information in this page Export paginated reports

Then just need to read the windows credentials and pass it to the Webclient.

ICredentials credentials = CredentialCache.DefaultCredentials;
NetworkCredential credential = credentials.GetCredential(ssrsUrl, "Basic");

WebClient client = new WebClient();
client.Credentials = credential;

If your URL is well formed and the credentials you send are accepted by SSRS webserver, taking note that expected format is PDF

var response = client.DownloadData(ssrsUrl);
var base64format = Convert.ToBase64String(response);

The variable base64format saves a Base64 string that you could return to the client and transform that string into the correct file.

Agregar webreference en SSIS VS2015

𝐉𝐚𝐢𝐦𝐞 𝐁𝐚𝐥𝐭𝐨𝐝𝐚𝐧𝐨 — Thu, 29 Oct 2020 15:49:50 +0000

En SSIS VS2015, al agregar una referencia web, dentro de un script-component, se deben usar las referencias del framework 2.0 y no reusar las existentes.

De esa manera se evita tener el problema que se compila correctamente el componente, pero el flujo DTS marca error
SSIS Error: The binary code for the script is not found

Como usar Google Maps API y React Hooks

𝐉𝐚𝐢𝐦𝐞 𝐁𝐚𝐥𝐭𝐨𝐝𝐚𝐧𝐨 — Sun, 31 May 2020 23:29:48 +0000

Buscando en internet un ejemplo de uso de la API de google maps con React; pude encontrar varios ejemplos pero ninguno por medio de hooks.
Es por eso que en este ejemplo, quiero compartir un ejemplo del uso del paquete google-maps-react y react hooks.
Esta aplicacion usara la API de google maps y tambien la API para saber la ubicacion de Estacion Espacional Internacional (ISS)

Estructura de Archivos

Version de React

El uso de Hooks es implemento en React 16.8, asi que se necesita de una version igual o superior a esta, para poder ejecutar este ejemplo.

1. Crear la app

yarn create-react-app isstracker

2. Instalar dependencias

yarn add google-maps-react
yarn add axios

3. Crear carpetas

Crear la carpeta para los state components

Crear carpeta Src\Containers

Crear la carpeta para los presentational components

Crear carpeta Src\Components

4. Agregar archivos

Crear archivo MapContainer.js dentro de la carpeta Src\Components
Crear archivo IssTracker.js dentro de la carpeta Src\Containers

5. High Order Component

Como ejemplo adicional, hare uso de High Order Components, para eso creare una carpeta Src\Hoc
Y en esa carpeta creare un archivo HocAux.js

En este momento, ya se debe tener la estructura de archivos necesaria para poder iniciar a desarrollar el ejemplo.

Desarrollo de APP

1. Creacion de High Order Component

Para este ejemplo, el HOC contendra lo siguiente:

const HocAux = props => props.children;
export default HocAux

2. Archivo IssTracker.js

En este archivo importo los hooks useState y useEffect

import React, {useState, useEffect} from 'react'

En el archivo IssTracker en la carpeta (Src\Containers), coloco los imports de Axios para poder obtener la informacion posicionamiento de la Estacion Espacial Internacional (Iss Tracker API)

import Axios from 'axios';

Creo la funcion

const IssTracker = () => {
}
export default IssTracker;

Dentro de la funcion coloco el uso de Hook useState

const IssTracker = () => {
  const [ trackerState, setTrackerState ]= useState({
    issInfo:{velocity:'', latitude:'', longitude:''},
    error: false,
  });

el Hook useState, es una funcion que regresa dos valores: un objeto que contiene la informacion y una funcion que permite modificar la informacion.

Ya se tiene el objeto que guardara la informacion que deseo del API con la informacion de ISS. Ahora hay que obtener la informacion de API y guardarla.

Para eso hago uso del Hook useEffect, y coloco la funcion despues de haber creado el objeto trackerState

  useEffect(() => {
    setTimeout(() => {
      Axios.get("https://api.wheretheiss.at/v1/satellites/25544.json")
      .then(response => {
        setTrackerState({
          issInfo:{velocity:response.data.velocity, latitude:response.data.latitude, longitude:response.data.longitude},
          error: false,
        })
      })
      .catch(error => {
        setTrackerState({
          issInfo:{velocity:'', latitude:'', longitude:''},
          error: false,
        })
      })
    }, 1000);
  });

La informacion se estara obteniendo cada segundo.
Despues se debe agregar el return de la funcion, por el momento sera un div vacio

return(
<div></div>
)

3. Archivo App.js

Importo el component IssTracker

import IssTracker from './Containers/IssTracker'

Se presenta el elemento resultante

function App() {
  return (
    <div className="App">
      <IssTracker></IssTracker>
    </div>
  );
}

4. Archivo MapContainer.js

En este archivo importo los componentes que usare de google-maps-react

import { Map, GoogleApiWrapper, Marker } from 'google-maps-react';

Tambien importo el HOC

import HocAux from '../hoc/HocAux';

Creo el un Style para que se muestre el mapa en pantalla completa

const mapStyles = {
    width: '100%',
    height: '100%',
};

Creo la funcion que presentara el mapa en pantalla

const MapContainer = props => {
}

Como dice la documentacion del paquete Google-Maps-React , debo colocar el export de esta manera

export default GoogleApiWrapper({
    apiKey: ("YOUR_GOOGLE_API_KEY")
})(MapContainer)

El contenido de la funcion MapContainer es asi

const MapContainer = props => {
    let iconMarker = new window.google.maps.MarkerImage(
        "https://img.icons8.com/color/48/000000/satellite.png",
        null,
        null,
        null,
        new window.google.maps.Size(32, 32)
    );

    let mapTrack = ((props.latitude !== "") ?
        <Map google={props.google} zoom={5} style={mapStyles} initialCenter={{ lat: props.latitude, lng: props.longitude }} >
            <Marker position={{ lat: props.latitude, lng: props.longitude }}
                icon={iconMarker}
            />
        </Map> : null)


    return (
        <Aux>
            {mapTrack}
        </Aux>
    );
};

5. Archivo IssTracker.js

Importo el componente MapContainer

import MapContainer from '../Components/MapContainer'

este es el return del archivo IssTracker

  return (
    <MapContainer velocity= {trackerState.issInfo.velocity} latitude= {trackerState.issInfo.latitude} longitude= {trackerState.issInfo.longitude}/>
  )

6. Pruebo la ejecucion

yarn start -watch