Uploading files using jquery in asp.net asynchronously - c#

I was working on a project and it required me to upload image files (preferably all kinds of files). The requirement is that it should upload asynchronously but it seems to me that as I am not using HTML5 and my project is in ASP.NET 2 (or can be upgraded to 3.5) & C# (Web Forms), I think there are possible limitations in doing that.
I saw a plugin http://blueimp.github.io/jQuery-File-Upload/ and tested it in my browser, and Firebug shows that it posts the image files on the server using XHR, and the Post had something like:
-----------------------------25131776232422 Content-Disposition: form-data;
name="files[]"; filename="myfile.jpg" Content-Type: image/jpeg
ÿØÿà�JFIF��`�`��ÿî�Adobe�d����ÿá]Exif��MM�*����2�������b;�������vGF�������GI����..............
That I assume to be the bits for my uploaded file, so how do I post it on server using XHR or any jQuery api(), and how do I read it and save it using an asp web-form. It should be great if you could help me solve server side issue i.e. read the bytes and save it as image.
Please do not suggest a plugin that works this, as I need to start it from scratch.

[HttpPost]
public ActionResult Save(IEnumerable<HttpPostedFileBase> files)
{
if ( files != null )
{
// do something fancy with the files
}
return new HttpStatusCodeResult(200);
}
Given something like the method above exists in an controller, make sure your plugin makes a post on /{my_fancy_route}/save. You should be able to access the file-contents and for example, save it.

Related

How do I upload an image to cloudinary in ASP.NET MVC app?

