ajax request Cross-Origin Request Blocked error

See more:

C#

ASP.NET

Ajax

CORS

Hi,

I have two projects; First one is a asp.net web project and the second one is embedded http server library project.

Embedded http server project is taken from : embedded http server project

I want to save a video file from user's local to user's shared storage. I'm getting and sending file from browser using ajax request. Embedded http server is supposed to get bytearray and save video on client's shared storage. I have a problem that I spent days to solve but not yet found a solution.

In chrome it stucks on stream.CopyTo(streamReader);

In firefox and IE it gives "Cross-Origin Request Blocked" error but firefox saves file even it gives the error.

Here is the ajax request code;

$(document).ready(function () {

          function hashFile(file, chunkSize, callback) {
            var size = file.size;
            var offset = 0;
            var chunk = file.slice(offset, offset + chunkSize);

			SendChunk(chunk,0);
			
            var hashChunk = function () {
                var reader = new FileReader();
                reader.onload = function (e) {
                    
                    offset += chunkSize;

                    if (offset < size) {
                        chunk = file.slice(offset, offset + chunkSize);

						SendChunk(chunk,0);
                    } 
					else if (offset > size){
						offset -= chunkSize;
						var newchunkSize = size - offset;
						
						chunk = file.slice(offset, offset + newchunkSize);

						SendChunk(chunk,1);
                    }
                };

                reader.readAsArrayBuffer(chunk);
            };

			function SendChunk(chunk,end){
				
				if(end>0)
				{
					 var ajaxRequest = $.ajax({
						type: "POST",
						url: "http://clientip:8080/savefileend",
						contentType: false,
						processData: false,
						data: chunk
					});
				}
				else{
					var ajaxRequest = $.ajax({
						type: "POST",
						url: "http://clientip:8080/savefile",
						contentType: false,
						processData: false,
						data: chunk
					});
					
					ajaxRequest.done(function (e) {
						hashChunk();
					
					});
					ajaxRequest.error(function (xhr) {
						console.log(e);
						hashChunk();
					});
				}
			}
        }

        function fileInputHandler(evt) {
            var files = evt.target.files;
            var chunkSize = 10485760; // bytes
            var start = window.performance ? performance.now() : Date.now(); // DEBUG
            var onHashFile = function (digest) {
                var end = window.performance ? performance.now() : Date.now(); // DEBUG
                console.log(this.name, digest, (end - start) + 'ms'); // DEBUG
            };
            for (var i = 0, len = files.length; i < len; i++) {
                hashFile(files[i], chunkSize, onHashFile);
            }
        }

        document.getElementById('file1')
  .addEventListener('change', fileInputHandler, false);
});

and here is the embedded server code to get the request;

var stream = request.GetRequestStream();

                    using (var streamReader = new MemoryStream())
                    {
                        stream.CopyTo(streamReader);
                        videoTemp = streamReader.ToArray();
                    }

                    using (var fileStream = new FileStream(path, FileMode.Append))
                    {
                        fileStream.Write(videoTemp, 0, videoTemp.Length);
                    }

By the way,

For IE: If I enabled "Access data sources across domains" from setting -security... then it works without error in IE.

For Chrome: If I start chrome with --disable-web-security parameter it works without error in chrome.

But I have find the solution from code.

Need suggestions urgently..