Programming/web 관련2024. 3. 27. 15:20

웹 브라우저 쿠키

로컬에 저장만 되서 불러서 쓰는건 줄 알았는데

서버에 요청시 request header에 cookie의 내용들이 전부 포함되서 요청된다.

 

HTTP 쿠키(웹 쿠키, 브라우저 쿠키)는 서버가 사용자의 웹 브라우저에 전송하는 작은 데이터 조각입니다. 브라우저는 그 데이터 조각들을 저장해 놓았다가, 동일한 서버에 재 요청 시 저장된 데이터를 함께 전송합니다. 쿠키는 두 요청이 동일한 브라우저에서 들어왔는지 아닌지를 판단할 때 주로 사용합니다. 이를 이용하면 사용자의 로그인 상태를 유지할 수 있습니다. 상태가 없는(stateless) HTTP 프로토콜에서 상태 정보를 기억시켜주기 때문입니다.

[링크 : https://developer.mozilla.org/ko/docs/Web/HTTP/Cookies]

[링크 : https://velog.io/@msung99/인증관련-Header-그리고-쿠키Cookie]

 

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

web worker  (0) 2024.07.19
mirage.js - api mockup  (0) 2024.07.19
let's encrypt 방식  (0) 2024.02.02
ajax session 인증  (0) 2024.01.26
bootstrap table 정렬기능  (0) 2024.01.26
Posted by 구차니
Programming/web 관련2024. 2. 2. 18:34

let's encrypt 방식

 

 

[링크 : https://hacktam.kr/etclec/180?sca=Server]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

mirage.js - api mockup  (0) 2024.07.19
웹 브라우저 쿠키  (0) 2024.03.27
ajax session 인증  (0) 2024.01.26
bootstrap table 정렬기능  (0) 2024.01.26
bootstrap modal  (0) 2024.01.23
Posted by 구차니
Programming/web 관련2024. 1. 26. 23:45

ajax session 인증

ajax가 로그인 하지 않은 사람에 대해서 튕겨내고 싶을때에 대해서 검색중..

 

[링크 : https://stackoverflow.com/questions/51472356/jquery-ajax-not-creating-golang-session-cockie]

 

[링크 : https://docs.informatica.com/ko_kr/master-data-management/multidomain-mdm/10-4-hotfix-3/_business-entity-services-guide_multidomain-mdm_10-4-hotfix-3_ditamap/GUID-809086BD-86BB-436B-835F-E47A3E9A4FC3/GUID-B87C1638-7186-452C-9B1B-23D0BF75480D.html]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

웹 브라우저 쿠키  (0) 2024.03.27
let's encrypt 방식  (0) 2024.02.02
bootstrap table 정렬기능  (0) 2024.01.26
bootstrap modal  (0) 2024.01.23
브라우저 언어 탐지  (0) 2024.01.18
Posted by 구차니
Programming/web 관련2024. 1. 26. 14:48

bootstrap table 정렬기능

테이블 만들고 jquery로 해당 id 검색후 DataTable() 함수를 호출하면 알아서 해준다.

// Basic example
$(document).ready(function () {
  $('#dtBasicExample').DataTable({
   "ordering": false // false to disable sorting (or any other option)
  });
  $('.dataTables_length').addClass('bs-select');
});

[링크 : https://mdbootstrap.com/docs/b4/jquery/tables/sort/]

[링크 : https://www.educba.com/bootstrap-sort-table/]

[링크 : https://codepen.io/agdg/pen/zpydmd]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

let's encrypt 방식  (0) 2024.02.02
ajax session 인증  (0) 2024.01.26
bootstrap modal  (0) 2024.01.23
브라우저 언어 탐지  (0) 2024.01.18
javascript exif 정보 얻기  (0) 2023.11.29
Posted by 구차니
Programming/web 관련2024. 1. 23. 17:48

bootstrap modal

클릭하면 팝업이 뜨면서 배경은 흐리게 되는 그것!

애니메이션까지 전부 제공하네.. 우와

 

[링크 : https://getbootstrap.com/docs/4.0/components/modal/]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

ajax session 인증  (0) 2024.01.26
bootstrap table 정렬기능  (0) 2024.01.26
브라우저 언어 탐지  (0) 2024.01.18
javascript exif 정보 얻기  (0) 2023.11.29
웹 브라우저 10080 포트 접근 차단 이유  (0) 2023.08.03
Posted by 구차니
Programming/web 관련2024. 1. 18. 16:32

브라우저 언어 탐지

크롬에서는 아래 한가지만 실행된다.

navigator.languages
(4) ['ko-KR', 'ko', 'en-US', 'en']

navigator.language
'ko-KR'

[링크 : https://phrase.com/blog/posts/detecting-a-users-locale/]

 

[링크 : https://stackoverflow.com/questions/3894488/is-there-anyway-to-detect-os-language-using-javascript]

[링크 : https://developer.mozilla.org/en-US/docs/Web/API/Navigator/language]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

bootstrap table 정렬기능  (0) 2024.01.26
bootstrap modal  (0) 2024.01.23
javascript exif 정보 얻기  (0) 2023.11.29
웹 브라우저 10080 포트 접근 차단 이유  (0) 2023.08.03
javascript 배열을파일로 저장하기  (0) 2023.08.02
Posted by 구차니
Programming/web 관련2023. 11. 29. 15:23

javascript exif 정보 얻기

exif의 orientation 정보를 이용하여

웹에서 이미지를 정상적인 방향으로 출력할 수 있을 듯?

[링크 : https://github.com/exif-js/exif-js]

 

const orientation = EXIF.getTag( fileInfo, "Orientation" );

[링크 : https://blog.naver.com/hj_kim97/222309039397]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

bootstrap modal  (0) 2024.01.23
브라우저 언어 탐지  (0) 2024.01.18
웹 브라우저 10080 포트 접근 차단 이유  (0) 2023.08.03
javascript 배열을파일로 저장하기  (0) 2023.08.02
Canvas2D: Multiple readback operations using getImageData  (0) 2023.07.24
Posted by 구차니
Programming/web 관련2023. 8. 3. 12:34

웹 브라우저 10080 포트 접근 차단 이유

크롬과 파이어폭스에서 둘다 막혀서 에러를 보니

ERR_UNSAFE_PORT

 

어떤 포트인가 해서 찾아보니 NAT slipstreaming 이라는 공격 기법의 주요 포트여서 막힌 듯.

포트 10080 NAT Slipstreaming 공격을 방지합니다

[링크 : https://itigic.com/ko/chrome-blocks-tcp-port-10080-to-prevent-attacks/]

 

7000 번 이하의 well known 포트는 거진 막아버린건가?

[링크 : https://blog.naver.com/celine2011/220973349118]

 

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

브라우저 언어 탐지  (0) 2024.01.18
javascript exif 정보 얻기  (0) 2023.11.29
javascript 배열을파일로 저장하기  (0) 2023.08.02
Canvas2D: Multiple readback operations using getImageData  (0) 2023.07.24
webGPU  (0) 2023.05.18
Posted by 구차니
Programming/web 관련2023. 8. 2. 14:52

javascript 배열을파일로 저장하기

blob 으로 하면 저장은 되는데, 옵션을 주어서 파일 유형을 골라줘야 할 듯.

arr = [1,2,3,4,5,100]
(6) [1, 2, 3, 4, 5, 100]
var blob = new Blob(arr)
window.open(URL.createObjectURL(blob))

 

url에 blob이 붙어서 신기하네

[링크 : https://blog.naver.com/nan17a/222058843806]

 

var aFileParts = ['<a id="a"><b id="b">hey!</b></a>'];
var oMyBlob = new Blob(aFileParts, {type : 'text/html'}); // the blob
window.open(URL.createObjectURL(oMyBlob));

[링크 : https://stackoverflow.com/questions/13405129/create-and-save-a-file-with-javascript]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

javascript exif 정보 얻기  (0) 2023.11.29
웹 브라우저 10080 포트 접근 차단 이유  (0) 2023.08.03
Canvas2D: Multiple readback operations using getImageData  (0) 2023.07.24
webGPU  (0) 2023.05.18
chart.js log 스케일  (0) 2023.03.31
Posted by 구차니
Programming/web 관련2023. 7. 24. 12:33

Canvas2D: Multiple readback operations using getImageData

canvas로 무언가를 그리는걸 구현했는데 1초에 한번 읽고

다시 붙여 넣고, 다시 1줄 붙여 넣고 이런식으로 1초 이내에 몇번의 작업을 하는 코드를 작성했더니

크롬에서 아래와 같은 notice 를 띄운다. 일단 최소한 경고는 아닌데..

Canvas2D: Multiple readback operations using getImageData are faster with the willReadFrequently attribute set to true. See: https://html.spec.whatwg.org/multipage/canvas.html#concept-canvas-will-read-frequently

 

링크를 찾아가서 보면 will read frequently를 true 로 설정해주면 최적화 된다고 하는데

The CanvasRenderingContext2D object also has a will read frequently boolean. When a CanvasRenderingContext2D object's will read frequently is true, the user agent may optimize the canvas for readback operations.
On most devices the user agent needs to decide whether to store the canvas's output bitmap on the GPU (this is also called "hardware accelerated"), or on the CPU (also called "software"). Most rendering operations are more performant for accelerated canvases, with the major exception being readback with getImageData(), toDataURL(), or toBlob(). CanvasRenderingContext2D objects with will read frequently equal to true tell the user agent that the webpage is likely to perform many readback operations and that it is advantageous to use a software canvas.

 

어디다가 저걸 넣어야 하나 해서 따라가보니 getContext("2d")로 끝낼게 아니라, 초기화 옵션으로 주면 되는 듯.

context = canvas.getContext('2d' [, { [ alpha: true ] [, desynchronized: false ] [, colorSpace: 'srgb'] [, willReadFrequently: false ]} ])Returns a CanvasRenderingContext2D object that is permanently bound to a particular canvas element.
If the alpha member is false, then the context is forced to always be opaque.
If the desynchronized member is true, then the context might be desynchronized.
The colorSpace member specifies the color space of the rendering context.
If the willReadFrequently member is true, then the context is marked for readback optimization.
context.canvas
✔MDN
Returns the canvas element.
attributes = context.getContextAttributes()Returns an object whose:

[링크 : https://html.spec.whatwg.org/multipage/canvas.html#canvasrenderingcontext2d]

 

그래서 결과적으로 아래와 같이 getContext에 willReadFrequently 를 추가해주니 별다른 경고가 발생하지 않는다.

var canvas = document.getElementById(cvsID)
var ctx = canvas.getContext("2d");
var imgObj = ctx.getImageData(0,0, canvas.width, canvas.height - 1);
var canvas = document.getElementById(cvsID)
var ctx = canvas.getContext("2d", {willReadFrequently : true} );
var imgObj = ctx.getImageData(0,0, canvas.width, canvas.height - 1);

[링크 : https://stackoverflow.com/questions/74101155/chrome-warning-willreadfrequently-attribute-set-to-true]

저작자표시 (새창열림)

'Programming > web 관련' 카테고리의 다른 글

웹 브라우저 10080 포트 접근 차단 이유  (0) 2023.08.03
javascript 배열을파일로 저장하기  (0) 2023.08.02
webGPU  (0) 2023.05.18
chart.js log 스케일  (0) 2023.03.31
chatGPT님 가라사대 Server-Sent Events (SSE)  (0) 2023.03.15
Posted by 구차니

티스토리툴바