Hello all.
I am using a drag-drop functionality + simple file upload (html <file> control) to auto upload pdf files as a user drops or choose a pdf file. For this work i opted to use javascript and asp.net4.0 (not jquery).
When user drops the file, i grab it and send this file using xmlhttpobject's send method to a Http generic handler (written in vb.net).
I am getting the dropped file as stream( in handler code )using Request.InputStream.
The problem is, when i write this strem to filestream and creats a pdf file, the newly created file has stream code written into it. (not graphics of PDF but the stream machine understandable code). I just need that the uploaded file will look same the dropped file.
I am assuming that i am missing something content-type or encoding specifications while creating file. I do not know how to resolve this. Please help me, i am copying all code involves in this.
Javascript Code:
This Function runs when a file dragged or choosed:
function FileSelectHandler(e) {
FileDragHover(e);
var files = e.target.files || e.dataTransfer.files;
for (var i = 0, f; f = files[i]; i++) {
UploadFile(f);
}
}
This is the main function that uploads the file
function UploadFile(file) {
var xhr = new Async();
var path;
if (xhr.upload) {
var url = "X_Upload.ashx";
xhr.open("post", url, true);
xhr.setRequestHeader("X_FILENAME", file.name);
xhr.setRequestHeader("Content-Type", file.type);
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
var response = eval("(" + xhr.responseText + ")");
path = response; alert(path);
}
}
xhr.send(file);
}
}
function Async() {
var objXMLHttp = null;
if (window.XMLHttpRequest) {
objXMLHttp = new XMLHttpRequest();
}
else if (window.ActiveXObject) {
try {
objXMLHttp = new ActiveXObject("Msxml2.XMLHTTP.4.0");
}
catch (e) { try { objXMLHttp = new ActiveXObject("MSXML2.XMLHTTP"); } catch (e) { try { objXMLHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { objXMLHttp = null; } } }
}
return objXMLHttp;
}
Handler, X_Upload.ashx code:
<%@ WebHandler Language="VB" Class="X_Upload" %>
Imports System
Imports System.IO
Imports System.Web
Public Class X_Upload : Implements IHttpHandler, IRequiresSessionState
Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
Dim folderName As String
If Not context.Session("CurrentProofFolder") Is Nothing Then
folderName = context.Session("CurrentProofFolder")
Else
folderName = Guid.NewGuid.ToString
context.Session("CurrentProofFolder") = folderName
End If
Dim rootPath As String = context.Server.MapPath("~")
Dim currentDir As String = rootPath & "\Files\" & folderName
If Not Directory.Exists(currentDir) Then
Directory.CreateDirectory(currentDir)
End If
Dim filePath As String = currentDir & "\" & context.Request.Headers("X_FILENAME")
Dim fs As New FileStream(filePath, FileMode.Create, FileAccess.ReadWrite)
Dim fileData As Byte() = New Byte(context.Request.InputStream.Length) {}
' Read the file into a byte array
context.Request.InputStream.Read(fileData, 0, context.Request.InputStream.Length)
fs.Write(fileData, 0, context.Request.InputStream.Length)
fs.Dispose()
End Sub
Public ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
Get
Return False
End Get
End Property
End Class
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Please also take a look, how the pdf is looking after creation, I am pasting only few lines inside the created pdf file as the files has 1500 lines.
%PDF-1.5
%âãÏÓ
1 0 obj
<</Metadata 2 0 R/OCProperties<</D<</ON[5 0 R]/Order 6 0 R/RBGroups[]>>/OCGs[5 0 R]>>/Pages 3 0 R/Type/Catalog>>
endobj
2 0 obj
<</Length 50618/Subtype/XML/Type/Metadata>>stream
<?xpacket begin="" id="W5M0MpCehiHzreSzNTczkc9d"?>
<x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="Adobe XMP Core 5.0-c060 61.134777, 2010/02/12-17:32:00 ">
<rdf:RDF xmlns:rdf="http:
<rdf:Description rdf:about=""
xmlns:dc="http://purl.org/dc/elements/1.1/">
<dc:format>application/pdf</dc:format>
<dc:title>
<rdf:Alt>
<rdf:li xml:lang="x-default">26823_artproof_1</rdf:li>
</rdf:Alt>
</dc:title>
</rdf:Description>
<rdf:Description rdf:about=""
xmlns:xmp="http://ns.adobe.com/xap/1.0/"
xmlns:xmpGImg="http://ns.adobe.com/xap/1.0/g/img/">
<xmp:MetadataDate>2012-04-18T03:49:52+08:00</xmp:MetadataDate>
<xmp:ModifyDate>2012-04-18T03:49:52+08:00</xmp:ModifyDate>
<xmp:CreateDate>2012-04-18T03:49:52+09:00</xmp:CreateDate>
<xmp:CreatorTool>Adobe Illustrator CS5.1</xmp:CreatorTool>
<xmp:Thumbnails>
<rdf:Alt>
<rdf:li rdf:parseType="Resource">
<xmpGImg:width>256</xmpGImg:width>
<xmpGImg:height>256</xmpGImg:height>
<xmpGImg:format>JPEG</xmpGImg:format>
Please help me to create the actual pdf file, this is very important.
Thank you all for your kind help.
Praveen