Cabeçalho do tipo de conteúdo HTTP e JSON

Eu sempre tentei evitar o uso da maioria das propriedades do protocolo HTTP por medo do desconhecido.

No entanto, eu disse a mim mesmo que hoje vou enfrentar o medo e começar a usar os cabeçalhos de propósito. Eu tenho tentado enviar jsondados para o navegador e usá-los imediatamente. Por exemplo, se eu tiver uma função de manipulador Ajax no estado pronto 4, com a seguinte aparência:

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

E eu configurei o cabeçalho do tipo de conteúdo no meu código PHP:

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

Por que não consigo acessar diretamente a propriedade a partir da função manipuladora, quando o navegador é informado claramente de que os dados são recebidos application/json?

O Content-Typecabeçalho é usado apenas como informação para o seu aplicativo. O navegador não se importa com o que é. O navegador apenas retorna os dados da chamada AJAX. Se você quiser analisá-lo como JSON, precisará fazer isso por conta própria.

O cabeçalho está lá para que seu aplicativo possa detectar quais dados foram retornados e como eles devem ser tratados. Você precisa olhar para o cabeçalho e, se for, application/jsonanalisá-lo como JSON.

É assim que o jQuery funciona. Se você não informar o que fazer com o resultado, ele será usado Content-Typepara detectar o que fazer com o resultado.

Content-Type: application/jsoné apenas o cabeçalho do conteúdo. O cabeçalho do conteúdo é apenas informações sobre o tipo de dados retornados, ex: JSON, imagem (png, jpg, etc.), html.

Lembre-se de que JSON em JavaScript é uma matriz ou objeto. Se você deseja ver todos os dados, use console.log em vez de alerta:

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

Se você deseja alertar o conteúdo JSON original como uma sequência, adicione aspas simples ('):

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

Não use aspas duplas. Isso confundirá o JavaScript, porque o JSON usa aspas duplas em cada valor e chave:

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>

O código abaixo me ajuda a retornar um objeto JSON para JavaScript no front-end

O código do meu modelo

template_file.json

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

Código suportado por 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")    

Arquivo url.py

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

Código jQuery para o front end

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