Redactor: ํ•ญ๋ชฉ์„ ์ €์žฅํ•œ ํ›„ Youtube iframe 'src' ๋งค๊ฐœ๋ณ€์ˆ˜๊ฐ€ ์ œ๊ฑฐ๋จ

์— ๋งŒ๋“  2020๋…„ 10์›” 13์ผ  ยท  7์ฝ”๋ฉ˜ํŠธ  ยท  ์ถœ์ฒ˜: craftcms/redactor

์„ค๋ช…

๊ทธ๋ž˜์„œ ์ง€๊ธˆ์€ YouTube ๋น„๋””์˜ค๋ฅผ ์˜ฌ๋ฐ”๋ฅด๊ฒŒ ํฌํ•จํ•  ์ˆ˜ ์žˆ๊ณ  ํ•ญ๋ชฉ์„ ์ €์žฅํ•  ๋•Œ ์ œ๊ฑฐํ•˜์ง€ ์•Š๋Š” ๊ธฐ๋ณธ HTML Purifier ๊ตฌ์„ฑ์„ ํ…Œ์ŠคํŠธํ•˜๊ณ  ์žˆ์—ˆ์ง€๋งŒ ์—ฌ์ „ํžˆ ์ œ๋Œ€๋กœ ์ž‘๋™ํ•˜์ง€ ์•Š์Šต๋‹ˆ๋‹ค. iframe src URL์ด youtube์ธ์ง€ vimeo์ธ์ง€ ๊ฒฐ์ •ํ•˜๋Š” ๋ฐ ์‚ฌ์šฉ๋˜๋Š” ์ •๊ทœ์‹์ด ์ •ํ™•ํ•˜์ง€ ์•Š๊ณ  ์‹œ์ž‘ ๋ถ€๋ถ„์—์„œ https: ๋ถ€๋ถ„์„ โ€‹โ€‹์ƒ๋žตํ•˜๋Š” youtube URL์˜ ๊ฒฝ์šฐ๋ฅผ ์„ค๋ช…ํ•˜์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์ด๋ผ๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค. URL.

