Dakusan’s Domain > Archive > Posts > Tags

Date: 10/03/15 07:29pm

Sending URLs as a file in an HTML form using AJAX

It is common knowledge that you can use the FormData class to send a file via AJAX as follows:

var DataToSend=new FormData();
DataToSend.append(PostVariableName, VariableData); //Send a normal variable
DataToSend.append(PostFileVariableName, FileElement.files[0], PostFileName); //Send a file
var xhr=new XMLHttpRequest();
xhr.open("POST", YOUR_URL, true);
xhr.send(DataToSend);

Something that is much less known, which doesn't have any really good full-process examples online (that I could find), is sending a URL's file as the posted file.
This is doable by downloading the file as a Blob, and then directly passing that blob to the FormData. The 3rd parameter to the FormData.append should be the file name.

The following code demonstrates downloading the file. I did not worry about adding error checking.

function DownloadFile(
    FileURL,     //http://...
    Callback,    //The function to call back when the file download is complete. It receives the file Blob.
    ContentType) //The output Content-Type for the file. Example=image/jpeg
{
    var Req=new XMLHttpRequest();
    Req.responseType='arraybuffer';
    Req.onload=function() {
        Callback(new Blob([this.response], {type:ContentType}));
    };
    Req.open("GET", FileURL, true);
    Req.send();
}

And the following code demonstrates submitting that file

//User Variables
var DownloadURL="https://www.castledragmire.com/layout/PopupBG.png";
var PostURL="https://www.castledragmire.com/ProjectContent/WebScripts/Default_PHP_Variables.php";
var PostFileVariableName="MyFile";
var OutputFileName="Example.jpg";
//End of User Variables

DownloadFile(DownloadURL, function(DownloadedFileBlob) {
    //Get the data to send
    var Data=new FormData();
    Data.append(PostFileVariableName, DownloadedFileBlob, OutputFileName);

    //Function to run on completion
    var CompleteFunction=function(ReturnData) {
        //Add your code in this function to handle the ajax result
        var ReturnText=(ReturnData.responseText ? ReturnData : this).responseText;
        console.log(ReturnText);
    }

    //Normal AJAX example
    var Req=new XMLHttpRequest();
    Req.onload=CompleteFunction; //You can also use "onreadystatechange", which is required for some older browsers
    Req.open("POST", PostURL, true);
    Req.send(Data);

    //jQuery example
    $.ajax({type:'POST', url:PostURL, data:Data, contentType:false, processData:false, cache:false, complete:CompleteFunction});
});

Unfortunately, due to cross site scripting (XSS) security settings, you can generally only use ajax to query URLs on the same domain. I use my Cross site scripting solutions and HTTP Forwarders for this. Stackoverflow also has a good thread about it.

Find Text

Replace Text

^(\d+)/(\d+)/(\d+)$

$3-$1-$2

Find Text

Replace Text

Explanation

\\\\

Escape backslash

\\'

Escape single quotation mark

','

Change separators so that all values are encased as strings

Line prefix to insert a row and stringify the first value

'),

Line suffix to insert a row and stringify the last value

