컴퓨터공학/안드로이드(Android)

2. 회원가입(Sign up) 및 로그인(Sign in)

Jake217 2017. 6. 30. 19:07

전체적인 구조는 Android Studio <=> PHP <=> MySQL입니다.


[A. Andorid Studio로 값을 입력받아

PHP를 통해 MySQL에 값을 넣어보자(회원가입)]


Step1. Database Design(DB 및 테이블 생성)


Autoset 실행 후, 127.0.0.1 -> PHPMyAdmin클릭해서

새로운 Database를 만들고 Table을 생성합니다.

저는 Database의 이름을 android_test, Table의 이름을 custom_info라고 했습니다.



컬럼은 2개만 생성했습니다. id를 받아올 u_id, pw를 받아올 u_pw로 설정했고

모두 string값이므로 varchar 선택 후 길이/값은 30으로 지정하였습니다.

데이터 종류는 utf8_general_ci로 설정!


Step2. PHP Server Programming


Atom을 실행시켜서 다음과 같이 작성합니다.




<?php

$con=mysqli_connect("127.0.0.1","root","db비번","android_test");


mysqli_set_charset($con,"utf8");


if (mysqli_connect_errno($con))

{

   echo "Failed to connect to MySQL: " . mysqli_connect_error();

}

$userid = $_POST['Id'];

$userpw = $_POST['Pw'];


$result = mysqli_query($con,"insert into custom_info (u_id,u_pw) values ('$userid','$userpw')");


  if($result){

    echo 'success';

  }

  else{

    echo 'failure';

  }


mysqli_close($con);

?>


Step1에서 만들었던 DB의 내용을 작성해주시고

Android Studio를 통해 받아올 값을

쿼리로 이용해서

테이블에 넣는 작업까지 합니다.


Step3. Android Studio에서 값 입력하기


전 프로젝트 이름을 signupandin으로 하였습니다.


기본적으로 MainAcitivity클래스와 activity_main.xml이 생성됩니다.


activity_main.xml -> Design클릭해서

도구상자를 이용해서 다음과 같이 만들어줍니다.



SIGN IN과 SIGN UP을 눌렀을 때, 각자 다른화면이 나와야겠죠?

총 2개의 화면이 추가적으로 필요하므로

클래스2개와 layout resource파일

2개를 추가적으로 생성합니다.



저는 위 사진과 같이 MenuPage, SignupPage 클래스 2개와

activity_menu.xml, acitivity_signup.xml 2개를 생성하였습니다.



먼저 MySQL에 값을 넣는걸

테스트 할 것이므로

Sign up부터 하겠습니다.


SignupPage클래스에다가

다음과 같은 코드를 추가합니다.


public class SignupPage extends Activity {
private EditText editTextId;
private EditText editTextPw;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_signup);

editTextId = (EditText) findViewById(R.id.new_id);
editTextPw = (EditText) findViewById(R.id.new_pw);

}
public void insert(View view) {
String Id = editTextId.getText().toString();
String Pw = editTextPw.getText().toString();

insertoToDatabase(Id, Pw);
}
private void insertoToDatabase(String Id, String Pw) {
class InsertData extends AsyncTask<String, Void, String> {
ProgressDialog loading;
@Override
protected void onPreExecute() {
super.onPreExecute();
loading = ProgressDialog.show(SignupPage.this, "Please Wait", null, true, true);
}
@Override
protected void onPostExecute(String s) {
super.onPostExecute(s);
loading.dismiss();
Toast.makeText(getApplicationContext(), s, Toast.LENGTH_LONG).show();
}
@Override
protected String doInBackground(String... params) {

try {
String Id = (String) params[0];
String Pw = (String) params[1];

String link = "http://본인PC IP주소/post.php";
String data = URLEncoder.encode("Id", "UTF-8") + "=" + URLEncoder.encode(Id, "UTF-8");
data += "&" + URLEncoder.encode("Pw", "UTF-8") + "=" + URLEncoder.encode(Pw, "UTF-8");

URL url = new URL(link);
URLConnection conn = url.openConnection();

conn.setDoOutput(true);
OutputStreamWriter wr = new OutputStreamWriter(conn.getOutputStream());

wr.write(data);
wr.flush();

BufferedReader reader = new BufferedReader(new InputStreamReader(conn.getInputStream()));

StringBuilder sb = new StringBuilder();
String line = null;

// Read Server Response
while ((line = reader.readLine()) != null) {
sb.append(line);
break;
}
return sb.toString();
} catch (Exception e) {
return new String("Exception: " + e.getMessage());
}
}
}
InsertData task = new InsertData();
task.execute(Id, Pw);
}
}


