0
744
ViewsNo se pudo enviar JSON HTTP POST, pero se logró enviar texto HTTP POST. ¿por qué?
Quiero enviar un JSON http POST desde una página HTML. La API Fetch se utiliza aquí. Se puede publicar correctamente si el tipo de contenido es "aplicación/x-www-form-urlencoded" o "text/plain", pero no se puede publicar si el tipo de contenido es "aplicación/json". He probado la API de Fetch y Axios. Pero JSON se puede publicar con éxito desde una herramienta http en línea ( https://reqbin.com/ ) 
Aquí está mi código de cliente en HTML:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>test</title> </head> <body> <h1 id ="h1">post test</h1> <input type="submit" value="post" onclick="sendpost()"> <script> function sendpost() { const Url = 'https://my-worker.sgcloud.workers.dev/'; const data = { name: 'moe', age: '50' }; fetch(Url, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(data) }) .then(response => response.text() .then(text => { document.getElementById("h1").innerHTML = text; })) .catch(err => console.log(err)) } </script> </body> </html>El error en la herramienta de desarrollo es:
POST https://my-worker.sgcloud.workers.dev/ net::ERR_FAILEDEl servidor está en mis trabajadores de cloudflare: https://my-worker.sgcloud.workers.dev/ , Access-Control-Allow-Origin está activado. Puedes intentar publicar en mi servidor. el código del servidor es:
addEventListener('fetch', event => { event.respondWith(handleRequest(event.request)); }); async function handleRequest(request) { if (request.method == 'GET') { return new Response('Hello Worker!', { headers: { 'content-type': 'text/plain', 'Access-Control-Allow-Origin': '*' }, }); } else if (request.method == 'POST') { return new Response('Response for POST!', { headers: { 'content-type': 'text/plain', 'Access-Control-Allow-Origin': '*' }, }); } else { response = new Response('Expected POST', { status: 500 }); } }porque puedo publicar json desde la herramienta en línea, por lo que mi código de cliente debería tener algún problema para enviar application/json (el código de cliente puede enviar text/plain o application/x-www-form-urlencoded, probado). ¿Cómo debo cambiar mi código para enviar json? Gracias
1 answers
Answer question0
Creo que sé la razón.
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
Para la situación de uso compartido de recursos de origen cruzado (CORS): además, para los métodos de solicitud HTTP que pueden causar efectos secundarios en los datos del servidor (en particular, los métodos HTTP distintos de GET o POST con ciertos tipos MIME), la especificación exige que los navegadores " "preflight" de la solicitud, solicitando métodos admitidos del servidor con el método de solicitud HTTP OPTIONS y luego, tras la "aprobación" del servidor, enviando la solicitud real.
Algunas solicitudes no activan una verificación previa de CORS. Esas se llaman solicitudes simples. Las únicas combinaciones de tipo/subtipo permitidas para el tipo de medio especificado en el encabezado Content-Type son: application/x-www-form-urlencoded multipart/form-data text/plain.
application/json no es adecuado para esta situación, por lo que no puedo publicar json, pero puedo publicar texto.