#include <stdio.h> #include <malloc.h> #include <fcntl.h> #include <sys/types.h> #include <sys/socket.h> #include <netinet/in.h> #include <signal.h> //The server socket and options int ServerSocket=0; const int PortNumber=1234; //The port number to listen in on //If an error occurs, exit cleanly int error(char *msg) { //Close the socket if it is still open if(ServerSocket) close(ServerSocket); ServerSocket=0; //Output the error message, and return the exit status fprintf(stderr, "%s\n", msg); return 1; } //Termination signals void TerminationSignal(int sig) { error("SIGNAL causing end of process"); _exit(sig); } int main(int argc, char *argv[]) { //Listen for termination signals signal(SIGINT, TerminationSignal); signal(SIGTERM, TerminationSignal); signal(SIGHUP, SIG_IGN); //We want the server to continue running if the environment is closed, so SIGHUP is ignored -- This doesn't work in Windows //Create the server struct sockaddr_in ServerAddr={AF_INET, htons(PortNumber), INADDR_ANY, 0}; //Address/port to listen on if((ServerSocket=socket(AF_INET, SOCK_STREAM, 0))<0) //Attempt to create the socket return error("ERROR on 'socket' call"); if(bind(ServerSocket, (struct sockaddr*)&ServerAddr, sizeof(ServerAddr))<0) //Bind the socket to the requested address/port return error("ERROR on 'bind' call"); if(listen(ServerSocket,5)<0) //Attempt to listen on the requested address/port return error("ERROR on 'listen' call"); //Accept a connection from a client struct sockaddr_in ClientAddr; int ClientAddrLen=sizeof(ClientAddr); int ClientSocket=accept(ServerSocket, (struct sockaddr*)&ClientAddr, &ClientAddrLen); if(ClientSocket<0) return error("ERROR on 'accept' call"); //Prepare to receive info from STDIN //Create the buffer const int BufferSize=1024*10; char *Buffer=malloc(BufferSize); //Allocate a 10k buffer //STDIN only needs to be set to binary mode in windows const int STDINno=fileno(stdin); #ifdef WINDOWS _setmode(STDINno, _O_BINARY); #endif //Prepare for blocked listening (select function) fcntl(STDINno, F_SETFL, fcntl(STDINno, F_GETFL, 0)|O_NONBLOCK); //Set STDIN as blocking fd_set WaitForSTDIN; FD_ZERO(&WaitForSTDIN); FD_SET(STDINno, &WaitForSTDIN); //Receive information from STDIN, and pass directly to the client int RetVal=0; while(1) { //Get the next block of data from STDIN select(STDINno+1, &WaitForSTDIN, NULL, NULL, NULL); //Wait for data size_t AmountRead=fread(Buffer, 1, BufferSize, stdin); //Read the data if(feof(stdin) || AmountRead==0) //If input is closed, process is complete break; //Send the data to the client if(write(ClientSocket,Buffer,AmountRead)<0) //If error in network connection occurred { RetVal=error("ERROR on 'write' call"); break; } } //Cleanup if(ServerSocket) close(ServerSocket); free(Buffer); return RetVal; }

import flash.external.ExternalInterface; import flash.events.Event; ExternalInterface.addCallback("OpenSocket", OpenSocket); function OpenSocket(IP:String, Port:Number):void { SendInfoToJS("Trying to connect"); var TheSocket:Socket = new Socket(); TheSocket.addEventListener(Event.CONNECT, function(Success) { SendInfoToJS(Success ? "Connected!" : "Could not connect"); }); TheSocket.addEventListener(Event.CLOSE, function() { SendInfoToJS("Connection Closed"); }); TheSocket.addEventListener(IOErrorEvent.IO_ERROR, function() {SendInfoToJS("Could not connect");}); TheSocket.addEventListener(ProgressEvent.SOCKET_DATA, function(event:ProgressEvent):void { ExternalInterface.call("GetPacket", TheSocket.readUTFBytes(TheSocket.bytesAvailable)); }); TheSocket.connect(IP, Port); } function SendInfoToJS(str:String) { ExternalInterface.call("GetInfoFromFlash", str); } stop();

var NewSock=new XMLSocket(); NewSock.onData=function(msg) { GetPacket(msg); } NewSock.onConnect=function(Success) { SendInfoToJS(Success ? "Connected!" : "Could not connect"); } SendInfoToJS(NewSock.connect(IP, Port) ? "Trying to Connect" : "Could not start connecting");

