How do you add drag-n-drop upload ability from Outlook to a Web form?

Question

I am looking for a way to allow users to upload Outlook emails to a web-based system in a simple manner.

I can get this to work in a manual fashion for the users. They can drag and drop the email from Outlook to their desktop, which creates a .msg file. This works very nicely, esp. if there are attachments in the email which are also stored in the .msg file. This file can then be uploaded using a traditional "input type=file" html field.

I would like to simplify this process, if possible. I have seen some websites that have a drag-n-drop upload feature for files that exist on the hard drive.

However, I am not sure if anything exists that would allow for a straight drag-n-drop from Outlook that could create a .msg file or something similar and handle the file upload. In other words, a solution to cut out the manual step of dragging the email message to the desktop to create the temporary .msg file for upload.

Is this possible, and if so, how? All of the users are currently on Windows XP and have Outlook 2007, IE6 or higher, and Firefox. The backend server is running Java for the application in question (our programming staff uses ASP.NET w/ C# for our web development), though I assume any solution would be largely based upon a client-side technology like Flash or JQuery.

Answer 1

I don't think you'll achieve this with jQuery / JavaScript - you might have a chance with something like Flash.

As an alternative, could you create a simple client application that they can run on their desktop, which allows them to drag the message onto - that way, you can be running in full trust and perform whatever tasks you wish to get the file and upload it from this application (this was the solution used by a file-scanning application I once worked on - we had a small window that users could drag the file or email onto to initiate the upload to the scan store.

Answer 2

How did you eventually implement this? I was looking for a similar solution but couldnt find much so ended up using a VBA macro in Outlook which they click on when a message is selected. The message is then copied as a .msg to their temp folder, then submitted to an HTML form.

I have added the code I patched together from various web sources (including here - sorry, I didnt remember to save the links) below in case anybody ever wants to do the same.

Im sure it can be optimized etc as I am very new to VBA (yesterday!) but it does the job for now, although one think I would like to do is check if an IE window exists and add a new tab rather than opening a new browser every time it is clicked.

' Function to maximize IE window
Declare Function apiShowWindow Lib "user32" Alias "ShowWindow" (ByVal hwnd As Long, ByVal nCmdShow As Long) As Long

Global Const SW_MAXIMIZE = 3
Global Const SW_SHOWNORMAL = 1
Global Const SW_SHOWMINIMIZED = 2

Sub test()
 'the mail we want to process
Dim objItem As Outlook.MailItem
 'question for saving, use subject to save
Dim strPrompt As String, strname As String
 'variables for the replacement of illegal characters
Dim sreplace As String, mychar As Variant, strdate As String
 'put active mail in this object holder
Set objItem = Outlook.ActiveExplorer.Selection.Item(1)
 'check if it's an email ... need to take a closer look cause
 'gives an error when something else (contact, task) is selected
 'because objItem is defined as a mailitem and code errors out
 'saving does work, if you take care that a mailitem is selected
 'before executing this code
If objItem.Class = olMail Then
     'check on subject
    If objItem.Subject <> vbNullString Then
        strname = objItem.Subject
    Else
        strname = "No_Subject"
    End If
    strdate = objItem.ReceivedTime
     'define the character that will replace illegal characters
    sreplace = "_"
     'create an array to loop through illegal characters (saves lines)
    For Each mychar In Array(" ", "/", "\", ":", "?", Chr(34), "<", ">", "¦")
         'do the replacement for each character that's illegal
        strname = Replace(strname, mychar, sreplace)
        strdate = Replace(strdate, mychar, sreplace)
    Next mychar
     'Prompt the user for confirmation
    strPrompt = "Upload the email to CRM?"
    If MsgBox(strPrompt, vbYesNo + vbQuestion) = vbYes Then
        Dim location As String
        Dim tempPath As String
        tempPath = IIf(Environ$("tmp") <> "", Environ$("tmp"), Environ$("temp"))
        location = tempPath & "\" & strname & "-" & strdate & ".msg"
        objItem.SaveAs location, olMSG
        'upload to IE
        UploadFile "http://intranet/test.php", location, "msgupload"
    End If
End If
End Sub

'******************* upload - begin
'Upload file using input type=file
Sub UploadFile(DestURL As String, FileName As String, _
  Optional ByVal FieldName As String = "File")
  Dim sFormData As String, d As String
  'Boundary of fields.
  'Be sure this string is Not In the source file
  Const Boundary As String = "---------------------------0123456789012"
  'Get source file As a string.
  sFormData = GetFile(FileName)
  'Build source form with file contents
  d = "--" + Boundary + vbCrLf
  d = d + "Content-Disposition: form-data; name=""" + FieldName + """;"
  d = d + " filename=""" + FileName + """" + vbCrLf
  d = d + "Content-Type: application/upload" + vbCrLf + vbCrLf
  d = d + sFormData
  d = d + vbCrLf + "--" + Boundary + "--" + vbCrLf
  'Post the data To the destination URL
  IEPostStringRequest DestURL, d, Boundary
End Sub

'sends URL encoded form data To the URL using IE
Sub IEPostStringRequest(URL As String, FormData As String, Boundary As String)
  'Create InternetExplorer
  Dim WebBrowser: Set WebBrowser = CreateObject("InternetExplorer.Application")
  'You can uncoment Next line To see form results
  WebBrowser.Visible = True
  'Send the form data To URL As POST request
  Dim bFormData() As Byte
  ReDim bFormData(Len(FormData) - 1)
  bFormData = StrConv(FormData, vbFromUnicode)
  ' Submit message to intranet
  WebBrowser.Navigate2 URL, , , bFormData, "Content-Type: multipart/form-data; boundary=" + Boundary + vbCrLf
  ' Maximize window
  apiShowWindow WebBrowser.hwnd, SW_MAXIMIZE
End Sub

'read binary file As a string value
Function GetFile(FileName As String) As String
  Dim FileContents() As Byte, FileNumber As Integer
  ReDim FileContents(FileLen(FileName) - 1)
  FileNumber = FreeFile
  Open FileName For Binary As FileNumber
    Get FileNumber, , FileContents
  Close FileNumber
  GetFile = StrConv(FileContents, vbUnicode)
End Function
'******************* upload - end

A simple PHP script to capture the file would be:

<?php
if($_FILES['msgupload']){
move_uploaded_file($_FILES['msgupload']['tmp_name'], "./crm_uploads/".substr($_FILES['msgupload']['name'], 0 ,-24).".msg");
print("You are adding the email '".substr($_FILES['msgupload']['name'], 0, -24)."'");
print("<br />dated ".substr($_FILES['msgupload']['name'], -23, -4));
}
?>