Android + Django 로그인 기능 구현하기 (1) 회원 가입

1. 회원가입 페이지

우선 회원가입 페이지는 위와 같이 간단하게 만들어줬다.

해당 프로젝트에서 중요한 부분은 사용자별로 다른 이미지 데이터를 불러올 수 있도록 하는 것이기 때문에 로그인 기능은 암호화까지 넣고 중복 아이디나 아이디, 패스워드 조건까지 비교하는 부분은 일단 구현하지 않으려고 한다.

 

2. Django 앱

안드로이드 프론트 xml 파일은 저렇게 구현을 해주었고,

우선 문자열 데이터를 받을 django측 코드를 추가해줬다.

- models.py

class Accounts(models.Model):
    identify = models.CharField(default='identify', max_length=20)
    password = models.CharField(default='password', max_length=20)

models.py에는 identify와 password라는 두 필드를 추가하고, 최대 크기는 20자로 세팅했다.

이렇게 모델에 업데이트 사항이 있을 때에는 항상 migration 작업을 해줘야한다.

manage.py 디렉토리에서 아래 두 커맨드를 실행해준다.

 

$ python manage.py makemigrations

$ python manage.py migrate

 

이렇게 생성된 데이터베이스 테이블은 MySQL workbench에서도 확인해 볼 수 있다.

 

- serializers.py

from rest_framework import serializers
from .models import Accounts


class AccountsSerializer(serializers.ModelSerializer):

    class Meta:
        model = Accounts
        fields = ('identify', 'password')

serializers.py에 만든 model을 import해주고, 데이터를 직렬화 해준다.

 

- views.py

from rest_framework import viewsets
from rest_framework.response import Response
from .serializers import AccountsSerializer
from .models import Accounts

class AccountsViewset(viewsets.ModelViewSet):
    queryset = Accounts.objects.all()
    serializer_class = AccountsSerializer

기존 코드에 serializer와  model을 import 해주고, 클래스 타입 view를 추가해준다.

그리고 해당 로그인 관련 부분은 다른 URL 에 연결해 주었다.

 

- urls.py

router = routers.DefaultRouter()
# router.register(r'posts', views.PostViewset)
router.register(r'accounts', views.AccountsViewset)

역시 기존 urls.py 에 경로 하나만 더 추가해 주었다.

 

이렇게 하면 이제 안드로이드에서 'identify'와 'password'를 전송했을 때, 서버로 제대로 전송이 되고, MySQL 테이블에도 들어가게 된다.

MySQL workbench에 models.py내에서 만들어준 테이블이 생성되고, 서버에 들어온 값이 insert된다.

마찬가지로 localhost:8000/accounts에서도 JSON 데이터를 확인할 수 있다.

 

3. 안드로이드에서 문자열 데이터 전송

- MyAPI.java

@Multipart
    @POST("/accounts/")
    Call<ResponseBody> post_accounts(
            @Part("identify") RequestBody param1,
            @Part("password") RequestBody param2
    );

우선 기존 MyAPI.java 파일에 accounts로 POST요청시 들어가는 Multipart와 호출함수 바디를 만들어줬다.

 

- MakeAccount.java

private void registerAccount(String userId, String userPass) {
        RequestBody identify = RequestBody.create(MediaType.parse("text/plain"), userId);
        RequestBody password = RequestBody.create(MediaType.parse("text/plain"), userPass);


        // Retrofit 객체 생성
        Retrofit.Builder builder2 = new Retrofit.Builder()
                .baseUrl("https://2c992e709ea0.ngrok.io")
                .addConverterFactory(GsonConverterFactory.create());
        Retrofit retrofit2 = builder2.build();

        MyAPI myAPI2 = retrofit2.create(MyAPI.class);

        // post 한다는 request를 보내는 부분.
        Call<ResponseBody> call = myAPI2.post_accounts(identify, password);
        // 만약 서버로 부터 response를 받는다면.
        call.enqueue(new Callback<ResponseBody>() {
            @Override
            public void onResponse(Call<ResponseBody> call, Response<ResponseBody> response) {
                if(response.isSuccessful()){
                    Log.d(TAG,"계정 등록");
                    Toast.makeText(getApplicationContext(),"계정 등록에 성공하였습니다!",Toast.LENGTH_SHORT).show();
                }else {
                    Log.d(TAG,"Post Status Code : " + response.code());
                    Log.d(TAG,response.errorBody().toString());
                    Log.d(TAG,call.request().body().toString());
                }
            }

            @Override
            public void onFailure(Call<ResponseBody> call, Throwable t) {
                Log.d(TAG,"Fail msg : " + t.getMessage());

            }
        });
    }

회원가입 버튼 onClick시 위의 함수가 호출될 수 있도록 하였습니다.

위의 함수가 호출되면, 텍스트뷰의 id값을 사용해 작성된 문자열 값을 해당 함수의 파라미터 값으로 전달합니다.

Multibody 함수에 넣어줄 RequestBody를 text타입으로 생성합니다.

HTTP 통신을 위해서 Retrofit 객체를 생성하고 빌드해준 뒤 데이터를 전송합니다.

서버에서 response를 받으면 해당 알림이 뜹니다.

 

다음 포스팅에서는 데이터베이스에 저장된 계정정보로 id와 pw 값이 같은 경우 기존의 이미지 처리 페이지에 접근할 수 있도록 코드를 수정하려고 한다!

 

 

 

REFERENCE

1. 코틀린 사용한 로그인 구현. 구현 로직 간단한 참고

seopseop911.tistory.com/30