技術標籤：前端通過網站得到json

目前流行的前後端分離開發模式中，前端工程師需要根據後端開發人員給出的API文件發起不同的請求得到資料，API文件規定了一些請求的模板以及響應的資料格式和程式碼。

通常，前後端約定一些程式碼以代表一定含義的響應。

在這裡，分享一個作者在開發過程中經常使用的一些技巧。

1新建utils資料夾

2新建json_status.py 檔案

#匯入模組
from django.http import JsonResponse

django 提供了一個jsonResponse方法，可以返回一個標準的json響應。

3建立一個 Code 的類

class Code:
    ok = 2
    params_error = 1
    un_auth_error = 403
    server_error = 500
 

返回不同狀態的響應程式碼

4建立一個標準的json響應函式

def result(code = Code.ok,message = '',data = None,**kwargs):
    json_dict = {"code":code, 'msg':message,"data":data}
    if kwargs and isinstance(kwargs,dict):
        json_dict.update(kwargs)
    return JsonResponse(json_dict)

在這裡，通過定義result函式，封裝一些常用的響應欄位，例如響應的程式碼，資訊，資料，可供前端使用。

**kwargs：熟悉Python的朋友一定不會陌生，這是Python中經典的使用，可以向函式中傳入不定長的引數。

5建立更豐富的json響應函式

ef params_error(message='',data=None):
    '''
     引數錯誤
    :param message:傳給前端的資訊
    :param data: 傳給前端的資料，字典型別
    :return: Json響應
    '''
    return result(code=Code.params_error,message=message,data=data)

def un_auth_error(code=Code.un_auth_error,message='',data=None):
    '''
    許可權錯誤
    :param code:
    :param message:
    :param data:
    :return:
    '''
    return result(code,message=message,data=data)


def server_error(code = Code.server_error,message='',data=None):
    '''
    伺服器錯誤
    :param code:
    :param message:
    :param data:
    :return:
    '''
    return result(code,message=message,data=data)
 

上面我們建立了一系列的json響應函式，下面我們演示如何在檢視函式中使用。

6在檢視中響應使用響應函式

#首先匯入
from utils import json_status

#建立一個檢視函式
def index(request):
    id = int(request.GET.get("id"))
    if id ===1:
        return json_status.result(message='成功')
    else:
        return json_status.params_error(message='引數錯誤')

通過GET方法，獲取到的id的值，判斷id。

如果id=1 則返回成功的響應

如果id為其他值，則返回引數錯誤的響應

在前端中(以ajax為例)

            $.ajax({
                type: get,
                url: url,
                data: {"id":1},
                success: function (result) {
                    if (result.code ==2) {
                        alert(result.message);
                        });
                    } else{
                        alert(result.code);
                        alert(result.message);
                    }
                    return;
                }
            });

通過上述方法，可以返回一個標準的json響應。前端根據不同的響應程式碼，進行操作。

歡迎關注我的專欄:生動講解程式設計知識
更多內容：[email protected]
我的網站: http://www. kevinguo.cn
QQ:876798594