ASP. NET uses the ajaxfileupload. js plug-in to solve the failure of uploading large files (ajaxfileupload. js first shot ),

Source: Internet
Author: User

ASP. NET uses the ajaxfileupload. js plug-in to solve the failure of uploading large files (ajaxfileupload. js first shot ),

At the time of writing this article, I wanted to directly write the title as an error prompt, as shown below:

"SecurityError: Blocked a frame with origin" http: // localhost: 55080 "from accessing a cross-origin frame ."

But it is a little long and will not show all. I just want to change it. I thought about it.

"ASP. NET reports an error solution for uploading large images or files ",

Then, after I finish writing this question, I think this article does not seem necessary at all. It is estimated that after reading the question, I will think about the web. config configuration. However, the content you want to write is really not so "simple". After all, it took you a few hours to study it ~~ So I thought about it again and turned it into the current question. I just want to share it with you.

That's the end.

First, the following error message is displayed:

Prompt first

Prompt

Yes. An ajaxfileupload is downloaded from the Internet. the js plug-in is used for refreshing the upload of images, and then runs it according to the demo example. Uploading is OK, but the uploaded sample image is large, 4 M, 5 M, and then upload will report the above error.

Simply looking at my description, it is obvious that the reason is that the picture is large, and you may soon think of the web. config configuration problems, but when I was in charge, it was not so clever. Because of a prompt error, I went to Baidu, I found out what the "cross-origin function call" problem is. So far, I am exploring this problem in a biased direction.

Although the error message does not clearly indicate that it is related to the size of the uploaded image, it is true that the size of the uploaded file is not set, and the default size of the uploaded file in asp.net is 2 MB.

I will first tell you the solution, that is, adding the upper and lower sections in <system. Web> of web. config.


Note:

Gorgeous split line

Gorgeous split line

If you want to know about the entire process of inquiry, you can continue to look at it. It is quite interesting (in fact, it is also because of the initial deviation of inquiry, I learned more about it. The process was disgusting, but the results were pleasant .)

The error message is "SecurityError: Blocked a frame with origin" http: // localhost: 55080 "from accessing a cross-origin frame. "This sentence, and then I mentioned" cross-origin tuning functions ". At that time, I was confused. What is this? Then I saw an article about this, mainly about an iframe in the page, and then the js Code in iframe is called with the js Code on the page, in some cases, it becomes a cross-origin call and an error is reported.

I am a little impatient when I find it here, because it seems that I need to check the source code of the ajaxfileupload. js plug-in. To be honest, it is one of the many things I don't like to do. But I don't like people who encounter problems, so I have to take a look.

At first, I was wondering how js uploads files? Of course, I know it's ajax, but how does the background get the path for uploading files when directed to the page? (The front-end will not let you get anything, just like c: \ fakepath \ XXX.jpg) Forgive me for my ignorance, but I have been using ASP. NET's built-in controls have never taken these issues seriously (just recently it seems that they are only a little clever, and some friends have said that ASP is not used for development. NET comes with the control, so it has recently started to change), but when you need to use <input type = file/>, you know that you really do not know anything. Good cup ~

Let's talk about how js uploads files through ajax. Simply put, it is okay to submit a form containing <input type = file/> by submitting a form, then

HttpFileCollection files = System.Web.HttpContext.Current.Request.Files

You can get this file object and then perform a series of operations. However, the file is usually saved to a specified directory first. If you want to preview the image, you can only display the image copied to the specified directory. I don't know what I said clearly?

The following describes ajaxfileupload. how does the js plug-in implement file upload? It dynamically creates an iframe and a form, and then clone (clone) <input type = file/> in the form on the page, and then submit the dynamically created form, so that the background can know what the file you want to upload is, the returned content is displayed in the dynamic iframe. More importantly, this is a refreshing upload! I think this idea is cool.

Back to the problem, in this process, I found that there was no so-called "cross-origin function calling" problem, and then followed the browser to break the point. When a large file is selected for upload, the structure of the dynamic iframe document is not generated at all, and then it is caught.

Because the JavaScript code is still very careful, it doesn't feel any urine. It is because the size of the uploaded file is different that the iframe document structure can be generated. At this time, I was a bit difficult. Is it a problem with project configuration? Then we found the solution above.

 

The problem is finally solved in a big circle, but the ajaxfileupload. js plug-in is not complete yet. If you are interested, please pay attention:

JQuery's gradual parsing of the ajaxfileupload. js plug-in (second release of ajaxfileupload. js)

JQuery self-made bullet box upload Avatar plug-to be improved (ajaxfileupload. js third bullet)


How can the aspnet control FileUpload fail to implement file upload?

The problem is that the page is refreshed once when you perform the btnFileUpload_Click event. It should be before you call this method. Check whether any other controls have refreshed the page during operations. For example, DropDownList. And if (! IsPostBack) Don't forget to add it. I hope it will help you.

Response. Write ("<script> alert ('select the file you want to upload! '); </Script> ");
This indicates that your file is not selected. There are only two possibilities in this case. 1. You have no choice at all. 2. After you select it, refresh the page again. Of course, the first one won't, so the second one. If you do not write if (! IsPostBack) when the server control is returned, the page will be refreshed again. The content you added and the selected image path will be cleared, so the FileUpLoad. HasFile cannot find the image.

Jsp ajaxfileuploadjs: A Tool for refreshing file uploads

This if (data)
Whether you have added parameter support...
If there are parameters
JQuery ('<input type = "hidden" name = "' + I + '" value = "' + data [I] + '"/> '). appendTo (form );
Here, values are assigned to a hidden domain .. Is there anything next to you?
Therefore, every time an error occurs, there is no bound connection. As to why do you always enter the ERROR, it must be an interaction or a front-end code ERROR? You can run the following command under Firefox to see what is reported? If there is no ERROR, check whether it is a url: inaccessible (access the url directly to the browser address to see if any error is reported)
If the front-end code has no problem, the url can be accessed, which is a background issue .. Troubleshoot the problem one by one. If the problem persists, please give me the information to help you.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.