I'm using ASP.NET 4.7.2 MVC framework. I need to upload images using cloudinary and save the url of that image in my database. The problem is, Cloudinary's dot net documentation is a bit confusing as they have just declared a function. How do I make call to that function from my view? I have no idea.
Basically, I have a form and in there I want to add an option for uploading images (which should be done using cloudinary service) and then save the url of the uploaded image in my DB. I have no idea how to achieve that since their documentation only mentions just a function like so:
var uploadParams = new ImageUploadParams()
{
File = new FileDescription(#"c:\my_image.jpg")
};
var uploadResult = cloudinary.Upload(uploadParams);
What do I do with this function and how to use it to add image uploading functionality? Please, help me out. Thanks.
Uploading an asset to Cloudinary can be done either directly from the client-side (i.e., from the View of your application) or through the use of the server-side SDK (i.e., from the Controller of your application).
If you intend to perform the image uploading using the CloudinaryDotNet SDK (https://github.com/cloudinary/CloudinaryDotNet), you will need to submit the image file from the View back to the Controller of your application. And in the controller method, you can invoke the SDK methods to perform the actual image upload to Cloudinary server.
There is a sample project enclosed in the SDK source, which can be found in this link: https://github.com/cloudinary/CloudinaryDotNet/tree/master/samples.

How to create usable URL for opening document?

The general problem: I have some code that needs a URL to a PDF file. It seems to work for URLs I find online, but not the ones I create myself.
For example, when I use a random URL from Xamarin it works fine, but when I try to generate a URL from either DropBox or Amazon Cloud Drive it does not work.
Example URLs:
These links open harmless PDF files. Please try it:
Xamarin (works fine)
DropBox (does not work)
Amazon Cloud Drive (does not work)
As you see, in a browser (I have used Chrome to test) you will get the PDF documents to open, but not without some kind of context (except for the Xamarin one).
The code: I am developing in MonoTouch and I am using a component called mTouch PDF Reader. The code is simply:
var documentViewController = new DocumentViewController (1, "Some name here", "http://someurlhere.pdf");
ActivateController (documentViewController);
This opens a nice PDF reader inside my app, but, as I can't use my own created URLs this does not help me. This is a 3rd party library so I can't look at the code. By the way, when I use one of my URLs, the code crashes with a System.NullReferenceException with this stacktrace:
MonoTouch.Foundation.NSArray.FromNativeObjects (items={MonoTouch.UIKit.UIViewController[1]}, count=1) in /Developer/MonoTouch/Source/monotouch/src/shared/Foundation/NSArray.cs:109
MonoTouch.Foundation.NSArray.FromNativeObjects (items={MonoTouch.UIKit.UIViewController[1]}) in /Developer/MonoTouch/Source/monotouch/src/shared/Foundation/NSArray.cs:96
MonoTouch.Foundation.NSArray.FromNSObjects (items={MonoTouch.UIKit.UIViewController[1]}) in /Developer/MonoTouch/Source/monotouch/src/shared/Foundation/NSArray.cs:48
MonoTouch.UIKit.UIPageViewController.SetViewControllers (viewControllers={MonoTouch.UIKit.UIViewController[1]}, direction=MonoTouch.UIKit.UIPageViewControllerNavigationDirection.Forward, animated=false, completionHandler={MonoTouch.UIKit.UICompletionHandler}) in /Developer/MonoTouch/Source/monotouch/src/UIKit/UIPageViewController.g.cs:144
mTouchPDFReader.Library.Views.Core.DocumentViewController.ViewDidLoad () in
MonoTouch.UIKit.UIApplication.UIApplicationMain () in
MonoTouch.UIKit.UIApplication.Main (args={string[0]}, principalClassName=(null), delegateClassName="AppDelegate") in /Developer/MonoTouch/Source/monotouch/src/UIKit/UIApplication.cs:38
Exam936.Application.Main (args={string[0]}) in /Users/EdGriMac/Dropbox/Quiz/Code/Exam926/Exam936/Main.cs:16
The frustration:
Is there a specific way to create URLs that work in this way? It does seem like DropBox does something different as it sort of iFrames the document or something. I don't know what Amazon Cloud Drive does. What has Xamarin done? Is it, as pointed out in the comments, because of http vs https?
I am completely lost. Am I missing something simple? Do you have any other way to create URLs to suggest? Googling this is really difficult as I continue to hit examples of how to share a URL in DropBox and so on...
By the way, I do not want to have the documents as part of the app as this means I will have to create a new version of the app just to change something in a document.
Update 1: I have added links above. I will try some other suggestions later and will leave more updates. Thanks in advance for any further suggestions!
Update 2: I have used Fiddler to look at the response on each of the URLs. The Xamarin URL has Content-Type: application/pdf while both DropBox and Amazon Cloud Drive has Content-Type: text/html; charset=UTF-8. This explains a lot. I will try andersr's suggestion later today as I do have a web server to put files on.
Update 3 When I put the PDF file on my Amazon EC2 server, created a virtual directory under my web site in IIS, the URL to my website + virtual directory + filename worked! Turns out the Content-Type had to be application/pdf for the mTouch PDF Reader to open it through a URL.
Thanks everyone for your help!
It seems to me that the first two URLS, link directly to the PDF files, but the latter one, ie. the one on Amazon Cloud Drive links to a page which again links to the PDF. I suggest the following potential solutions:
Find a reliable way to extract the direct url to the document on cloud drive. The link to the document is not the one you provided, but this: link . Perhaps Amazon has documentation on how you can avoid the html interface in order to retrive your file. I am not familiar with cloud drive at all. Note that the url provided has some time limited token attached to it.
Host the document on infrastructure you have more control over. IE. setup your own web server and host the documents there. Alternatively use another cloud storage provider which gives you the ability to link to files directly.

How to download images from response of Readability Parser API in C#

I'm using Readability Parser API to get content of the page.
After result received content goes to kidlegen.exe(to generate .mobi) and then to my kindle via email. The problem is content i get from Readability Parser API contains <img> to remote images, so i need to download them firts and only then launch kindlegen.exe.
The question is how to download remote images from article to my disk in efficient way? I can see only one solution - use regexp to parse response to extract <img>, then extract scr attribute and finally download images, but that's definitely worst way.
I'm using ASP.NET MVC.
Looks like i need HtmlAgilityPack. I'll detach this task from web application to console.

Upload image to server with custom data

how can i upload an image (javascript) to a backend server (MVC4) and in the same post also add some custom data.
The problem we are facing is that we are trying to make an album web client much like facebook's albums.
A user will upload a series of photos to be added to a database. We need to have those photos already taged to an album as facebook's photos cannot be viewed without having an album who owns the photo.
I talked to the guy in charge of the front end and he says that while doing the javascript call to upload a photo, you cannot also send meta data within this call.
Thank you for your help.
Sure you can.
When you upload your file reference, just add some post variables to the URL.
like
upload.aspx?title=blah?date=somedate
the actual data is just part of the form data as specified by the HTTP protocol
http://www.vivtek.com/rfc1867.html
-------------------------------18788734234
Content-Disposition: form-data; name="nonfile_field"
value here
-------------------------------18788734234
Content-Disposition: form-data; name="myfile"; filename="ad.gif"
Content-Type: image/gif
[ooh -- file contents!]
-------------------------------18788734234--
A great tool is AjaxUpload it should be a good starting point. If you need to upload data along with it, add query variables to the "action"

How to upload files using Yahoo uploader widget in asp.net

Many might have had experience using File Upload widget from Yahoo User Interface library. The docs and community all know how to receive the files on the server using another server technology other than ASP.NET. If anyone has indeed used the widget in their asp.net pages could you share the code on
How to receive the uploaded files Stream/Bytes to a file.
How to check Integrity of the File
How to check if file was received correctly.
Also i would love to do it in single page because doing so i would learn how to differentiate between a normal webpage request and the one caused my file upload widget
Yahoo Upload Widget can be Found here: https://developer.yahoo.com/yui/uploader/.
Have you tried looking at postedfiles collection though? The API looks like it does a standard post. If it does, the just use that collection.
If it doesn't, then you need to use the inputstream property on the request object to read the incoming bytes.
Using something like Fiddler or firebug will tell you how it's making the request. Look for the request type being multipart/mime
edit
Checking the file integrity & whether it was uploaded correctly are pretty much impossible. The only way I can think to do it is to have the user generate a hash of the file then upload the file & the hash & you check the hash is valid. ie not really practical.
All you're getting is a stream of bytes. you have to assume when the stream ends, it ended cleanly & you got all the file.
I answered my own question with code over here.
http://labs.deeptechtons.com/asp-net-tuts/how-to-upload-files-asynchronously-using-yahoo-uploader/

Categories

Resources