#include <stdio.h> #include <stdlib.h> int main(int argc, char *argv[]) { int NumLoops=(argc>1 ? atoi(argv[1]) : 50); //Number of loops to run from passed argument 1. Default is 50 if not specified. int LoopWait=(argc>2 ? atoi(argv[2]) : 500); //Number of milliseconds to wait in between each loop from passed argument 2. Default is 500ms if not specified. LoopWait*=1000; //Convert to microseconds for usleep //Output an incremented number every half a second int i=0; while(i<NumLoops) { printf("%u\n", i++); fflush(stdout); //Force stdout flush usleep(LoopWait); //Wait for half a second }; return 0; }

#!/usr/bin/perl use warnings; use strict; #Listen for kill signals $SIG{'QUIT'}=$SIG{'INT'}=$SIG{__DIE__} = sub { close Server; print "Socket Policy Server Ended: $_[0]\n"; exit; }; #Start the server: use Socket; use IO::Handle; my $FlashPolicyPort=843; socket(Server, PF_INET, SOCK_STREAM, getprotobyname('tcp')) or die "'socket' call: $!"; #Open the socket setsockopt(Server, SOL_SOCKET, SO_REUSEADDR, 1) or die "'setsockopt' call: $!"; #Allow reusing of port/address if in TIME_WAIT state bind(Server, sockaddr_in($FlashPolicyPort,INADDR_ANY)) or die "'bind' call: $!"; #Listen on port $FlashPolicyPort for connections from any INET adapter listen(Server,SOMAXCONN) or die "'listen' call: $!"; #Start listening for connections Server->autoflush(1); #Do not buffer output #Infinite loop that accepts connections $/ = "\0"; #Reset terminator from new line to null char while(my $paddr=accept(Client,Server)) { Client->autoflush(1); #Do not buffer IO if(<Client> =~ /.*policy\-file.*/i) { #If client requests policy file... print Client '<cross-domain-policy><allow-access-from domain="*" to-ports="*" /></cross-domain-policy>'.$/; #Output policy info: Allow any flash applets from any domain to connect } close Client; #Close the client }

$streamname='example.shoutcast.castledragmire.com'; $port ='1234'; $path ='/'; header('Content-type: audio/mpeg'); $sock=fsockopen($streamname,$port); fputs($sock, "GET $path HTTP/1.0\r\n"); fputs($sock, "Host: $streamname\r\n"); fputs($sock, "User-Agent: WinampMPEG/2.8\r\n"); fputs($sock, "Accept: */*\r\n"); fputs($sock, "Connection: close\r\n\r\n"); fpassthru($sock); fclose($sock);

<html><body> <input type=button onclick="RunTest();" value='Click me when the second window has opened to run the test'> <script type="text/javascript"> //Spawn the second window var NewWindow=window.open('RemoteWindow.html'); //Run the test function RunTest() { LocalAlertString('This is an alert generated from the local window'); NewWindow.RemoteAlertString('This is an alert generated from the remote window'); alert('The local window alert function is of type function: '+(LocalAlertString instanceof Function)); alert('The remote window alert function is of type function: '+(NewWindow.RemoteAlertString instanceof Function)); LocalAlertString.apply(window, ['This is an alert generated from the local window through the APPLY member']); try { NewWindow.RemoteAlertString.apply(NewWindow.window, ['This is an alert generated from the remote window through the APPLY member. This will not work in IE because the remote window\'s function is not actually a function.']); } catch(e) { alert('The REMOTE APPLY failed: '+e.message); } NewWindow.RunFunctionInRemoteWindow('RemoteAlertString', ['This is an alert generated from the remote window through the FIXED APPLY function.']); } //Generate an alert in the local window function LocalAlertString(TheString) { alert('Local String: '+TheString); } </script></body></html>

<html><body><script type="text/javascript"> //Generate an alert in the remote window function RemoteAlertString(TheString) { alert('Remote String: '+TheString); } //Call functions in this window remotely through the "apply" member function RunFunctionInRemoteWindow(FunctionName, Parameters) { //Manually copy the passed Parameters since "Parameters" may not be a valid JSObject anymore (this could be detected and array.slice used if it is still valid) var ParametersCopy=[]; for(var i=0;i<Parameters.length;i++) ParametersCopy[i]=Parameters[i]; window[FunctionName].apply(window, ParametersCopy); } </script></body></html>

