[flutter (플루터 앱 개발)] flutter pocketbase 사용법 3탄(로그인)

오늘은 로그인방법에 대해서 글을 써보려고한다

디자이너가 없기때문에 이미 만들어져있는 코드를 사용하려고함

https://github.com/NearHuscarl/flutter_login
https://github.com/putraxor/flutter-login-ui

이런거 보고 그림그리면됨

이렇게 나옴

1. user collection 에 들어가서 API Preview 를 클릭한다.

사용가능한 api 들이 다 나옴

여기서 Auth with password 를 사용할거임

Required identity
Required password

요거 두개는 무조건 있어야 함

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

2. vscode 에서 사용하기

login-page-controller.dart 코드

class LoginTestPageController extends GetxController {
  TextEditingController email = TextEditingController();
  TextEditingController password = TextEditingController();

  login() async {
    try {
      var res = await dio.post(
        '$baseUrl/api/collections/users/auth-with-password',
        options: Options(
          headers: {
            'Authorization':
                'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MDc2NjMzMTIsImlkIjoiMjJ6bnExY3V1ZWk0c2U4IiwidHlwZSI6ImFkbWluIn0.oiJnEpQ0ZLEgUNuwkuVMN1muRQnxi7cXTsfJZ2fMnEk',
            'Content-Type': 'application/json',
          },
        ),
        data: {
          'identity': email.text,
          'password': password.text,
        },
      );
      res.statusCode == 200
          ? Get.snackbar('success', 'login success',
              backgroundColor: Colors.green[300])
          : Get.snackbar('failed', 'login failed',
              backgroundColor: Colors.red[300]);
      inspect(res.data);
    } catch (e) {
      print('login Error $e');
    }
  }
}

login-page.dart 코드

// ignore_for_file: library_private_types_in_public_api
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:personal_blog/bin/login-test-pg-ctl.dart';

class LoginPageTestPage extends StatefulWidget {
  static String tag = 'login-page';

  const LoginPageTestPage({super.key});
  @override
  _LoginPageTestPageState createState() => _LoginPageTestPageState();
}

class _LoginPageTestPageState extends State<LoginPageTestPage> {
  @override
  Widget build(BuildContext context) {
    LoginTestPageController controller = Get.put(LoginTestPageController());
    final logo = Hero(
      tag: 'hero',
      child: CircleAvatar(
        backgroundColor: Colors.transparent,
        radius: 48.0,
        child: Image.asset('assets/logo.png'),
      ),
    );

    final email = TextFormField(
      controller: controller.email,
      keyboardType: TextInputType.text,
      autofocus: false,
      decoration: InputDecoration(
        hintText: 'Email',
        contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
        border: OutlineInputBorder(borderRadius: BorderRadius.circular(32.0)),
      ),
    );

    final password = TextFormField(
      controller: controller.password,
      autofocus: false,
      obscureText: true,
      decoration: InputDecoration(
        hintText: 'Password',
        contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
        border: OutlineInputBorder(borderRadius: BorderRadius.circular(32.0)),
      ),
    );

    return Scaffold(
      backgroundColor: Colors.white,
      body: Center(
        child: ListView(
          shrinkWrap: true,
          padding: EdgeInsets.symmetric(horizontal: 20, vertical: 20),
          children: [
            logo,
            SizedBox(height: 48.0),
            email,
            SizedBox(height: 8.0),
            password,
            SizedBox(height: 24.0),
            SizedBox(
              width: MediaQuery.of(context).size.width * 0.1,
              height: MediaQuery.of(context).size.height * 0.05,
              child: ElevatedButton(
                onPressed: () {
                  controller.login();
                },
                child: Text(
                  'Login',
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}

위의 코드를 사용하고 로그인버튼을 누르면

로그인 완료된걸 확인할 수 있음

문의 환영!

4탄에서는 게시글 작성 , 게시글 가져오기를 해보겠슴다.

4탄도 많관부

 

[출처] https://velog.io/@sk1440sk/flutter-pocketbase-%EC%82%AC%EC%9A%A9%EB%B2%95-3%ED%83%84%EB%A1%9C%EA%B7%B8%EC%9D%B8

 

 

 

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
번호 제목 글쓴이 날짜 조회 수
154 [flutter (플루터 앱 개발)] Flutter - GetX를 이용한 상태관리 file 졸리운_곰 2024.07.12 0
153 [pocketbase] A PocketBase backend for Flutter and Dart : Flutter 및 Dart용 PocketBase 백엔드 file 졸리운_곰 2024.06.19 7
» [flutter (플루터 앱 개발)] flutter pocketbase 사용법 3탄(로그인) file 졸리운_곰 2024.06.10 18
151 [flutter (플루터 앱 개발)] flutter pocketbase 사용법 2탄(회원가입) file 졸리운_곰 2024.06.10 6
150 [flutter (플루터 앱 개발)] flutter pocketbase 사용방법 1탄(초기설정) file 졸리운_곰 2024.06.10 4
149 [게임 일반] 카드 덱 이미지 (트럼프 카드) 졸리운_곰 2024.05.27 30
148 [flutter (플루터 앱 개발)]Flutter - InAppWebview Communication (인앱웹뷰로 웹과 앱 양방향 통신하기, 자바스크립트 커뮤니케이션) file 졸리운_곰 2024.04.13 18
147 [flutter (플루터 앱 개발)] flutter - fvm 적용하기 (Futter Version Management) file 졸리운_곰 2024.04.11 18
146 [flutter (플루터 앱 개발)]Using Flutter FVM in Windows & MacOS file 졸리운_곰 2024.04.10 12
145 [flutter (플루터 앱 개발)] Flutter version management in Visual Studio Code with FVM 졸리운_곰 2024.04.10 11
144 [flutter (플루터 앱 개발)] pHp backend with flutter file 졸리운_곰 2024.03.18 16
143 [flutter (플루터 앱 개발)] [Flutter] fvm으로 Flutter 버전 관리 졸리운_곰 2024.03.17 8
142 [firebase v9] 파이어베이스 버전9 시작하기 - firebase v9 file 졸리운_곰 2023.12.24 14
141 [ Firebase ] v9부터 크게 달라진 사용법들 모아보기 file 졸리운_곰 2023.12.24 11
140 [게임 개발 일반] 콘솔은 어려울수록, 모바일은 쉬울수록 '돈' 쓴다 file 졸리운_곰 2023.10.30 15
139 [Unity] How to Create a Metaverse dApp with Unity : Unity로 Metaverse dApp을 만드는 방법 file 졸리운_곰 2023.09.13 25
138 [게임 개발 일반] 게임 초기 기획서 작성 방법 졸리운_곰 2023.07.16 20
137 [GameMaker Studio] Neural Network in Game Maker Studio – part 4 file 졸리운_곰 2023.07.07 9
136 [GameMaker Studio] Neural Network in Game Maker Studio – part 3 file 졸리운_곰 2023.07.07 14
135 [GameMaker Studio] Neural Network in Game Maker Studio – part 2 file 졸리운_곰 2023.07.07 7
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED