login.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. const btnLogin = document.querySelector('#btn_login');
  2. const inputPassword = document.querySelector('#login #password');
  3. const btnLoginPage = document.querySelector('.btn-login');
  4. const btnUserProfile = document.querySelector('.btn-userProfile');
  5. const btnLogout = document.querySelector('.btn-logout');
  6. const btnLoginPage_d = document.querySelector('.login-top .btn-login');
  7. const btnUserProfile_d = document.querySelector('.login-top .btn-userProfile');
  8. const btnLogout_d= document.querySelector('.login-top .btn-logout');
  9. inputPassword.addEventListener('keyup', loginByEnter);
  10. btnLogin.addEventListener('click', login);
  11. function loginByEnter(e) {
  12. if (e.keyCode === 13) {
  13. e.preventDefault();
  14. console.log('login!');
  15. login();
  16. }
  17. };
  18. function login(){
  19. console.log('login!');
  20. var url = "https://www.choozmo.com:8887/login";
  21. var xhr = new XMLHttpRequest();
  22. xhr.open("POST", url);
  23. xhr.setRequestHeader("accept", "application/json");
  24. xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  25. xhr.onreadystatechange = function () {
  26. if (xhr.readyState === 4) {
  27. console.log(xhr.responseText); // test
  28. responseOBJ = JSON.parse(xhr.responseText);
  29. // document.cookie = 'jwt_token='+responseOBJ.jwt_token // access_token -> jwt_token
  30. document.cookie = 'jwt_token='+responseOBJ.access_token;
  31. console.log(responseOBJ);
  32. if (responseOBJ.access_token!=null)
  33. {
  34. var title = "登入成功";
  35. if (lang == 'en') { // 英文版訊息
  36. title = "Login Successfully!"
  37. }
  38. Swal.fire({
  39. title: title,
  40. icon: 'success',
  41. confirmButtonColor: '#3085d6',
  42. });
  43. window.setTimeout(() => {
  44. window.location.href = 'user_profile2.html';
  45. }, 2000);
  46. btnLoginPage.style.display = 'none';
  47. }
  48. else{
  49. var title = "登入失敗";
  50. if (lang == 'en') { // 英文版訊息
  51. title = "Login Failed!"
  52. }
  53. Swal.fire({
  54. title: title,
  55. icon: 'error',
  56. text: responseOBJ.detail,
  57. confirmButtonColor: '#3085d6',
  58. });
  59. }
  60. }
  61. };
  62. var data = "grant_type=&username=" + $('#username').val() + "&password="+$('#password').val()+"&scope=&client_id=&client_secret=";
  63. result = xhr.send(data);
  64. console.log(result);
  65. }
  66. function loginControl() {
  67. btnLoginPage.style.display = 'block';
  68. btnLogout.style.display = 'none';
  69. btnUserProfile.style.display = 'none';
  70. btnLoginPage_d.style.display = 'block';
  71. btnLogout_d.style.display = 'none';
  72. btnUserProfile_d.style.display = 'none';
  73. }
  74. loginControl();