My application is trying to display PDF stored in the database when user click on the icon link.
When the link is clicked, it will fire an Ajax call to Web service which using the ID to retrieve the PDF data in byte[] array.
The html component:
<a href="#" onclick="getSPOD(<%=TransportationDocument != null ? TransportationDocument.BusinessID.ToString() : String.Empty %>);return false;">
<img alt="SPOD" src="images/icons/adobe_acrobat_icon.png">
</a>
The Ajax call:
function getSPOD(id) {
$.ajax({
type: "GET",
url: `Services/MyService.asmx/RetrieveSPODData?id='${id}'`,
contentType: 'application/json; charset=utf-8',
success: function (data) {
console.log(data);
},
error: function (textStatus, errorThrown) {
console.log(textStatus);
console.log(errorThrown);
}
});
}
The web service method:
[ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet = true)]
[WebMethod]
public HttpResponse RetrieveSPODData(string id)
{
string query = @"Select * from dcmnts
where BUSNSS_ID = :BUSNSS_ID";
DataTable dataTable = new DataTable();
OracleCommand command = null;
OracleDataAdapter adapter = null;
string ConnString = ConfigurationManager.ConnectionStrings["DbConnEnc"].ToString();
byte[] data = null;
using (OracleConnection connection = new OracleConnection(BaseEncryptor.DecryptString(ConnString)))
{
try
{
if (connection.State != ConnectionState.Open)
connection.Open();
command = new OracleCommand(query, connection);
command.Parameters.Add(new OracleParameter("BUSNSS_ID", id));
adapter = new OracleDataAdapter(command);
adapter.Fill(dataTable);
foreach (DataRow row in dataTable.AsEnumerable())
{
data = row.Field<byte[]>("SUMMARY_SPOD");
}
HttpContext.Current.Response.ClearHeaders();
HttpContext.Current.Response.AddHeader("Content-Disposition", "inline;filename=file.pdf");
HttpContext.Current.Response.ContentType = "application/pdf";
HttpContext.Current.Response.BinaryWrite(data);
HttpContext.Current.Response.Flush();
HttpContext.Current.Response.End();
return HttpContext.Current.Response;
}
finally
{
if (adapter != null) { adapter.Dispose(); adapter = null; }
if (command != null) { command.Dispose(); command = null; }
}
}
}
Syntax-wise, there is no problem. However, I don't know how to display the pdf from there. By using HttpContext.Current.Response methods, I am able to open the PDF in a new tab if I run the web service directly from visual studio. However, if I do it through the web interface I have implemented, nothing happend. So I though I may need to return the HttpContext.Current.Response, I tried to log it to see what is in the data, I received unreadable data.
How should I display the PDF from byte[] from web service? What do I need to do for my web service to serve up the resulting file?
Method 2: Return byte[] data to the ajax call and use the following:
var file = new Blob([data.d], { type: 'application/pdf' });
var fileURL = URL.createObjectURL(file);
window.open(fileURL);
By doing this, the PDF file could not be open properly as if it is damaged
