TIL60. Django:Backend通信準備

📌 FrontendとBackendのHTTP通信方法をまとめた.

🌈 Backend通信の準備

🔥 Backend通信の準備

🔥 Frontend通信の準備

🔥 通信不能時の確認

1.Backend通信の準備

🤔 サーバドライバとIPの検証

✔バックエンドで独自にHttpieまたはPostManで通信する場合は、・4・ドライバサーバを使用しますが、Frontendとの通信にはポートを指定します.
ポート番号を指定せずにサーバを起動すると、Frontendは通信を試行できません.
主に8000または8080のポートが使用されます.
$ - python manage.py runserver 0.0.0.0:8000 👈 8000ポート
✔サーバを起動した場合は、Frontendがアクセスするドメインを確認し、アクセスするURLを教えてください.
✔MacOSでIPアドレスを検証する方法は、端末に以下のコードを入力すればよい.
$ ipconfig getifaddr en0

🤔 EndPointとキー値の説明

✔¥IPアドレスを検証し、ドメインパスに入れ、8000番ポートを使用してサーバーを起動します.以下のようにします.
✔¥後ろのPathはurlsです.pyの端点を一致させます.
fetch用会員入路:python manage.pyfetch用ログインパス:http://10.58.0.36:8000/users/signupfetch用の投稿作成とリスト閲覧パス:http://10.58.0.36:8000/users/signinfetchで使用するコメント生成とコメント閲覧パス:http://10.58.0.36:8000/post✔市場市場pyの論理とDBが渡す値を知っているので、Frontが要求を送信するときは、正しいキー値でbodyを記述する必要があります.
✔¥¥АААААААААААААА

2.Frontend通信の準備

🤔 Frontが作成したlogin fetchコード

✔Backendでも、一緒に問題を解決するためにはfetch codeを熟知しなければなりません!😊

fetch('http://10.58.0.36:8000/users/signin', { // 👈 endpoint 경로
    method: 'POST', // 👈 매서드
    body: JSON.stringify({ // 👈 body
    email: this.state.idInput, 
    password: this.state.pwInput,
    }),
})
.then(res => res.json())
.then(result => {
    const { history } = this.props;
        if (result.message === 'INVALID_USER') {
            alert('login please');
        } else if (result.access_token) {
            localStorage.setItem('token', result.access_token);
            history.push('/main-yj');
    }
});

3.通信不能時の確認事項

🤔 接続自体が使用できない場合

✔АААА
✔勘定科目fetch関数を実行するかどうか
✔APIアドレス上、뉪덚、뉪덚、뉪덚、뉪덚、뉪덚
✔バックエンドIPアドレスを再確認します.
✔ユーザーバックエンドサーバーが開いているか.

🤔 接続されていますが、エラーが発生して応答しない場合

✔勘定科目fetch関数の構文を確認します.
✔¥¥¥¥¥¥¥
勘定科目のbodyキー値が正しいことを確認します.