Node-vibrant: ꡐ차 μΆœμ²˜μ—μ„œ μž‘λ™ν•˜μ§€ μ•ŠμŒ

에 λ§Œλ“  2019λ…„ 09μ›” 03일  Β·  9μ½”λ©˜νŠΈ  Β·  좜처: Vibrant-Colors/node-vibrant

λ‚˜λŠ” λΈŒλΌμš°μ €μ—μ„œ μƒμƒν•œ 것을 μ‚¬μš©ν•˜κ³  있으며 μ΄λ―Έμ§€λŠ” λ‚΄ 앱을 μ œκ³΅ν•˜λŠ” μ„œλ²„μ™€ λ‹€λ₯Έ μ„œλ²„μ— μžˆμŠ΅λ‹ˆλ‹€. μ‹€μ œλ‘œλŠ” Google 지역 정보 μ‚¬μ§„μž…λ‹ˆλ‹€. λ‚˜λŠ” λ¬Έμžμ—΄μ΄λ‚˜ ν•˜μ§€λ§Œ 항상 Cross-Origin 였λ₯˜κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€. 제 λΈŒλΌμš°μ €λŠ” νŒŒμ΄μ–΄ν­μŠ€μž…λ‹ˆλ‹€.

ꡐ차 좜처 이미지가 일반적인 μ‹œλ‚˜λ¦¬μ˜€λΌκ³  μƒκ°ν•©λ‹ˆλ‹€. μ–΄λ–»κ²Œ μž‘λ™μ‹œν‚€λ‚˜μš”?

Cross-Origin Request Blocked:
The Same Origin Policy disallows reading the remote resource at
https://maps.googleapis.com/maps/api/place/js/PhotoService.G...
(Reason: CORS header β€˜Access-Control-Allow-Origin’ missing).

루카

good first issue

κ°€μž₯ μœ μš©ν•œ λŒ“κΈ€

이에 λŒ€ν•œ μ—…λ°μ΄νŠΈκ°€ μžˆμŠ΅λ‹ˆκΉŒ?

λͺ¨λ“  9 λŒ“κΈ€

cors-anywhereλ₯Ό μ‚¬μš©ν•˜λ©΄ μ €μ—κ²Œ νš¨κ³Όμ μ΄μ—ˆμŠ΅λ‹ˆλ‹€. 이미지 URL μ•žμ— cors-anywhere URL을 μΆ”κ°€ν•˜κΈ°λ§Œ ν•˜λ©΄ λ©λ‹ˆλ‹€.

vibrantUrl= "https://cors-anywhere.herokuapp.com/" + imageUrl;

그런 λ‹€μŒ 이λ₯Ό μ‚¬μš©ν•˜μ—¬ Vibrant λΉŒλ”μ— μ „λ‹¬ν•©λ‹ˆλ‹€. img src λ˜λŠ” background-image 등에 λ‘œλ“œν•˜λ €λŠ” 경우 이 cors URL을 μ‚¬μš©ν•  수 μ—†μŠ΅λ‹ˆλ‹€. μ—¬μ „νžˆ 직접 URL을 μ‚¬μš©ν•΄μ•Ό ν•©λ‹ˆλ‹€.

@SmartASCII 일뢀 κ²½μš°μ— μž‘λ™ν•  수 μžˆμ§€λ§Œ λŒ€κ·œλͺ¨ ν”„λ‘œμ νŠΈμ— cors-anywhere λ₯Ό λ§μΉ˜λŠ” 것은 이상적이지 μ•ŠμŠ΅λ‹ˆλ‹€(그런 μ‹μœΌλ‘œ 데이터λ₯Ό λˆ„μΆœν•˜μ§€λ„ μ•ŠμŒ). Vibrant μš”μ²­μ— λŒ€ν•œ 헀더λ₯Ό node-vibrant κΈ°λŠ₯으둜 μΆ”κ°€ν•˜μ—¬ μˆ˜μ •ν•  수 μžˆλ„λ‘ ν—ˆμš©ν•˜λŠ” 것이 μ’‹μŠ΅λ‹ˆλ‹€.

예, ν”„λ‘μ‹œκ°€ μž‘λ™ν•  수 μžˆμ§€λ§Œ μž„μ‹œ ν•΄κ²° λ°©λ²•μœΌλ‘œ μ‚¬μš©ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.
생산 쀑. κ²°κ΅­ λ‚˜λŠ” λ‚΄ μ„œλ²„μ— 사진을 μ—…λ‘œλ“œν•˜κ³  있으며 λ¬Έμ œλŠ”
ν•΄κ²°

2019λ…„ 9μ›” 20일(금) 20:54 Corbin Crutchley [email protected]
썼닀:

