Js
vue - cors 에러 proxy 사용(vite)
문제발생vue로 spring 서버의 데이터를 가져오는 도중 개발자의 숙원 cors 에러가 발생했다.vite.config.js 작성import { defineConfig } from "vite"; // Vite 설정을 정의하기 위한 헬퍼 함수 가져오기import vue from "@vitejs/plugin-vue"; // Vue 플러그인 가져오기export default defineConfig({ plugins: [ vue(), // Vue 플러그인 추가 ], server: { proxy: { '/api': { target: 'https://서버.com', // 프록시 요청을 보낼 대상 URL ..
js - 현재 페이지 url 관련 (location 객체)
1. 자주 사용하는 location 객체 // Ex) https://test.com:80/newpost?type=post window.location.href // Ex) https: window.location.protocol // Ex) test.com:80 window.location.host // Ex) test.com window.location.hostname // Ex) 80 window.location.port // Ex) newpost window.location.pathname // Ex) ?type=post window.location.search 2. 참고 https://hianna.tistory.com/464
js - this 바인딩 관련
Call & Apply 바인딩 예시 코드 class Point { constructor(x) { this.x = x; } info(y, z) { console.log(`x: ${this.x}, y: ${y}, z: ${z}`); } } var point = new Point(1); point.info(2, 3); // 결과 - x: 1, y: 2, z: 3 var point2 = {x: 100}; point.info.call(point2, 200, 300); // 결과 - x: 100, y: 200, z: 300 point.info.apply(point2, [200, 300]); // 결과 - x: 100, y: 200, z: 300 설명 함수를 바인딩하여 사용 시 this가 지정해준 object로 고정..
js - 변수값으로 변수명 짓기
코드 // 이름에 변수값으로 변수명 짓기 eval(`var ${변수}이름 = 값`); 예시 // 예) var 변수 = '변수'; eval(`var ${변수}이름 = 값`); console.log(변수이름); // 결과 (값);
js - 변수 값으로 함수 사용
코드 // 변수 값이 함수명인 함수 사용 eval(`${변수}()`); 예시 코드 // 예) function 함수() { console.log('성공!'); } var 변수 = '함수'; eval(`${변수}()`); // 결과 (성공)
js - 경과 시간 계산 함수
코드 /** * 입력받은 시간이 얼마나 경과 되었는지 반환하는 함수 * @param {string} time 과거 시간 * @returns {string} 경과 시간 */ function get_date_diff(time) { var now_time = new Date(); var deadline = new Date(time); var diff_time = (now_time - deadline) / 1000; var time_list = [ { time: "분", milli_seconds: 60 }, { time: "시간", milli_seconds: 60 * 60 }, { time: "일", milli_seconds: 60 * 60 * 24 }, { time: "개월", milli_seconds: 60..
ajax - 통신 중 로딩 이미지 출력
코드 js function lodingSign() { // 로딩 이미지 div var loading_div = ` `; $('body').append(loading_div); // 마우스 커서 로딩 중으로 변경 $('html').css("cursor", "wait"); // ajax 함수 실행 버튼 클릭 이벤트 차단 $('button').attr('onclick', 'return false;'); } function lodingImgHide() { // 마우스 커서 기본값으로 변경 $('html').css("cursor", "auto"); // ajax 함수 실행 버튼 클릭 이벤트 차단 해제 $('button').attr('onclick', '함수이름()'); // 로딩 이미지 삭제 $('#loading..