<html><body> <input type=button onclick="RunTest();" value='Click me when the second window has opened to run the test'> <script type="text/javascript"> Array.prototype.IsArray=true; var NewWindow=window.open('RemoteWindow.html'); //Spawn the second window function RunTest() { NewWindow.RunTest({}, [], new ExampleObject()); }; //Send the test data to remote window function ExampleObject() { } //An example class </script></body></html>

<html><body><script type="text/javascript"> function RunTest(AnObject, AnArray, AnExampleObject) { var MyTests=[ 'AnObject instanceof Object', 'AnObject.IsArray', //Object.prototype does not have this (Array.prototype does) 'AnArray instanceof Object', 'AnArray instanceof Array', 'AnArray.IsArray', //This was added to the Array.prototype in the parent window 'AnArray instanceof opener.Array', //This example does not work in IE7 because opener.x cannot be properly accessed 'AnExampleObject instanceof opener.ExampleObject',//This example does not work in IE7 because opener.x cannot be properly accessed 'AnExampleObject instanceof ExampleObject' //This test should error because "ExampleObject" does not exist in this window ]; for(var i=0;i<MyTests.length;i++) //This runs each test like the following: alert("TEST: "+(TEST)); try { eval('alert("'+MyTests[i]+': "+('+MyTests[i]+'));'); } catch(e) { alert('Error on test "'+MyTests[i]+'": '+(e.hasOwnProperty('message') ? e.message : e.toString())); } } </script></body></html>

//Copyright 2009 by Dakusan (http://www.castledragmire.com/Copyright). Licensed under Dakusan License v2.0 (http://www.castledragmire.com/Misc/Software_Licenses/Dakusan_License_v2.0.php). //See http://www.castledragmire.com/Posts/chunk for more information #define __LARGE64_FILES #include <stdio.h> #include <stdlib.h> //strtoull #ifdef WIN32 //STDOUT only needs to be set to binary mode in windows #include <io.h> //_setmode #include <fcntl.h> //_O_BINARY #endif typedef unsigned long long UINT64; const UINT64 MaxSizeToRead=1024*1024*10; //The maximum number of bytes to read at a time to our buffer (Must be < 2^31) UINT64 GetNumberFromString(const char* S) //Extract both hexidecimal and decimal numbers from a string { bool IsHex=S[0]=='0' && (S[1]|32=='x'); //If string starts as 0x, then is a hex number return strtoull(S+(IsHex ? 2 : 0), NULL, IsHex ? 16 : 10); //Hex number starts after 2 characters and uses base 16 } int main(int argc, char *argv[], char *envp[]) { //Determine if proper number of parameters are passed, and if not, output help info if(argc!=3 && argc!=4) return fprintf(stderr, "Chunk outputs bytes between 2 points in a file to STDOUT. The parameters are:\n1) The file\n2) The byte offset to start at (hex is supported like 0xA)\n3) The number of bytes to output. If not given, the end of the file is assumed.\n") & 0; //Open the file and get its length FILE *TheFile=fopen64(argv[1], "rb"); if(TheFile==NULL) return fprintf(stderr, "File not found or cannot open file\n") & 0; fseeko64(TheFile, 0, SEEK_END); //Get the length by seeking to the end UINT64 FileSize=ftello64(TheFile); //Determine the requested start offset UINT64 Offset=GetNumberFromString(argv[2]), SizeToOutput; if(Offset>=FileSize) { fprintf(stderr, "Offset is larger than file's size\n"); fclose(TheFile); return 0; } //Determine the size to read if(argc==3) //If no final parameter, read to the end of the file SizeToOutput=FileSize-Offset; else //Determine from the 3rd parameter { SizeToOutput=GetNumberFromString(argv[3]); if(Offset+SizeToOutput>FileSize) { fprintf(stderr, "Requested size is larger than the file, truncating to end of file\n"); SizeToOutput=FileSize-Offset; } else if(!SizeToOutput) //If nothing to output, exit prematurely { fclose(TheFile); return 1; } } //Output requested data 10MB at a time from the file to STDOUT char *Buffer=new char[SizeToOutput>MaxSizeToRead ? MaxSizeToRead : SizeToOutput]; //Only allocate as many bytes to our read buffer as is necessary fseeko64(TheFile, Offset, SEEK_SET); //Seek to the beginning read offset of our file #ifdef WIN32 //STDOUT only needs to be set to binary mode in windows _setmode(_fileno(stdout), _O_BINARY); #endif while(SizeToOutput) //Keep reading and outputting until requested data is complete { UINT64 SizeToRead=SizeToOutput>MaxSizeToRead ? MaxSizeToRead : SizeToOutput; //Number of bytes to read and write fread(Buffer, SizeToRead, 1, TheFile); //Read the data fwrite(Buffer, SizeToRead, 1, stdout); //Write the data to STDOUT SizeToOutput-=SizeToRead; //Decrease number of bytes we still need to read } //Cleanup delete[] Buffer; fclose(TheFile); return 1; }

Replace

Explanation

\\'

Escape single quotes

','

Separate fields and quote as strings

Start of row

'),

End of row

<? $Fields=Array('ClientNumber'=>'Client #', 'FirstName'=>'First Name', 'LastName'=>'Last Name', ...); //Field list print '<form method=post action=index.php><table>'; //Form action needs to point to the current file foreach($Fields as $Name => $Value) //Output search text boxes print "<tr><td>$Value</td><td><input name=\"$Name\" style='width:200px;' value=\"". (isset($_POST[$Name]) ? htmlentities($_POST[$Name], ENT_QUOTES) : '').'"></td></tr>';//Text boxes w/ POSTed values,if set print '</table><input type=submit value=Search></form>'; if(!isset($_POST[key($Fields)])) //If search data has not been POSTed, stop here return; $SearchArray=Array('1=1'); //Search parameters are stored here. 1=1 is passed in case no POSTed search parameter are ... //... requested so there is at least 1 WHERE parameter, and is optimized out with the MySQL preprocessor anyways. foreach($Fields as $Name => $Value) //Check each POSTed search parameter if(trim($_POST[$Name])!='') //If the POSTed search parameter is empty, do not use it as a search parameter { $V=mysql_escape_string($_POST[$Name]); //Prepare for SQL insertion $SearchArray[]=$Name.(strpos($Value, '#')===FALSE ? " LIKE '%$V%'" : "='$V'"); //Pound sign in the Viewable Name=exact ... //... value, otherwise, just a partial patch } //Get data from MySQL mysql_connect('SQL_HOST', 'SQL_USERNAME', 'SQL_PASSWORD'); mysql_select_db('SQL_DATABASE'); $q=mysql_query('SELECT * FROM TABLENAME WHERE '.implode(' AND ', $SearchArray)); //Output retrieved data $i=0; while($d=mysql_fetch_assoc($q)) //Iterate through found rows { if(!($i++)) //If this is the first row found, output header { print '<table border=1 cellpadding=0 cellspacing=0><tr><td>Num</td>'; //Start table and output first column header (row #) foreach($Fields as $Name => $Value) //Output the rest of the column headers (Viewable Names) print "<td>$Value</td>"; print '</tr>'; //Finish header row } print '<tr bgcolor='.($i&1 ? 'white' : 'gray')."><td>$i</td>"; //Start the data field's row. Row's colors are alternating white and gray. foreach($Fields as $Name => $Value) //Output row data print '<td>'.$d[$Name].'</td>'; print '</tr>'; //End data row } print ($i==0 ? 'No records found.' : '</table>'); //If no records are found, output an error message, otherwise, end the data table ?>