Iriton's log

https://dreamhack.io/wargame/challenges/436 CSP Bypass AdvancedDescription Exercise: CSP Bypass의 패치된 문제입니다. 문제 수정 내역 2023.08.07 Dockerfile 제공dreamhack.ioCSP Bypass란?Content Security Policy (CSP)는 XSS 취약점을 활용한 공격으로부터 피해를 최소화하기 위해 새롭게 추가된 보안 계층 이를 우회하기 위한 방법 CSP Bypass인라인 코드를 이용 - 태그의 src 속성으로 로드하는 게 아닌 태그 내에 직접 코드를 삽입JSONP - JS의 페이로드는 callback이라는 GET 매개변수를 통해 JSONP 엔드포인트에 삽입할 수 있으며 엔드포인트는 SOP(동일출..

https://dreamhack.io/wargame/challenges/434 XSS Filtering Bypass AdvancedDescription Exercise: XSS Filtering Bypass의 패치된 문제입니다. 문제 수정 내역 2023.08.04 Dockerfile 제공dreamhack.io 코드 분석#!/usr/bin/python3from flask import Flask, request, render_templatefrom selenium import webdriverfrom selenium.webdriver.chrome.service import Serviceimport urllibimport osapp = Flask(__name__)app.secret_key = os.urando..

Llama3 모델을 선정하여 테스트 해 보았다. Ollama CLI 또는 Hugging Face를 통해 Llama 모델을 사용할 수 있다.  1-1. 허깅페이스 + Llama3 써보기개요Introduction - Hugging Face NLP Course Introduction - Hugging Face NLP Course2. Using 🤗 Transformers 3. Fine-tuning a pretrained model 4. Sharing models and tokenizers 5. The 🤗 Datasets library 6. The 🤗 Tokenizers library 9. Building and sharing demos newhuggingface.co 다양한 인공지능 모델들을 오픈 소스로 ..

참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com 이제는 배열 내부의 데이터를 제거하고 수정해 보자.  데이터 제거const arr = [1, 2, 3, 4, 5];array.silce(0, 2).concat(array.slice(3, 5))[ ...array.slice(0, 2), ...array.slice(3, 5) ];arr 배열에서 3을 없애고 싶으면 slice와 concat을 이용하거나 배열 전개 연산자를 이용해서 구현할 수 있지만단순히 값이 3인 ..

참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com  React에서는 state의 값을 직접 수정하면 안 된다. 불변성 유지 (데이터의 원본이 훼손되는 것을 막는 것) 때문인데 내장 함수(push, splice, unshift, pop) 배열 자체를 직접 수정하면 안 돼서 기존의 배열에 기반하여 새 배열을 만드는 함수(concat, slice, map, filter)를 사용해야 한다.  데이터 추가import React, { Component } from "r..

참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com  전화번호부 프로젝트 실습을 위해 새 프로젝트 생성  첫 번째 컴포넌트, PhoneForm 만들기// file: src/components/PhoneForm.jsimport React, { Component } from 'react';class PhoneForm extends Component { state = { name: '' } handleChange = (e) => { this.setS..

참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com LifeCycle API란 컴포넌트가 우리 브라우저에서 나타날 때, 사라질 때, 그리고 업데이트 될 때 호출되는 API이다.  컴포넌트 초기 생성constructorconstructor(props) { super(props);}컴포넌트 생성자 함수이다. 컴포넌트가 새로 만들어질 때마다 함수가 호출된다. componentDidMountcomponentDidMount() { // 외부 라이브러리 연동: D3,..

참고 자료 누구든지 하는 리액트: 초심자를 위한 리액트 핵심 강좌 | VELOPERT.LOG이 튜토리얼은 리액트를 1도 모르는 사람들을 위해 작성되었습니다. 만약에 여러분이 리액트를 배우고 싶은데, 아직 뭐가 뭔지 잘 모르겠다! 그렇다면 이 튜토리얼을 진행하고 나면 리액트가 무velopert.com  새 컴포넌트 만들기src/component/test 폴더를 생성하여 MyName이라는 컴포넌트를 만든다.import React, { Component } from 'react';class MyName extends Component { render() { return ( 안녕하세요! 제 이름은 {this.props.name} 입니다. ); }}export de..