์žฌํ˜„ ๋‹จ๊ณ„

  1. youtube๋กœ ์ด๋™ํ•˜์—ฌ ๋น„๋””์˜ค URL์„ ๊ฐ€์ ธ์˜ต๋‹ˆ๋‹ค(์˜ˆ: https://www.youtube.com/watch?v=roY6H75d9wE).
  2. ์œ„์˜ ์œ ํŠœ๋ธŒ ์˜์ƒ์„ ์—๋””ํ„ฐ์— ์ถ”๊ฐ€ํ•˜๋ ค๋ฉด redactor์˜ ๋น„๋””์˜ค ์ž„๋ฒ ๋“œ ์•„์ด์ฝ˜์„ ์‚ฌ์šฉํ•˜์„ธ์š”.
  3. ํ•ญ๋ชฉ ์ €์žฅ
  4. ๋Œ์•„์™€์„œ ๋™์ผํ•œ ํ•ญ๋ชฉ์„ ํŽธ์ง‘ํ•˜์‹ญ์‹œ์˜ค.
  5. ์œ ํŠœ๋ธŒ ๋™์˜์ƒ ์ธ๋„ค์ผ์ด ์‚ฌ๋ผ์ง„ ๊ฒƒ์„ ๋ณผ ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ํŽธ์ง‘๊ธฐ์—์„œ HTML์„ ๋ณด๋ฉด iframe ์ž์ฒด๊ฐ€ ์žˆ๊ณ  'src' ๋งค๊ฐœ๋ณ€์ˆ˜๊ฐ€ ๋ˆ„๋ฝ๋˜์–ด ์žˆ์Šต๋‹ˆ๋‹ค.

ํ•ด๊ฒฐ์ฑ…

์ด๊ฒƒ์€ YouTube ๋น„๋””์˜ค๋ฅผ ์ฒ˜์Œ ํฌํ•จํ•  ๋•Œ ๊ฒฐ๊ณผ HTML์ด ๋‹ค์Œ๊ณผ ๊ฐ™๊ธฐ ๋•Œ๋ฌธ์— ๋ฐœ์ƒํ•ฉ๋‹ˆ๋‹ค.

<figure><iframe style="width: 500px; height: 281px;" src="//www.youtube.com/embed/roY6H75d9wE" frameborder="0" allowfullscreen=""></iframe></figure>

๋‹น์‹ ์ด ์œ„์˜ ๋ณผ ์ˆ˜ ์žˆ๋“ฏ์ด src ๋งค๊ฐœ ๋ณ€์ˆ˜๋กœ ์‹œ์ž‘ // ๋Œ€์‹ ์—, https://

๊ฒฐ๊ณผ์ ์œผ๋กœ ํ˜„์žฌ ์‚ฌ์šฉ ์ค‘์ธ ์ •๊ทœ์‹์ด ๋ˆ„๋ฝ๋œ ์ฒด๊ณ„์˜ ๊ฐ€๋Šฅ์„ฑ์„ ๊ณ ๋ คํ•˜์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์— ์œ„์˜ src ๊ฐ’์ด ์ œ๊ฑฐ๋ฉ๋‹ˆ๋‹ค.
https://github.com/craftcms/redactor/blob/2fff5171f89538e84921119e8af533e6379ad24b/src/Field.php#L1019

๋‹ค์Œ์€ ์ด ์—ฃ์ง€ ์ผ€์ด์Šค์™€ ํ•จ๊ป˜ ์ž‘๋™ํ•˜๋Š” ๊ณผ๊ฑฐ์— ์‚ฌ์šฉํ•œ ์ •๊ทœ์‹์ž…๋‹ˆ๋‹ค.

'URI.SafeIframeRegexp' => '%^(https?:)?//(www\.youtube(?:-nocookie)?\.com/embed/|player\.vimeo\.com/video/)%',

https?: ๋ถ€๋ถ„ ์ฃผ์œ„์— ์ถ”๊ฐ€ ๋Œ€๊ด„ํ˜ธ์™€ ๋ฌผ์Œํ‘œ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์„ ํƒ ์‚ฌํ•ญ์œผ๋กœ ํ‘œ์‹œํ•ฉ๋‹ˆ๋‹ค. ๋˜ํ•œ youtube์˜ nocookie URL์„ ์„ค๋ช…ํ•ฉ๋‹ˆ๋‹ค. ๋งˆ์ง€๋ง‰์œผ๋กœ . (์ ) ๋ฌธ์ž๋„ ์ด์Šค์ผ€์ดํ”„ ์ฒ˜๋ฆฌ๋˜์–ด ์–ด๋–ค ๋ฌธ์ž๋„ ์•„๋‹Œ ์‹ค์ œ ์ ๊ณผ ์ผ์น˜ํ•˜๋„๋ก ํ–ˆ์Šต๋‹ˆ๋‹ค.

์ถ”๊ฐ€ ์ •๋ณด

  • ํฌ๋ž˜ํ”„ํŠธ ๋ฒ„์ „: 3.5.12.1
  • PHP ๋ฒ„์ „: 7.3
  • ๋ฐ์ดํ„ฐ๋ฒ ์ด์Šค ๋“œ๋ผ์ด๋ฒ„ ๋ฐ ๋ฒ„์ „: pgsql 11
  • ํ”Œ๋Ÿฌ๊ทธ์ธ ๋ฐ ๋ฒ„์ „: redactor 2.8.1

๋ชจ๋“  7 ๋Œ“๊ธ€

๋˜ํ•œ ์ •๊ทœ์‹์˜ . (์ ) ๋ฌธ์ž๋Š” ๋ฌธ์ž๊ฐ€ ์•„๋‹Œ ๋ฆฌํ„ฐ๋Ÿด . ๋ฌธ์ž์™€ ์ผ์น˜์‹œํ‚ค๊ธฐ ์œ„ํ•œ ์˜๋„์ด๋ฏ€๋กœ ์ ์ ˆํ•˜๊ฒŒ ์ด์Šค์ผ€์ดํ”„ํ•ด์•ผ ํ•œ๋‹ค๊ณ  ์ƒ๊ฐํ•ฉ๋‹ˆ๋‹ค. ๋‚˜๋Š” ๊ทธ๋“ค์„ ํƒˆ์ถœํ•˜๊ธฐ ์œ„ํ•ด ์œ„์˜ ์ •๊ทœ์‹ ์†”๋ฃจ์…˜์„ ์—…๋ฐ์ดํŠธํ–ˆ์Šต๋‹ˆ๋‹ค.

@andris-sevcenko๊ฐ€ ์ด ๋ฌธ์ œ๋ฅผ ๋ณด์•˜๋Š”์ง€ ํ™•์ธํ•˜๊ธฐ ์œ„ํ•ด ์ฒดํฌ์ธํ–ˆ์Šต๋‹ˆ๋‹ค. ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

@sidm1983 ์žˆ์Šต๋‹ˆ๋‹ค. ์ด์— ๋Œ€ํ•œ PR์„ ์ œ์ถœํ•˜์‹œ๊ฒ ์Šต๋‹ˆ๊นŒ?

์ด ๋ฌธ์ œ๋ฅผ ํ•ด๊ฒฐํ•˜๋Š” 2.8.3์ด ์ถœ์‹œ๋˜์—ˆ์Šต๋‹ˆ๋‹ค.

์ƒˆ๋กœ์šด Craft ํ”„๋กœ์ ํŠธ์— ๋Œ€ํ•œ ๊ธฐ๋ณธ HTML Purifier ๊ตฌ์„ฑ๋„ ์—…๋ฐ์ดํŠธํ–ˆ์Šต๋‹ˆ๋‹ค. config/htmlpurifier/Default.json ํŒŒ์ผ์ด ์žˆ๋Š” ๊ฒฝ์šฐ ์ˆ˜๋™์œผ๋กœ ๋ณ€๊ฒฝํ•ด์•ผ ํ•ฉ๋‹ˆ๋‹ค. https://github.com/craftcms/craft/commit/2e3710956cd6d8f8a1ac572a2b10c53e714f1799

@andris-sevcenko & @brandonkelly์— ๊ฐ์‚ฌ๋“œ๋ฆฝ๋‹ˆ๋‹ค. ๋‹น์‹œ ๊ธฐํšŒ๊ฐ€ ์—†์—ˆ๊ธฐ ๋•Œ๋ฌธ์— ์ด์— ๋Œ€ํ•œ PR์„ ์ œ์ถœํ•˜์ง€ ์•Š์€ ์  ์‚ฌ๊ณผ๋“œ๋ฆฝ๋‹ˆ๋‹ค. ๊ทธ๋ž˜๋„ ์ •๋ฆฌํ•ด์ฃผ์…”์„œ ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค.

@brandonkelly , ์œ„ ์ปค๋ฐ‹์—์„œ ๋ณ€๊ฒฝํ•œ ์‚ฌํ•ญ์— ๋Œ€ํ•œ ๊ฐ„๋‹จํ•œ ์งˆ๋ฌธ์ž…๋‹ˆ๋‹ค. ์  ๋ฌธ์ž๊ฐ€ ์ด์Šค์ผ€์ดํ”„ ์ฒ˜๋ฆฌ๋˜์ง€ ์•Š์€ ๊ฒƒ์ฒ˜๋Ÿผ ๋ณด์ž…๋‹ˆ๋‹ค. ์ฆ‰, ๋‹จ์ผ ์ ์ด ์•„๋‹Œ ๋ชจ๋“  ๋ฌธ์ž์™€ ์ผ์น˜ํ•ฉ๋‹ˆ๋‹ค. ์˜๋„์ ์ธ๊ฐ€์š”?

@brandonkelly ๋Š” ์ •๊ทœ์‹์—์„œ ์  ๋ฌธ์ž๋ฅผ ์ด์Šค์ผ€์ดํ”„ํ•˜๋Š” ๊ฒƒ์— ๋Œ€ํ•œ ์œ„์˜ ๋‚ด ์˜๊ฒฌ์„ ๋ณด์•˜๋Š”์ง€ ํ™•์ธํ•˜๊ณ  ์‹ถ์—ˆ์Šต๋‹ˆ๋‹ค. ๊ฐ์‚ฌํ•ฉ๋‹ˆ๋‹ค. ๐Ÿ˜Š๐Ÿ™๐Ÿฝ

์ด ํŽ˜์ด์ง€๊ฐ€ ๋„์›€์ด ๋˜์—ˆ๋‚˜์š”?
0 / 5 - 0 ๋“ฑ๊ธ‰