HOME

TheInfoList



OR:

JSONP, or JSON-P (JSON with Padding), is a historical JavaScript technique for requesting data by loading a element, which is an element intended to load ordinary JavaScript. It was proposed by Bob Ippolito in 2005. JSONP enables sharing of data bypassing same-origin policy, which disallows running JavaScript code to read media DOM elements or XMLHttpRequest data fetched from outside the page's originating site. The originating site is indicated by a combination of URI scheme, host name, and port number. JSONP is vulnerable to the data source replacing the innocuous function call with malicious code, which is why it has been superseded by cross-origin resource sharing (available since 2009) in modern applications.


Functionality

The HTML <script> element is generally allowed to execute JavaScript code retrieved from foreign origins. Services replying with pure
JSON JSON (JavaScript Object Notation, pronounced ; also ) is an open standard file format and data interchange format that uses human-readable text to store and transmit data objects consisting of attribute–value pairs and arrays (or other se ...
data, however, were not able to share data from foreign origins before the adoption of CORS (
Cross-origin resource sharing Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served. A web page may freely embed cross-origin images, ...
). For example, a request to a foreign service http://server.example.com/Users/1234 may return a record for a person named Alice in the JSON format. JSON syntax is consistent with JavaScript's object syntax. Without support for CORS, an attempt to use the data across domains results in a JavaScript error. The browser will download the <script> file, evaluate its contents, misinterpret the raw JSON data as a block, and throw a syntax error. Even if the data were interpreted as a JavaScript object literal, it could not be accessed by JavaScript running in the browser, since without a variable assignment, object literals are inaccessible. In the JSONP usage pattern, the URL request pointed to by the src attribute in the <script> element returns JSON data, with JavaScript code (usually a function call) wrapped around it. This "wrapped payload" is then interpreted by the browser. In this way, a function that is already defined in the JavaScript environment can manipulate the JSON data. A typical JSONP request and response are shown below. The function call to parseResponse() is the "P" of JSONP—the "padding" or "prefix" around the pure JSON. For JSONP to work, a server must reply with a response that includes the JSONP function. JSONP does not work with JSON-formatted results. The JSONP function invocation that gets sent back, and the payload that the function receives, must be agreed upon by the client and server. By convention, the server providing the JSON data offers the requesting website to name the JSONP function, typically using the name jsonp or callback as the named query-string parameter, in its request to the server: . In this example, the received payload would be: parseResponse();


Script element injection

JSONP makes sense only when used with a script element. For each new JSONP request, the browser must add a new <script> element, or reuse an existing one. The former option—adding a new script element—is done via dynamic DOM manipulation, and is known as ''script element injection''. The <script> element is injected into the HTML DOM, with the URL of the desired JSONP endpoint set as the "src" attribute. This dynamic ''script element injection'' is usually done by a JavaScript helper library.
jQuery jQuery is a JavaScript library designed to simplify HTML DOM tree traversal and manipulation, as well as event handling, CSS animation, and Ajax. It is free, open-source software using the permissive MIT License. As of Aug 2022, jQuery is u ...
and other frameworks have JSONP helper functions; there are also standalone options. An example of using jQuery to ''dynamically inject'' script element for a JSONP call looks like this: $.getScript("http://server.example.com/Users/192.168.73.96?callback=parseResponse"); After the element is injected, the browser evaluates the element, and performs an HTTP GET on the src URL, retrieving the content. Then the browser evaluates the return payload as JavaScript. This is typically a function invocation. In that way, the use of JSONP can allow browser pages to work around the
same-origin policy In computing, the same-origin policy (SOP) is an important concept in the web application security model. Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web page ...
via script element injection. The script runs within the scope of the including page and, as such, is still subject to cross-domain restrictions relative to the domain of the including page. This means that a web page cannot, for example, load a library hosted on another site via JSONP and then make XMLHttpRequest requests to that site (unless
cross-origin resource sharing Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served. A web page may freely embed cross-origin images, ...
(CORS) is supported), although one could use such a library to make XMLHttpRequests to one's own site.


Security concerns


Untrusted third-party code

Including script elements from remote servers allows the remote servers to inject ''any'' content into a website. If the remote servers have vulnerabilities that allow JavaScript injection, the page served from the original server is exposed to an increased risk. If an attacker can inject any JavaScript into the original web page, then that code can retrieve additional JavaScript from any domain, bypassing the
same-origin policy In computing, the same-origin policy (SOP) is an important concept in the web application security model. Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web page ...
. The Content Security Policy HTTP Header lets web sites tell web browsers which domain scripts may be included from. An effort was undertaken around 2011 to define a safer strict subset definition for JSONP that browsers would be able to enforce on script requests with a specific
MIME Multipurpose Internet Mail Extensions (MIME) is an Internet standard that extends the format of email messages to support text in character sets other than ASCII, as well as attachments of audio, video, images, and application programs. Message ...
type such as "application/json-p". If the response did not parse as strict JSONP, the browser could throw an error or just ignore the entire response. However, this approach was abandoned in favor of CORS, and the correct MIME type for JSONP remains application/javascript.


Whitespace differences

JSONP carried the same problems as resolving JSON with : both interpret the JSON text as JavaScript, which meant differences in handling U+2028 ( Line Separator) and U+2029 ( Paragraph Separator) from JSON proper. This made some JSON strings non-legal in JSONP; servers serving JSONP had to escape these characters prior to transmission. This issue has now been rectified in ES2019.


Callback name manipulation and reflected file download attack

Unsanitized callback names may be used to pass malicious data to clients, bypassing the restrictions associated with application/json content type, as demonstrated in reflected file download (RFD) attack from 2014. Insecure JSONP endpoints can be also injected with malicious data.


Cross-site request forgery

Naive deployments of JSONP are subject to
cross-site request forgery Cross-site request forgery, also known as one-click attack or session riding and abbreviated as CSRF (sometimes pronounced ''sea-surf'') or XSRF, is a type of malicious exploit of a website or web application where unauthorized commands are submit ...
(CSRF or XSRF) attacks. Because the HTML <script> element does not respect the
same-origin policy In computing, the same-origin policy (SOP) is an important concept in the web application security model. Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web page ...
in web browser implementations, a malicious page can request and obtain JSON data belonging to another site. This will allow the JSON-encoded data to be evaluated in the context of the malicious page, possibly divulging passwords or other sensitive data if the user is currently logged into the other site.


Rosetta Flash

Rosetta Flash is an exploitation technique that allows an attacker to exploit servers with a vulnerable JSONP endpoint by causing
Adobe Flash Player Adobe Flash Player (known in Internet Explorer, Firefox, and Google Chrome as Shockwave Flash) is computer software for viewing multimedia contents, executing rich Internet applications, and streaming audio and video content created on ...
to believe that an attacker-specified Flash applet originated on the vulnerable server. Flash Player implements
same-origin policy In computing, the same-origin policy (SOP) is an important concept in the web application security model. Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web page ...
allowing one to make requests (with cookies) and receive responses from the hosting site. The applet can then send the retrieved data back to the attacker. This is a cross-origin exploit with an impact similar to embedding an arbitrary Flash applet in the vulnerable domain. The exploit uses an ActionScript payload compiled to an SWF file composed entirely of alphanumeric characters by crafting a zlib stream with a particular header and DEFLATE blocks with ad-hoc
Huffman coding In computer science and information theory, a Huffman code is a particular type of optimal prefix code that is commonly used for lossless data compression. The process of finding or using such a code proceeds by means of Huffman coding, an algo ...
. The resulting alphanumeric-only SWF file is then used as the callback parameter of a JSONP call. High-profile sites such as Google, YouTube, Twitter, Yahoo!, Yandex, LinkedIn, eBay, Instagram and Tumblr were all vulnerable until July 2014. This vulnerability was discovered and published by Google security engineer Michele Spagnuolo and has and . Adobe Flash Player release version 14.0.0.145, released on July 8, 2014, introduced stronger validation of Flash files, and in version 14.0.0.176, released on August 12, 2014, finalized the fix, preventing this exploit from working.


History

In July 2005, George Jempty suggested an optional variable assignment be prepended to JSON. The original proposal for JSONP, where the padding is a callback function, appears to have been made by Bob Ippolito in December 2005 and is now used by many
Web 2.0 Web 2.0 (also known as participative (or participatory) web and social web) refers to websites that emphasize user-generated content, ease of use, participatory culture and interoperability (i.e., compatibility with other products, systems, and ...
applications such as
Dojo Toolkit Dojo Toolkit (stylized as dōjō toolkit) is an open-source modular JavaScript library (or more specifically JavaScript toolkit) designed to ease the rapid development of cross-platform, JavaScript/Ajax-based applications and web sites. It was ...
,
Google Web Toolkit Google Web Toolkit (GWT ), or GWT Web Toolkit, is an open-source set of tools that allows web developers to create and maintain JavaScript front-end applications in Java. It is licensed under the Apache License 2.0. GWT emphasizes reusab ...
and Web services.


See also

* Cross-origin resource sharing (CORS) *
Cross-document messaging Web Messaging or cross-document messaging, is an API introduced in the WHATWG HTML5 draft specification, allowing documents to communicate with one another across different origins, or source domains while rendered in a web browser. Prior to HTM ...


References


External links


server side filter wraps any response into a jsonp callback
{snddone with jsonp-java source code
Potential security issues related to JSON


Ajax (programming) JSON