Skip to content

Instantly share code, notes, and snippets.

@baniol

baniol/jsonp.html

Created December 9, 2013 15:31
Show Gist options
  • Save baniol/7874012 to your computer and use it in GitHub Desktop.
Save baniol/7874012 to your computer and use it in GitHub Desktop.
Download ZIP
jsonp implementation
Raw
jsonp.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>AvLabz - CORS : The Secrets Behind JSONP </title>
<meta charset="UTF-8" />
</head>
<body>
<input type="text" id="username" placeholder="Enter Your Name"/>
<button type="submit" onclick="sendRequest()"> Send Request to Server </button>
<script>
"use strict";
//Construct the script tag at Runtime
function requestServerCall(url) {
var head = document.head;
var script = document.createElement("script");
script.setAttribute("src", url);
head.appendChild(script);
head.removeChild(script);
}
//Predefined callback function
function jsonpCallback(data) {
alert(data.message); // Response data from the server
}
//Reference to the input field
var username = document.getElementById("username");
//Send Request to Server
function sendRequest() {
requestServerCall("http://tests.baniowski.pl/jsonp/index.php?callback=jsonpCallback&message="+username.value+"");
}
</script>
</body>
</html>
Raw
jsonp.php
<?php
header("Content-Type: application/javascript");
$callback = $_GET["callback"];
if(isset($_GET['folder'])) {
$folder = $_GET['folder'];
$sent = "{\"id\":\"Sent\",\"mails\":[{\"id\":33,\"from\":\"[email protected]\",\"to\":\"callum.wyeslyfa@fang ghost.xyz\",\"date\":\"May 13, 2011\",\"subject\":\"RE: Logo ideas\",\"folder\":\"Sent\"},{\"id\":34,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 6, 2011\",\"subject\":\"RE: Yo\",\"folder\":\"Sent\"},{\"id\":35,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 3, 2011\",\"subject\":\"RE: Out at doctor\",\"folder\":\"Sent\"},{\"id\":36,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 17, 2011\",\"subject\":\"See you Tuesday 1pm\",\"folder\":\"Sent\"},{\"id\":37,\"from\":\"[email protected]\",\"to\":\"Geraldine Yoro \[email protected]\u003e\",\"date\":\"Apr 30, 2011\",\"subject\":\"Rain meet-up\",\"folder\":\"Sent\"},{\"id\":38,\"from\":\"[email protected]\",\"to\":\"Hedda \[email protected]\u003e\",\"date\":\"May 1, 2011\",\"subject\":\"RE: Associates tactics meeting: 4:30\",\"folder\":\"Sent\"},{\"id\":39,\"from\":\"[email protected]\",\"to\":\"Ingrid \[email protected]\u003e\",\"date\":\"May 14, 2011\",\"subject\":\"RE: Reservation confirmation #763296484\",\"folder\":\"Sent\"},{\"id\":40,\"from\":\"[email protected]\",\"to\":\"Isaac \[email protected]\u003e\",\"date\":\"May 14, 2011\",\"subject\":\"Employee benefits policy\",\"folder\":\"Sent\"},{\"id\":41,\"from\":\"[email protected]\",\"to\":\"MFHV \[email protected]\u003e\",\"date\":\"May 25, 2011\",\"subject\":\"FW: Gate server is out of service\",\"folder\":\"Sent\"},{\"id\":42,\"from\":\"[email protected]\",\"to\":\"Noel Coford \[email protected]\u003e\",\"date\":\"May 2, 2011\",\"subject\":\"RE: Territory event\",\"folder\":\"Sent\"},{\"id\":43,\"from\":\"[email protected]\",\"to\":\"Roanna \[email protected]\u003e\",\"date\":\"Apr 27, 2011\",\"subject\":\"Operation Horse ending 8pm\",\"folder\":\"Sent\"}]}";
$archive = "{\"id\":\"Archive\",\"mails\":[{\"id\":13,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 2, 2011\",\"subject\":\"RE: Reservation confirmation #999331516\",\"folder\":\"Archive\"},{\"id\":14,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 24, 2011\",\"subject\":\"Project Sky - your job is 9pm\",\"folder\":\"Archive\"},{\"id\":15,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 20, 2011\",\"subject\":\"RE: Car9 network is out of service\",\"folder\":\"Archive\"},{\"id\":16,\"from\":\"BYLB \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 20, 2011\",\"subject\":\"RE: Pear tactics\",\"folder\":\"Archive\"},{\"id\":17,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 6, 2011\",\"subject\":\"Meet with Camilla\",\"folder\":\"Archive\"},{\"id\":18,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 13, 2011\",\"subject\":\"Meeting at 9am\",\"folder\":\"Archive\"},{\"id\":19,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 2, 2011\",\"subject\":\"Your order P815875237 has dispatched\",\"folder\":\"Archive\"},{\"id\":20,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 23, 2011\",\"subject\":\"Reservation confirmation #439756385\",\"folder\":\"Archive\"},{\"id\":21,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 24, 2011\",\"subject\":\"Feedback requested by Bradley Vasedrismith\",\"folder\":\"Archive\"},{\"id\":22,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"Apr 30, 2011\",\"subject\":\"RE: Hall server is back up\",\"folder\":\"Archive\"},{\"id\":23,\"from\":\"Ila \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 14, 2011\",\"subject\":\"RE: Your order A435146969 is delayed\",\"folder\":\"Archive\"},{\"id\":24,\"from\":\"Kareem Wyeson \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 16, 2011\",\"subject\":\"FW: Straw diagrams\",\"folder\":\"Archive\"},{\"id\":25,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 14, 2011\",\"subject\":\"Operation Island finished\",\"folder\":\"Archive\"},{\"id\":26,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 3, 2011\",\"subject\":\"RE: DB Replication ending now\",\"folder\":\"Archive\"},{\"id\":27,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 18, 2011\",\"subject\":\"have clinic appt at 5:45\",\"folder\":\"Archive\"},{\"id\":28,\"from\":\"Richard \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 4, 2011\",\"subject\":\"Beam5 network is back up\",\"folder\":\"Archive\"},{\"id\":29,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 7, 2011\",\"subject\":\"Feedback requested by Dawn Pytosson\",\"folder\":\"Archive\"},{\"id\":30,\"from\":\"Simone \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 9, 2011\",\"subject\":\"RE: Does Nolan know C#?\",\"folder\":\"Archive\"},{\"id\":31,\"from\":\"thaddeus.tregube5@butter coast.xyz\",\"to\":\"[email protected]\",\"date\":\"May 18, 2011\",\"subject\":\"RE: Remember Chava\u0027s brother\",\"folder\":\"Archive\"},{\"id\":32,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 11, 2011\",\"subject\":\"RE: Reviewing VHD demo\",\"folder\":\"Archive\"}]}";
$inbox = "{\"id\":\"Inbox\",\"mails\":[{\"id\":1,\"from\":\"Abbot \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 25, 2011\",\"subject\":\"Booking confirmation #389629244\",\"folder\":\"Inbox\"},{\"id\":2,\"from\":\"Addison Begoat \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 7, 2011\",\"subject\":\"FW: Associate advice\",\"folder\":\"Inbox\"},{\"id\":3,\"from\":\"Allistair \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 19, 2011\",\"subject\":\"RE: Phone call tomorrow 5 o\u0027clock\",\"folder\":\"Inbox\"},{\"id\":4,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 22, 2011\",\"subject\":\"Completing basketball project\",\"folder\":\"Inbox\"},{\"id\":5,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"Apr 26, 2011\",\"subject\":\"FW: Can you get DE to resubmit accounts?\",\"folder\":\"Inbox\"},{\"id\":6,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 22, 2011\",\"subject\":\"RE: Catch up at 9:00 to finalise rain spec\",\"folder\":\"Inbox\"},{\"id\":7,\"from\":\"Madison Lalinesson \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 19, 2011\",\"subject\":\"RE: Pencil scenarios\",\"folder\":\"Inbox\"},{\"id\":8,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"Apr 28, 2011\",\"subject\":\"Flavor benefit gig\",\"folder\":\"Inbox\"},{\"id\":9,\"from\":\"Sandra Juanhison \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 8, 2011\",\"subject\":\"RE: Apparel5 network is back up\",\"folder\":\"Inbox\"},{\"id\":10,\"from\":\"Sylvester \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 1, 2011\",\"subject\":\"Feedback requested by Ayanna Nuyo\",\"folder\":\"Inbox\"},{\"id\":11,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 4, 2011\",\"subject\":\"Project Book starting 6pm\",\"folder\":\"Inbox\"},{\"id\":12,\"from\":\"XLN \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 8, 2011\",\"subject\":\"RE: Remember Whoopi\u0027s joke\",\"folder\":\"Inbox\"}]}";
$spam = "{\"id\":\"Spam\",\"mails\":[{\"id\":44,\"from\":\"Vance \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 4, 2011\",\"subject\":\"@@ Meet new friends online @@\",\"folder\":\"Spam\"},{\"id\":45,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 16, 2011\",\"subject\":\"Samuel\u0027s n0se is perfect - fix yours t0day\",\"folder\":\"Spam\"},{\"id\":46,\"from\":\"Anne \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 4, 2011\",\"subject\":\"you\u0027re meds order #Y555764626\",\"folder\":\"Spam\"},{\"id\":47,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"Apr 29, 2011\",\"subject\":\"Does ZZX excuse the trail?\",\"folder\":\"Spam\"},{\"id\":48,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 6, 2011\",\"subject\":\"FREE iPAD 2 GUARANTEED\",\"folder\":\"Spam\"},{\"id\":49,\"from\":\"Charlotte \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 7, 2011\",\"subject\":\"no other product can help\",\"folder\":\"Spam\"},{\"id\":50,\"from\":\"Deanna Wridaypa \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 1, 2011\",\"subject\":\"!!Winner!! Place first 1000USD bet free\",\"folder\":\"Spam\"},{\"id\":51,\"from\":\"Hamilton Yueehi \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 10, 2011\",\"subject\":\"2 unread message(s): Hello Taylor\",\"folder\":\"Spam\"},{\"id\":52,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 20, 2011\",\"subject\":\"March United Bank Inc\",\"folder\":\"Spam\"},{\"id\":53,\"from\":\"HGLF \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 4, 2011\",\"subject\":\"YouPharmacy5 special offer: 80% off this week only\",\"folder\":\"Spam\"},{\"id\":54,\"from\":\"Isabella Hasmith \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"Apr 27, 2011\",\"subject\":\"Ticket confirmation #484993598\",\"folder\":\"Spam\"},{\"id\":55,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 7, 2011\",\"subject\":\"УДВОЕНИЕ СКОРОСТИ ЧТЕНИЯ ЗА 3 ЧАСА\",\"folder\":\"Spam\"},{\"id\":56,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 7, 2011\",\"subject\":\"Stunning replica watches\",\"folder\":\"Spam\"},{\"id\":57,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 26, 2011\",\"subject\":\"RE: Hi Murphy...\",\"folder\":\"Spam\"},{\"id\":58,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 16, 2011\",\"subject\":\"An exclusive offer from your bank\",\"folder\":\"Spam\"},{\"id\":59,\"from\":\"[email protected]\",\"to\":\"[email protected]\",\"date\":\"May 5, 2011\",\"subject\":\"Днепропетровск\",\"folder\":\"Spam\"},{\"id\":60,\"from\":\"ZK \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 12, 2011\",\"subject\":\"Somebody invited you to join eReaders Community\",\"folder\":\"Spam\"}]}";
switch($folder) {
case "Sent":
$res = $sent;
break;
case "Archive":
$res = $archive;
break;
case "Spam":
$res = $spam;
break;
case "Inbox":
$res = $inbox;
break;
}
}
if(isset($_GET['mail'])) {
$res = "{\"id\":1,\"from\":\"Abbot \[email protected]\u003e\",\"to\":\"[email protected]\",\"date\":\"May 25, 2011\",\"subject\":\"Booking confirmation #389629244\",\"messageContent\":\"Hi!\u003cbr/\u003e\u003cbr/\u003eSchwebet und ernsten zu ich träne diesmal schatten ich folgenden erste seh jenem und irrt was menge dunst herauf. Jenem meinem die mich bang jenem den lebens das busen verklungen fühlt folgenden. Stunden folgenden um nach widerklang strenge ein welt ich euch alten der um nun erfreuet gedränge. Festzuhalten bilder mich ihr jenem mit verklungen auf euch wird selbst des noch weich an des. Tränen um sehnen gleich das stunden irrt einst ertönt besitze ein und liebe wohl noch manche und hinweggeschwunden ertönt.\u003cbr/\u003e\u003cbr/\u003eLied lieb zauberhauch erste die steigen fühlt mich liebe halbverklungnen zu selbst liebe glück. Mir es fühlt hinweggeschwunden schwebet nun euch glück auf irrt neu weiten fühlt und jenem bringt lebens versuch. Erste folgenden ich walten wird euren sang nicht lebt mit es steigt widerklang tönen nun busen.\u003cbr/\u003e\u003cbr/\u003eGesänge zu nun hinweggeschwunden vom mich fühlt träne blick kommt zu. Um wohl es freundliche denen geneigt wird. Menge hören zauberhauch vom ertönt wiederholt mich die nicht jenem euch ein.\u003cbr/\u003e\u003cbr/\u003eWiderklang der lebens der zug träne selbst sich bilder alten strenge zerstoben zauberhauch die um. Ertönt versuch erfreuet und. Ein wieder zerstreuet zerstoben folgt ich herzen der kommt ihr mein sich ersten gedränge.\u003cbr/\u003e\u003cbr/\u003eBest regards - Jonas\",\"folder\":\"Inbox\"}";
}
// if(isset($_GET['save'])) {
// }
echo $callback . "(" . $res . ")";
?>
Raw
list.php
<?php
header("Content-Type: application/javascript");
$callback = $_GET["callback"];
if(isset($_GET['list'])) {
$units = array(
array('id'=>1,'source'=>'jeden','target'=>'one'),
array('id'=>2,'source'=>'dwa','target'=>'two'),
array('id'=>3,'source'=>'trzy','target'=>'three')
);
$res = json_encode(array('units'=>$units));
}
echo $callback . "(" . $res . ")";
?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment