javascript - leer - Publicar datos en JsonP
leer json javascript (7)
¿Es posible publicar datos en JsonP? ¿O todos los datos tienen que pasar en la cadena de consulta como una solicitud GET?
Tengo una gran cantidad de datos que necesito enviar al servicio, dominio cruzado, y es demasiado grande para enviar a través de la cadena de consulta.
¿Cuáles son las opciones para evitar esto?
En general, JSONP se implementa agregando una etiqueta <script>
al documento que realiza la llamada, de modo que la URL del servicio JSONP es "src". El navegador obtiene el origen del script con una transacción HTTP GET.
Ahora, si su servicio JSONP está en el mismo dominio que su página de llamadas, entonces probablemente podría improvisar algo con una simple llamada $.ajax()
. Si no está en el mismo dominio, entonces no estoy seguro de cómo sería posible.
Es posible, aquí está mi solución:
En tu javascript:
jQuery.post("url.php",data).complete(function(data) {
eval(data.responseText.trim());
});
function handleRequest(data){
....
}
En tu url.php:
echo "handleRequest(".$responseData.")";
Hay una solución (pirateo) que he hecho muchas veces, podrás Publicar con JsonP. (Podrá publicar Formulario, más de 2000 caracteres que los que puede usar GET)
Aplicación cliente Javascript
$.ajax({
type: "POST", // you request will be a post request
data: postData, // javascript object with all my params
url: COMAPIURL, // my backoffice comunication api url
dataType: "jsonp", // datatype can be json or jsonp
success: function(result){
console.dir(result);
}
});
JAVA:
response.addHeader( "Access-Control-Allow-Origin", "*" ); // open your api to any client
response.addHeader( "Access-Control-Allow-Methods", "POST" ); // a allow post
response.addHeader( "Access-Control-Max-Age", "1000" ); // time from request to response before timeout
PHP:
header(''Access-Control-Allow-Origin: *'');
header(''Access-Control-Allow-Methods: POST'');
header(''Access-Control-Max-Age: 1000'');
Al hacer esto, está abriendo su servidor a cualquier solicitud posterior, debe volver a proteger esto proporcionando ident u otra cosa.
Con este método, también puede cambiar el tipo de solicitud de jsonp a json, ambos funcionan, simplemente configure el tipo de contenido de respuesta correcto
jsonp
response.setContentType( "text/javascript; charset=utf-8" );
json
response.setContentType( "application/json; charset=utf-8" );
Por favor, no es que su servidor ya no respetará el SOP (misma política de origen), pero ¿a quién le importa?
Puede usar un CORS Proxy usando este project . Dirigiría todo el tráfico a un punto final en su dominio y retransmitiría esa información a un dominio externo. Como el navegador registra todas las solicitudes en el mismo dominio, podemos publicar JSON. NOTA: Esto también funciona con certificados SSL en el servidor.
Sé que esto es una nigromancia seria, pero pensé en publicar mi implementación de JSONP POST usando jQuery, que estoy usando con éxito para mi widget JS (esto se usa para el registro y el inicio de sesión del cliente):
Básicamente, estoy usando un enfoque IFrame, como se sugiere en la respuesta aceptada. Lo que estoy haciendo de manera diferente es después de enviar la solicitud, estoy pendiente, si se puede alcanzar el formulario en el iframe, usando un temporizador. Cuando no se puede llegar al formulario, significa que la solicitud ha regresado. Entonces, estoy usando una solicitud JSONP normal para consultar el estado de la operación.
Espero que alguien lo encuentre útil. Probado en> = IE8, Chrome, FireFox y Safari.
function JSONPPostForm(form, postUrl, queryStatusUrl, queryStatusSuccessFunc, queryStatusData)
{
var tmpDiv = $(''<div style="display: none;"></div>'');
form.parent().append(tmpDiv);
var clonedForm = cloneForm(form);
var iframe = createIFrameWithContent(tmpDiv, clonedForm);
if (postUrl)
clonedForm.attr(''action'', postUrl);
var postToken = ''JSONPPOST_'' + (new Date).getTime();
clonedForm.attr(''id'', postToken);
clonedForm.append(''<input name="JSONPPOSTToken" value="''+postToken+''">'');
clonedForm.attr(''id'', postToken );
clonedForm.submit();
var timerId;
var watchIFrameRedirectHelper = function()
{
if (watchIFrameRedirect(iframe, postToken ))
{
clearInterval(timerId);
tmpDiv.remove();
$.ajax({
url: queryStatusUrl,
data: queryStatusData,
dataType: "jsonp",
type: "GET",
success: queryStatusSuccessFunc
});
}
}
if (queryStatusUrl && queryStatusSuccessFunc)
timerId = setInterval(watchIFrameRedirectHelper, 200);
}
function createIFrameWithContent(parent, content)
{
var iframe = $(''<iframe></iframe>'');
parent.append(iframe);
if (!iframe.contents().find(''body'').length)
{
//For certain IE versions that do not create document content...
var doc = iframe.contents().get()[0];
doc.open();
doc.close();
}
iframe.contents().find(''body'').append(content);
return iframe;
}
function watchIFrameRedirect(iframe, formId)
{
try
{
if (iframe.contents().find(''form[id="'' + formId + ''"]'').length)
return false;
else
return true;
}
catch (err)
{
return true;
}
return false;
}
//This one clones only form, without other HTML markup
function cloneForm(form)
{
var clonedForm = $(''<form></form>'');
//Copy form attributes
$.each(form.get()[0].attributes, function(i, attr)
{
clonedForm.attr(attr.name, attr.value);
});
form.find(''input, select, textarea'').each(function()
{
clonedForm.append($(this).clone());
});
return clonedForm;
}
Si necesita enviar una gran cantidad de datos entre dominios. Normalmente creo un servicio al que puedes llamar en dos pasos:
Primero, el cliente debe enviar un FORMATO (la publicación permite el dominio cruzado). El servicio almacena la entrada en la sesión en el servidor (usando el GUID como clave). (el cliente crea un GUID y lo envía como parte de la entrada)
Luego, el cliente realiza un script-inject normal (JSONP) como parámetro; usted usa el mismo GUID que utilizó en la publicación FORM. El servicio procesa la entrada de la sesión y devuelve los datos en la forma JSONP normal. Después de esto, la sesión se destruye.
Esto, por supuesto, depende de que usted escriba el servidor-backend.
No es posible realizar una POST
asincrónica a un servicio en otro dominio, debido a la limitación (bastante sensible) de la misma política de origen . JSON-P solo funciona porque puedes insertar etiquetas <script>
en el DOM, y pueden apuntar a cualquier lugar.
Por supuesto, puede hacer que una página en otro dominio sea la acción de un formulario POST de forma regular.
Editar : hay algunos hacks interesantes por ahí si estás dispuesto a esforzarte mucho insertando <iframe>
ocultos y deambulando con sus propiedades.