activity_signup.xml을 더블클릭하셔서 design탭을 누르신 후 아래 사진과 같이 꾸며주세요.



디자인 다 하신 후, Text탭을 눌렀을때의 코드입니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:ems="10"
android:id="@+id/new_id"
android:hint="your@id.com" />

<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:ems="10"
android:id="@+id/new_pw"
android:hint="password" />

<Button
android:text="SUBMIT"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/btn_submit"
android:onClick="insert"/>
</LinearLayout>
이제 메인 화면에서 SIGN UP버튼을 눌렀을 때 이 페이지로 넘어가게 해야겠죠?
activity_main.xml -> Text 클릭 후, SIGN UP 버튼에 해당하는 속성을

<Button
android:text="SIGN UP"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/btn_signup"
android:layout_below="@+id/btn_signin"
android:layout_centerHorizontal="true"
android:onClick="CliSignUp"/>


맨 마지막에 onClick을 추가해주세요.

그리고 MainActivity.java클래스 가셔서

OnCreate()함수 밑에 다음과 같이 추가해서 이어주세요.



public void CliSignUp(View view)
{
Intent intent = new Intent(this, SignupPage.class);
startActivity(intent);
}


그 다음에!
AndroidManifest.xml에 가셔서
다음과같이 Activity를 생성했음을 추가합니다.



<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.kyb24.singupandin">

<uses-permission android:name="android.permission.INTERNET"/>
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name=".SignupPage"/>
<activity android:name=".MenuPage"/>
</application>
</manifest>


자! 이제 실행시켜서

확인해 보겠습니다.

SIGN UP버튼-> ID : jake / PW :1234 입력 -> SUBMIT버튼 클릭


PHPMyAdmin에서 위 사진과 같이

값이 아주 잘 전달되셨음을 확인 할 수 있습니다.

(밑에 1 / 1은 그냥 혹시 몰라서 두번해봤습니다ㅎㅎ)



[B. DB에 있는 값을 비교해서 조건이 맞으면 로그인으로!(Sign in)]
Step1. 로그인 했을 때, 이동할 화면을 꾸미자

activity_menu.xml로 이동 -> Design

눌러서 아래 사진과 같이 꾸며주세요.



그리고 MenuPage.java클래스에 다음과 같이 써주세요.



package com.example.kyb24.singupandin;

import android.app.Activity;
import android.os.Bundle;
import android.widget.EditText;

public class MenuPage extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
}
}

이제 MainAcitivty.java클래스에 다음과 같이 써주시면 됩니다.

package com.example.kyb24.singupandin;

import android.app.ProgressDialog;
import android.os.Looper;
import android.os.StrictMode;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.content.Intent;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
import android.widget.ViewFlipper;

import java.util.ArrayList;
import java.util.List;
import org.apache.http.HttpResponse;
import org.apache.http.NameValuePair;
import org.apache.http.client.HttpClient;
import org.apache.http.client.ResponseHandler;
import org.apache.http.client.entity.UrlEncodedFormEntity;
import org.apache.http.client.methods.HttpPost;
import org.apache.http.impl.client.BasicResponseHandler;
import org.apache.http.impl.client.DefaultHttpClient;
import org.apache.http.message.BasicNameValuePair;
import android.app.Activity;
import android.app.AlertDialog;
import android.app.ProgressDialog;
import android.content.DialogInterface;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity {

ViewFlipper Vf;
Button BtnSignIn, BtnSignUp;
EditText inputID, inputPW;
HttpPost httppost;
StringBuffer buffer;
HttpResponse response;
HttpClient httpclient;
List<NameValuePair> nameValuePairs;
ProgressDialog dialog = null;
TextView tv;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

StrictMode.ThreadPolicy policy = new StrictMode.ThreadPolicy.Builder().permitAll().build();
StrictMode.setThreadPolicy(policy);

BtnSignUp = (Button)findViewById(R.id.btn_signup);
BtnSignIn = (Button)findViewById(R.id.btn_signin);
inputID = (EditText)findViewById(R.id.user_id);
inputPW = (EditText)findViewById(R.id.user_pw);
tv = (TextView)findViewById(R.id.textView2);

BtnSignIn.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
dialog = ProgressDialog.show(MainActivity.this, "",
"Validating user...", true);
new Thread(new Runnable() {
public void run() {
login();
}
}).start();
}
});
}

void login() {
try {
httpclient = new DefaultHttpClient();
httppost = new HttpPost("http://본인 PC IP주소/login.php");
nameValuePairs = new ArrayList<NameValuePair>(2);
nameValuePairs.add(new BasicNameValuePair("username", inputID.getText().toString()));
nameValuePairs.add(new BasicNameValuePair("password", inputPW.getText().toString()));
httppost.setEntity(new UrlEncodedFormEntity(nameValuePairs));
response = httpclient.execute(httppost);
ResponseHandler<String> responseHandler = new BasicResponseHandler();
final String response = httpclient.execute(httppost, responseHandler);
System.out.println("Response : " + response);
runOnUiThread(new Runnable() {
@Override
public void run() {
tv.setText("Response from PHP : " + response);
dialog.dismiss();
}
});

if (response.equalsIgnoreCase("User Found")) {
runOnUiThread(new Runnable() {
@Override
public void run() {
Toast.makeText(MainActivity.this, "Login Success", Toast.LENGTH_SHORT).show();
}
});

startActivity((new Intent(MainActivity.this, MenuPage.class)));
finish();
} else {
Toast.makeText(MainActivity.this, "Login Fail", Toast.LENGTH_SHORT).show();
}
}
catch(Exception e)
{
dialog.dismiss();
System.out.println("Exception : " + e.getMessage());
}
}

public void CliSignUp(View view)
{
Intent intent = new Intent(this, SignupPage.class);
startActivity(intent);
}
}



혹시 몰라서, activity_main.xml 코드 전체 내용도 첨부합니다



<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.kyb24.singupandin.MainActivity">

<TextView
android:text="ID"
android:textSize="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/id_view"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:layout_alignBottom="@+id/user_id"
android:layout_alignEnd="@+id/pw_view" />

<TextView
android:text="PW"
android:textSize="30dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/pw_view"
android:layout_below="@+id/id_view"
android:layout_alignParentStart="true" />

<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:ems="10"
android:id="@+id/user_pw"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="42dp"
android:hint="password" />

<Button
android:text="SIGN IN"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/btn_signin"
android:layout_below="@+id/user_pw"
android:layout_alignParentStart="true"
android:layout_marginTop="18dp"/>

<Button
android:text="SIGN UP"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/btn_signup"
android:layout_below="@+id/btn_signin"
android:layout_centerHorizontal="true"
android:onClick="CliSignUp"/>

<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textEmailAddress"
android:ems="10"
android:id="@+id/user_id"
android:layout_alignParentTop="true"
android:layout_alignStart="@+id/user_pw"
android:hint="email@input.com" />

<TextView
android:text="TextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="@+id/user_pw"
android:id="@+id/textView2"
android:layout_alignParentEnd="true" />

</RelativeLayout>

Step2. PHP 서버짜기


<?php
$connect = @mysql_connect("localhost","root","db비번") or die("error");
$dbname = "android_test(db이름)";
$dbconn = mysql_select_db($dbname,$connect);

$username = $_POST['username'];

$query_search = "select * from custom_info where u_id = '".$username."' AND u_pw = '".$password. "'";
$password = $_POST['password']; $query_exec = mysql_query($query_search) or die(mysql_error());
echo "User Found";
$rows = mysql_num_rows($query_exec); if($rows == 0) { echo "No Such User Found"; } else { }
?>

저장을 하신 뒤!
안드로이드 스튜디오에서 실행 후,
메인메뉴에서 ID : jake / PW : 1234
혹은 ID : 1 / PW : 1 을 입력하신 후
SIGN IN버튼을 누르시면 WELCOME!이라는
페이지로 잘 넘어가는걸 확인 하실 수 있습니다.
(A단계에서 SIGN UP을 이미 하셨으므로!
건을 만족하지 못하면
Login Fail이 뜨면서 화면이동이 안됩니다.)