web-dev-qa-db-fra.com

En-tête de type de contenu HTTP et JSON

J'ai toujours essayé d'éviter d'utiliser la plupart des propriétés du protocole HTTP dans un souci de peur de l'inconnu.

Cependant, je me suis dit que je vais faire face à la peur aujourd'hui et commencer à utiliser les en-têtes à bon escient. J'ai essayé d'envoyer des données json au navigateur et de les utiliser immédiatement. Par exemple, si j’ai une fonction de gestionnaire Ajax à l’état de préparation 4 qui ressemble à ceci:

function ajaxHandler(response){
    alert(response.text);
}

Et j'ai défini l'en-tête content-type dans mon code PHP:

header('Content-Type: application/json');
echo json_encode(array('text' => 'omrele'));

Pourquoi ne puis-je pas accéder directement à la propriété à partir de la fonction de gestionnaire, lorsque le navigateur est clairement informé que les données entrantes sont application/json?

javascriptphpjsonhttp
123
php_nub_qq

L'en-tête Content-Type est simplement utilisé comme information pour votre application. Le navigateur ne se soucie pas de ce que c'est. Le navigateur vous renvoie simplement les données de l'appel AJAX. Si vous souhaitez analyser le fichier au format JSON, vous devez le faire vous-même.

L'en-tête est là pour que votre application puisse détecter quelles données ont été renvoyées et comment elle doit les gérer. Vous devez regarder l’en-tête, et s’il s’agit de application/json, puis l’analyser en JSON.

Voici comment jQuery fonctionne. Si vous ne lui dites pas quoi faire avec le résultat, il utilise le Content-Type pour détecter quoi en faire.

120
Rocket Hazmat

Content-Type: application/json n'est que l'en-tête du contenu. L'en-tête de contenu ne contient que des informations sur le type de données renvoyées, ex :: JSON, image (png, jpg, etc.), html.

Gardez à l'esprit que JSON en JavaScript est un tableau ou un objet. Si vous voulez voir toutes les données, utilisez console.log au lieu de alert:

alert(response.text); // Will alert "[object Object]" string
console.log(response.text); // Will log all data objects

Si vous souhaitez alerter le contenu JSON d'origine sous forme de chaîne, ajoutez des guillemets simples ('):

echo "'" . json_encode(array('text' => 'omrele')) . "'";
// alert(response.text) will alert {"text":"omrele"}

N'utilisez pas de guillemets doubles. Cela va confondre JavaScript, car JSON utilise des guillemets doubles pour chaque valeur et clé:

echo '<script>var returndata=';
echo '"' . json_encode(array('text' => 'omrele')) . '"';
echo ';</script>';

// It will return the wrong JavaScript code:
<script>var returndata="{"text":"omrele"}";</script>
7
Among Amrul

Le code ci-dessous m'aide à renvoyer un objet JSON pour JavaScript sur le front-end.

Mon code de modèle

template_file.json

{
    "name": "{{name}}"
}

code soutenu par Python

def download_json(request):
    print("Downloading JSON")
    # Response render a template as JSON object
    return HttpResponse(render_to_response("template_file.json",dict(name="Alex Vera")),content_type="application/json")

Fichier url.py

url(r'^download_as_json/$', views.download_json, name='download_json-url')

code jQuery pour le front-end

  $.ajax({
        url:'{% url 'download_json-url' %}'        
    }).done(function(data){
        console.log('json ', data);
        console.log('Name', data.name);
        alert('hello ' + data.name);
    });
0
Alex Vera