login.js_bak 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  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 username = $('#username').val();
  22. var password = $('#password').val();
  23. if (username == '' || password == '') {
  24. let title = "登入失敗";
  25. let text = "請先輸入您的帳號/密碼";
  26. if (lang == 'en') {
  27. title = "Login Failed!";
  28. text = "Please enter your username and password";
  29. }
  30. Swal.fire({
  31. title: title,
  32. icon: 'error',
  33. text: text,
  34. confirmButtonColor: '#3085d6',
  35. });
  36. return;
  37. }
  38. var data = "grant_type=&username=" + username + "&password="+password+"&scope=&client_id=&client_secret=";
  39. const headers = {
  40. "accept": "application/json",
  41. "Content-Type": "application/x-www-form-urlencoded"
  42. }
  43. axios({
  44. method: 'post',
  45. url: url,
  46. headers: headers,
  47. data: data
  48. }).then(res => {
  49. console.log(res.data);
  50. document.cookie = 'jwt_token='+res.data.access_token;
  51. if(res.data.access_token!=null) {
  52. var title = "登入成功";
  53. if (lang == 'en') { // 英文版訊息
  54. title = "Login Successfully!"
  55. }
  56. Swal.fire({
  57. title: title,
  58. icon: 'success',
  59. confirmButtonColor: '#3085d6',
  60. });
  61. window.setTimeout(() => {
  62. window.location.href = 'user_profile2.html';
  63. }, 2000);
  64. btnLoginPage.style.display = 'none';
  65. } else {
  66. var title = "登入失敗";
  67. if (lang == 'en') { // 英文版訊息
  68. title = "Login Failed!"
  69. }
  70. Swal.fire({
  71. title: title,
  72. icon: 'error',
  73. text: responseOBJ.detail,
  74. confirmButtonColor: '#3085d6',
  75. });
  76. }
  77. }).catch(err => {
  78. console.log(err);
  79. })
  80. }
  81. /* var xhr = new XMLHttpRequest();
  82. xhr.open("POST", url);
  83. xhr.setRequestHeader("accept", "application/json");
  84. xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  85. xhr.onreadystatechange = function () {
  86. if (xhr.readyState === 4) {
  87. console.log(xhr.responseText); // test
  88. responseOBJ = JSON.parse(xhr.responseText);
  89. // document.cookie = 'jwt_token='+responseOBJ.jwt_token // access_token -> jwt_token
  90. document.cookie = 'jwt_token='+responseOBJ.access_token;
  91. console.log(responseOBJ);
  92. if (responseOBJ.access_token!=null)
  93. {
  94. var title = "登入成功";
  95. if (lang == 'en') { // 英文版訊息
  96. title = "Login Successfully!"
  97. }
  98. Swal.fire({
  99. title: title,
  100. icon: 'success',
  101. confirmButtonColor: '#3085d6',
  102. });
  103. window.setTimeout(() => {
  104. window.location.href = 'user_profile2.html';
  105. }, 2000);
  106. btnLoginPage.style.display = 'none';
  107. }
  108. else{
  109. var title = "登入失敗";
  110. if (lang == 'en') { // 英文版訊息
  111. title = "Login Failed!"
  112. }
  113. Swal.fire({
  114. title: title,
  115. icon: 'error',
  116. text: responseOBJ.detail,
  117. confirmButtonColor: '#3085d6',
  118. });
  119. }
  120. }
  121. };
  122. // 登入資料檢查
  123. if (username == '' || password == '') {
  124. let title = "登入失敗";
  125. let text = "請先輸入您的帳號/密碼";
  126. if (lang == 'en') {
  127. title = "Login Failed!";
  128. text = "Please enter your username and password";
  129. }
  130. Swal.fire({
  131. title: title,
  132. icon: 'error',
  133. text: text,
  134. confirmButtonColor: '#3085d6',
  135. });
  136. return;
  137. }
  138. result = xhr.send(data);
  139. console.log(result);
  140. } */
  141. function loginControl() {
  142. btnLoginPage.style.display = 'block';
  143. btnLogout.style.display = 'none';
  144. btnUserProfile.style.display = 'none';
  145. btnLoginPage_d.style.display = 'block';
  146. btnLogout_d.style.display = 'none';
  147. btnUserProfile_d.style.display = 'none';
  148. }
  149. loginControl();