View source for Manual:Ajax/es

<languages/>{{Outdated}}
<span lang="en" dir="ltr" class="mw-content-ltr">'''[[w:Ajax (programming)|Ajax]]''' is a term for using JavaScript to load parts of a page on demand.</span> 
<span lang="en" dir="ltr" class="mw-content-ltr">To use Ajax in MediaWiki, it is recommended that your JavaScript code uses [http://api.jquery.com/jQuery.ajax/ <code>jQuery.ajax()</code>], or the [[ResourceLoader/Modules#mediawiki.api|mediawiki.api]] JavaScript module. Typically, you would perform a [[Special:MyLanguage/Manual:API|MediaWiki API]] query over Ajax.</span>

<span lang="en" dir="ltr" class="mw-content-ltr">Before MW 1.38, MediaWiki used to offer a deprecated Ajax interface for use by [[Special:MyLanguage/Manual:Extensions|extensions]].</span>
<span lang="en" dir="ltr" class="mw-content-ltr">See <code>{{ll|Manual:$wgAjaxExportList|action{{=}}ajax}}</code>.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">However, use of Sajax is discouraged since MediaWiki 1.16, the first release of MediaWiki to ship {{ll|jQuery|jQuery}}.</span>

<span id="Details"></span>
==Detalles==

<div lang="en" dir="ltr" class="mw-content-ltr">
=== Asynchronous requests ===
</div>
<span lang="en" dir="ltr" class="mw-content-ltr">An ''asynchronous request'' sends some data to the server, and continues execution.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Some time later, the server might return a response (depending on the type of request); in which case the response will be passed to a JavaScript function for handling.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Another function may be supplied to handle the case that the request fails for some reason.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Below is an example call to the login API by posting the username and password.</span>

<syntaxhighlight lang="javascript">
mw.loader.using( 'mediawiki.api', function () {
	( new mw.Api() ).get( {
		action: 'query',
		lgname: 'foo',
		lgpassword: 'foobar'
	} ).done( function ( data ) {
		alert( data );
	} );
} );
</syntaxhighlight>

<div lang="en" dir="ltr" class="mw-content-ltr">
Alternatively, you can use jQuery's functions directly:
</div>

<syntaxhighlight lang="javascript">
$.ajax({
        // request type ( GET or POST )
	type: "GET",
        
        // the URL to which the request is sent
	url: mw.util.wikiScript('api'),
        
        // data to be sent to the server
	data: { action:'query', format:'json', lgname:'foo', lgpassword:'foobar' },
        
        // The type of data that you're expecting back from the server
	dataType: 'json',
        
        // Function to be called if the request succeeds
	success: function( jsondata ){
		alert( jsondata.result );
	}
});
</syntaxhighlight>

<div lang="en" dir="ltr" class="mw-content-ltr">
The function "mw.util.wikiScript" is available since 1.18 onwards.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
=== Synchronous request ===
</div>
<span lang="en" dir="ltr" class="mw-content-ltr">The other kind of request sends some data to the server, and waits for the response.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">This means that the JavaScript will be blocked until the server returns some data, or the request fails for some reason.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">The following example retrieves the "What links here" list of a template:</span>

<syntaxhighlight lang="javascript">
whatLinksHere = JSON.parse(
    $.ajax({
        url:mw.util.wikiScript('api'),
        data: { action: 'query', format: 'json', list: 'embeddedin', eititle: 'Template:' + templateName, eilimit: 500 },
        async: false
    })
    .responseText
);

// ... usage ...
for (i=0; i<whatLinksHere.query.embeddedin.length; i+=1) {
    alert(whatLinksHere.query.embeddedin[i]);
}
</syntaxhighlight>

<div lang="en" dir="ltr" class="mw-content-ltr">
(<code>JSON.parse()</code> is a JavaScript standard function that returns an object from its string representation in [[w:JSON|JSON]] format.)
</div>

<span id="Limitations"></span>
== Limitaciones ==
<span lang="en" dir="ltr" class="mw-content-ltr">Due to the [[w:same origin policy|same origin policy]], it is difficult for a script on an external site to retrieve data from a wiki that is hosted on a different domain &mdash; for example, one cannot directly retrieve data from <code><nowiki>https://en.wikipedia.org/wiki/</nowiki></code> to <code><nowiki>http://example.org/wiki/</nowiki></code>.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Newer browsers support an explicit instruction to permit this access via [[w:Cross-origin resource sharing|cross-origin resource sharing]] but this will only work with servers that are configured to issue the appropriate headers, and the user must be using a recent browser that recognises it.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Developers with concerns about legacy browsers can't rely on CORS yet.</span>

<div lang="en" dir="ltr" class="mw-content-ltr">
It is possible to circumvent the Same-Origin policy using [[w:JSONP|JSONP]] instead of plain [[w:JSON|JSON]] which will work in older browsers (including Internet Explorer 6).
</div>

<syntaxhighlight lang="javascript">
$.ajax({
    url: '//www.mediawiki.org/w/api.php?format=jsonty&action=query&meta=siteinfo&siprop=general&callback=?',
    data: {
        format: 'json'
    },
    dataType: 'jsonp'
}).done( function ( data ) {
    ...
} );
</syntaxhighlight>

<div lang="en" dir="ltr" class="mw-content-ltr">
== Related deprecated functionality ==
</div>
<span lang="en" dir="ltr" class="mw-content-ltr">Sajax is an ancient Ajax library that (as of September 2012) is still part of core code and is used by some extensions.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Don't use it, use <code>jQuery.ajax()</code> instead.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">Some extensions, whether using Sajax or not, make Ajax calls through the obsolete AjaxDispatcher (see {{manual|$wgAjaxExportList}}) by invoking <code>index.php?action=ajax&rs=''something''...</code>.</span>
<span lang="en" dir="ltr" class="mw-content-ltr">They should instead make MediaWiki {{ll|Manual:API|API}} requests to API modules <code>api.php?action=''something''</code>.</span>

<span id="See_also"></span>
==Véase también==
* {{ll|Category:Ajax extensions}} - Extensiones que usan la interfaz Ajax de Mediawiki.

<span id="External_links"></span>
==Enlaces externos==
* <span lang="en" dir="ltr" class="mw-content-ltr">{{ll|ResourceLoader/Modules#mediawiki.api|mediawiki.api}} (JavaScript module)</span>
* <span lang="en" dir="ltr" class="mw-content-ltr">[http://api.jquery.com/jQuery.ajax/ jQuery.ajax] (jQuery method)</span>

<span lang="en" dir="ltr" class="mw-content-ltr">General information on XMLHttpRequest:</span>
* <span lang="en" dir="ltr" class="mw-content-ltr">[http://www.w3.org/TR/XMLHttpRequest/ XMLHttpRequest specification] at W3.org</span>
* <span lang="en" dir="ltr" class="mw-content-ltr">[[w:XMLHttpRequest|XMLHttpRequest]] on Wikipedia</span>
* <span lang="en" dir="ltr" class="mw-content-ltr">[[devmo:Web/API/XMLHttpRequest|XMLHttpRequest]] on MDN</span>

[[Category:Customization techniques{{#translation:}}|{{PAGENAME}}]]
[[Category:MediaWiki development{{#translation:}}|{{PAGENAME}}]]
[[Category:Ajax extensions{{#translation:}}|*]]