@SmartASCII https://github.com/SmartASCII λ™μ•ˆ 이것이 μž‘λ™ν•  수 μžˆμŠ΅λ‹ˆλ‹€.
μ–΄λ–€ κ²½μš°μ—λŠ” 더 큰 규λͺ¨μ˜ ν”„λ‘œμ νŠΈλ₯Ό μœ„ν•΄ λͺ¨λ“  κ³³μ—μ„œ λ§μΉ˜μ§ˆμ„ ν•  κ²ƒμž…λ‹ˆλ‹€.
이상적이지 μ•ŠμŠ΅λ‹ˆλ‹€(그런 μ‹μœΌλ‘œ 데이터λ₯Ό λˆ„μΆœν•˜μ§€λ„ μ•ŠμŒ). ν—ˆμš©ν•˜λŠ” 것이 μ’‹μŠ΅λ‹ˆλ‹€.
μˆ˜μ •ν•  수 μžˆλŠ” λͺ¨λ“  Vibrant μš”μ²­μ— λŒ€ν•œ ν—€λ”λ‘œ 좔가됨
λ…Έλ“œ λ°”μ΄λΈŒλŸ°νŠΈ κΈ°λŠ₯

β€”
μŠ€λ ˆλ“œλ₯Ό μž‘μ„±ν–ˆκΈ° λ•Œλ¬Έμ— 이 λ©”μ‹œμ§€λ₯Ό λ°›λŠ” κ²ƒμž…λ‹ˆλ‹€.
이 이메일에 직접 λ‹΅μž₯ν•˜κ³  GitHubμ—μ„œ ν™•μΈν•˜μ„Έμš”.
https://github.com/akfish/node-vibrant/issues/101?email_source=notifications&email_token=ABCDSA4GJKDYSKYAUY6C5ADQKUL5TA5CNFSM4ITLGRV2YY3PNVWWKissueTUL52HS4DFVEXG43VMVBW63LN
λ˜λŠ” μŠ€λ ˆλ“œ μŒμ†Œκ±°
https://github.com/notifications/unsubscribe-auth/ABCDSAYXIIX65U3I25N256LQKUL5TANCNFSM4ITLGRVQ
.

λ™μΌν•œ 문제, ν•΄κ²° 방법을 λͺ¨μƒ‰ μ€‘μž…λ‹ˆλ‹€!

문제λ₯Ό ν•΄κ²°ν•˜λŠ” 방법에 λŒ€ν•œ 아이디어가 μžˆμŠ΅λ‹ˆκΉŒ? S3의 이미지와 ν•¨κ»˜ λ°˜μ‘ νŒ”λ ˆνŠΈλ₯Ό μ‚¬μš©ν•˜κ³  있으며 λ•Œλ•Œλ‘œ CORS 였λ₯˜κ°€ λ°œμƒν•©λ‹ˆλ‹€.

μ €λŠ” CORS-anywhereλ₯Ό μ‚¬μš©ν•˜μ—¬ κ·ΈλŸ¬ν•œ μ†”λ£¨μ…˜μ΄ μž‘λ™ν•˜λŠ”μ§€ ν™•μΈν•œ λ‹€μŒ, 둜컬둜 λ¦¬λ””λ ‰μ…˜ν•  수 μžˆλ„λ‘ 자체 CORS ν”„λ‘μ‹œ μ†”λ£¨μ…˜μ„ Node ν”„λ‘œμ νŠΈμ— λ‘€λ§ν–ˆμŠ΅λ‹ˆλ‹€.

이에 λŒ€ν•œ μ—…λ°μ΄νŠΈκ°€ μžˆμŠ΅λ‹ˆκΉŒ?

이것을 고치렀고 ν•˜λŠ” μ‚¬λžŒμ΄ μžˆμŠ΅λ‹ˆκΉŒ?

cors-anywhereλ₯Ό μ‚¬μš©ν•˜λ©΄ μ €μ—κ²Œ νš¨κ³Όμ μ΄μ—ˆμŠ΅λ‹ˆλ‹€. 이미지 URL μ•žμ— cors-anywhere URL을 μΆ”κ°€ν•˜κΈ°λ§Œ ν•˜λ©΄ λ©λ‹ˆλ‹€.

vibrantUrl= "https://cors-anywhere.herokuapp.com/" + imageUrl;

그런 λ‹€μŒ 이λ₯Ό μ‚¬μš©ν•˜μ—¬ Vibrant λΉŒλ”μ— μ „λ‹¬ν•©λ‹ˆλ‹€. img src λ˜λŠ” background-image 등에 λ‘œλ“œν•˜λ €λŠ” 경우 이 cors URL을 μ‚¬μš©ν•  수 μ—†μŠ΅λ‹ˆλ‹€. μ—¬μ „νžˆ 직접 URL을 μ‚¬μš©ν•΄μ•Ό ν•©λ‹ˆλ‹€.

λ‚΄ 각도 10 ν”„λ‘œμ νŠΈμ—μ„œ μž‘λ™ν•˜μ§€ μ•ŠλŠ” cors-anywhereλ₯Ό μΆ”κ°€ν•©λ‹ˆλ‹€. node-vibrantλŠ” cors-policy둜 인해 μ„œλ²„μ—μ„œ 이미지λ₯Ό λ‘œλ“œν•  수 μ—†μŠ΅λ‹ˆλ‹€.
λˆ„κ΅¬λ“ μ§€μ΄ λ¬Έμ œμ— λŒ€ν•œ 더 λ‚˜μ€ 해결책이 μžˆμŠ΅λ‹ˆκΉŒ?

이 νŽ˜μ΄μ§€κ°€ 도움이 λ˜μ—ˆλ‚˜μš”?
0 / 5 - 0 λ“±κΈ‰