Angular.js: $httpλŠ” POSTED JSON 객체의 λ‚ μ§œλ₯Ό μˆ˜μ •ν•©λ‹ˆλ‹€(μ‹œκ°„λŒ€ λ˜λŠ” κ³„μ ˆλ³„ μ˜€ν”„μ…‹ 제거).

에 λ§Œλ“  2016λ…„ 04μ›” 25일  Β·  3μ½”λ©˜νŠΈ  Β·  좜처: angular/angular.js

λ‚˜λŠ” 이것이 버그라고 μƒκ°ν•œλ‹€.

ν˜„μž¬ 행동은 λ¬΄μ—‡μž…λ‹ˆκΉŒ?

ν˜„μž¬ λ‘œκ·Έμ•„μ›ƒν•˜λŠ” 멋진 λ‚ μ§œ κ°œμ²΄κ°€ μžˆμŠ΅λ‹ˆλ‹€.

2016λ…„ 4μ›” 29일 κΈˆμš”μΌ 13:33:00 GMT+0100(BST)

이 κ°œμ²΄κ°€ $httpλ₯Ό 톡해 κ²Œμ‹œλ˜λ©΄ λ„€νŠΈμ›Œν¬ μš”μ²­μ—μ„œ λ‹€μŒμ΄ κ΄€μ°°λ©λ‹ˆλ‹€.

2016-04-28T12:33:00.000Z

λ”°λΌμ„œ $http κ°œμ²΄λŠ” μ‹œκ°„μ„ λΉΌμ„œ μ‹œκ°„μ—μ„œ 영ꡭ μ„œλ¨Έ νƒ€μž„ BSTλ₯Ό 효과적으둜 μ œκ±°ν•©λ‹ˆλ‹€. λ”°λΌμ„œ 이것은 μ˜€ν”„μ…‹ 없이 λ°μ΄ν„°λ² μ΄μŠ€μ— μ €μž₯λ©λ‹ˆλ‹€. 이 λ‚ μ§œλ₯Ό μ¦‰μ‹œ 읽으면 λ‹€μ‹œ λŒμ•„μ˜€μ§€λ§Œ μ‹œμŠ€ν…œμ€ μ‹œκ°„μ„ λ‹€μ‹œ μΆ”κ°€ν•΄μ•Ό ν•œλ‹€λŠ” 것을 μ–΄λ–»κ²Œ μ•Œ 수 μžˆμŠ΅λ‹ˆκΉŒ?

λ”°λΌμ„œ μ‚¬μš©μžκ°€ λ‹€λ₯Έ μ‹œκ°„λŒ€μ— μžˆλ‹€κ³  μƒμƒν•΄λ³΄μ‹­μ‹œμ˜€. 5μ‹œκ°„ μ•žμ„œ μ‹œμŠ€ν…œμ΄ 5μ‹œκ°„μ„ λΊλ‹ˆλ‹€...μ‹œκ°„μ€ μƒμ„±λœ μ»¨ν…μŠ€νŠΈμ— λ―Όκ°ν•©λ‹ˆλ‹€. 즉, μ‹œκ°„λŒ€ 정보λ₯Ό μ œκ±°ν•˜λ©΄ μ•ˆ λ©λ‹ˆλ‹€.

Chromeμ—μ„œ 이것을 보고 μžˆμŠ΅λ‹ˆλ‹€. 각도 1.4.2

λ˜ν•œ http://stackoverflow.com/questions/24356475/angular-js-date-changes-when-submitted-to-http-timezone-issue

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

λ¨Όμ € Date 객체에 μ‹œκ°„λŒ€ 정보가 μ—†λ‹€λŠ” 말이 μ˜³μ§€ μ•Šλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€.

λ‚˜λŠ” μ—¬μ „νžˆ :grin: A Date object _"λŠ” 1970λ…„ 1μ›” 1일 UTC μ΄ν›„μ˜ λ°€λ¦¬μ΄ˆ 수인 μ‹œκ°„ 값을 기반으둜 ν•˜λŠ” [...] 단일 μˆœκ°„μ„ λ‚˜νƒ€λƒ…λ‹ˆλ‹€."라고 λ§ν•˜λŠ” 것이 μ˜³λ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. _ (좜처: MDN ). λ”°λΌμ„œ 기본적으둜 각 Date μΈμŠ€ν„΄μŠ€λŠ” 이 ν•˜λ‚˜μ˜ 값에 λŒ€ν•΄μ„œλ§Œ μ•Œκ³  이 κ°’μ˜ λ‹€λ₯Έ λͺ¨λ“  ν‘œν˜„μ€ ν•΄λ‹Ή 정보와 λ‘œμΌ€μΌ/μ‹œμŠ€ν…œ μƒνƒœ(예: μ‹œκ°„λŒ€ μ˜€ν”„μ…‹)λ₯Ό 기반으둜 μœ λ„λ©λ‹ˆλ‹€.

#

Date κ°μ²΄μ—λŠ” getTimezoneOffset 및 toISOString λ©”μ„œλ“œκ°€ μžˆμŠ΅λ‹ˆλ‹€.

이듀은 Date 개체(일λͺ… μΈμŠ€ν„΄μŠ€) μžμ²΄κ°€ μ•„λ‹ˆλΌ Date ν”„λ‘œν† νƒ€μž…(좜처: MDN )의 λ©”μ„œλ“œμž…λ‹ˆλ‹€.

보닀 ꡬ체적으둜, getTimezoneOffset() 의 값은 ν˜„μž¬ λ‘œμΌ€μΌ(호슀트 μ‹œμŠ€ν…œ μ„€μ •)에 따라 λ‹€λ¦…λ‹ˆλ‹€. 이것이 λ™λ“±ν•œ setTimezoneOffset() λ©”μ†Œλ“œκ°€ μ—†λŠ” μ΄μœ μ™€ λ™μΌν•œ μ‹œμŠ€ν…œμ˜ λͺ¨λ“  Date κ°œμ²΄κ°€ getTimezoneOffset() λŒ€ν•΄ λ™μΌν•œ 값을 λ°˜ν™˜ν•˜λŠ” μ΄μœ μž…λ‹ˆλ‹€. 예:

const d1 = new Date('December 15, 2018 12:34:56');  // No timezone; uses the current system locale.
const d2 = new Date('December 15, 2018 12:34:56 GMT+10'); // Uses GTM+10 as timezone.

d1.getTimezoneOffset() === d2.getTimezoneOffset();  // true

λ”°λΌμ„œ Date μ „λ‹¬λœ λ‚ μ§œ λ¬Έμžμ—΄ ν‘œν˜„μ— μ§€μ •λœ μ‹œκ°„λŒ€ μ •λ³΄λŠ” μœ„μ—μ„œ μ„€λͺ…ν•œ λŒ€λ‘œ ν•΄λ‹Ή λ¬Έμžμ—΄μ„ ꡬ문 λΆ„μ„ν•˜κ³  νŠΉμ • μ‹œμ μ— λ§€ν•‘ν•˜λŠ” 데만 μ‚¬μš©λ©λ‹ˆλ‹€. κ²°κ³Ό Date κ°œμ²΄λŠ” μ‹œκ°„λŒ€μ— λŒ€ν•΄ 아무것도 λͺ¨λ¦…λ‹ˆλ‹€.

toISOString() λ©”μ„œλ“œλŠ” μ œμ•ˆν•œ λŒ€λ‘œ μ‹œκ°„λŒ€ 정보λ₯Ό μΈμ‡„ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. UTC λ₯Ό λ‚˜νƒ€λ‚΄λŠ” Z λ₯Ό 끝에 μΆ”κ°€ν•©λ‹ˆλ‹€.

#

λ‘˜μ§Έ, JSON.stringify() 도 μ˜μ—­ 값을 μ œκ±°ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.

μœ„μ—μ„œ μ„€λͺ…ν•œ κ²ƒμ²˜λŸΌ λ‚ μ§œ 값을 UTC둜 ν‘œν˜„ν•˜λŠ” toISOString() λ₯Ό μ‚¬μš©ν•©λ‹ˆλ‹€(λ”°λΌμ„œ 끝에 Z λ₯Ό μΆ”κ°€ν•˜μ—¬ λ‚˜νƒ€λƒ„). λ°˜ν™˜λœ λ¬Έμžμ—΄μ— μ‹œκ°„λŒ€ 정보가 μ—†μŠ΅λ‹ˆλ‹€.

#

λ”°λΌμ„œ APIκ°€ ν•΄λ‹Ή λ°€λ¦¬μ΄ˆ 값이 μ—†λŠ” ISO λ‚ μ§œλ₯Ό λ Œλ”λ§ν•˜κ³  UIκ°€ λ‚ μ§œλ§Œ μ„ νƒν•˜κ³  λ‚ μ§œλ₯Ό λ³€κ²½ν•˜λŠ” 일뢀 datepickerλ₯Ό μ‚¬μš©ν•˜λŠ” 경우 AngularλŠ” λ‚ μ§œλ₯Ό ISO ν˜•μ‹μœΌλ‘œ λ‹€μ‹œ λ³€ν™˜ν•  λ•Œ λ°€λ¦¬μ΄ˆκ°€ 없을 것이라고 λ―ΏμŠ΅λ‹ˆλ‹€. κ°’.

λ°€λ¦¬μ΄ˆκ°€ 그것과 무슨 관련이 μžˆλŠ”μ§€ μ „ν˜€ λͺ¨λ¦…λ‹ˆλ‹€. μš°λ¦¬λŠ” μ‹œκ°„λŒ€ 정보에 λŒ€ν•΄ μ΄μ•ΌκΈ°ν•˜κ³  μžˆμ—ˆμŠ΅λ‹ˆλ‹€.

λ‹€μ‹œ λ§ν•˜μ§€λ§Œ 이것은 AngularJS와 아무 관련이 μ—†μŠ΅λ‹ˆλ‹€. 이것이 κΈ°λ³Έ 제곡 개체(예: Date 및 JSON )κ°€ μ„œλ‘œ μƒν˜Έ μž‘μš©ν•˜λŠ” λ°©μ‹μž…λ‹ˆλ‹€.

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

이것은 Angular에 νŠΉμ •ν•œ 것이 μ•„λ‹™λ‹ˆλ‹€. μ΄λŠ” ν‘œμ€€ JSON.stringify λ™μž‘μž…λ‹ˆλ‹€.

기본적으둜 데이터λ₯Ό κ²Œμ‹œν•  λ•Œ $http λŠ” 데이터λ₯Ό JSON으둜 λ³€ν™˜ν•©λ‹ˆλ‹€( JSON.stringify() ). JavaScriptμ—μ„œ Date 객체의 JSON ν‘œν˜„μ€ ISO-8601 ν˜•μ‹(λ„€νŠΈμ›Œν¬ 탭에 ν‘œμ‹œλ¨)μž…λ‹ˆλ‹€.

Date κ°μ²΄μ—λŠ” μ–΄μ¨Œλ“  μ‹œκ°„λŒ€ 정보가 μ—†μœΌλ―€λ‘œ 정보가 μ œκ±°λ˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. ν˜„μž¬ λ‘œμΌ€μΌ(Date κ°œμ²΄κ°€ λ‚˜νƒ€λ‚΄λŠ” λ‚ μ§œμ™€ μ™„μ „νžˆ λ…λ¦½μ μž„)μ—λŠ” μ‹œκ°„λŒ€ μ˜€ν”„μ…‹μ΄ 있으며 λΈŒλΌμš°μ €λŠ” console.log gingν•  λ•Œ ν•΄λ‹Ή μ˜€ν”„μ…‹μ— 따라 λ‚ μ§œ ν˜•μ‹μ„ μ§€μ •ν•©λ‹ˆλ‹€.

λ‹«λŠ” 것은 Angular의 λ¬Έμ œκ°€ μ•„λ‹™λ‹ˆλ‹€.

@gkalpak λ¨Όμ € Date 객체에 μ‹œκ°„λŒ€ 정보가 μ—†λ‹€λŠ” 것은 μ˜³μ§€ μ•Šλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. new Date()둜 λ‚ μ§œλ₯Ό 생성할 λ•Œ ν‘œμ€€ μ‹œκ°„λŒ€ μ •λ³΄λŠ” 기본적으둜 둜컬 μ˜μ—­μž…λ‹ˆλ‹€. Date κ°œμ²΄μ—λŠ” getTimezoneOffset 및 toISOString λ©”μ„œλ“œκ°€ μžˆμŠ΅λ‹ˆλ‹€. 이 λ©”μ„œλ“œλ₯Ό ν˜ΈμΆœν•˜λ©΄ μ˜μ—­ 값이 λ°˜ν™˜λ©λ‹ˆλ‹€. λΈŒλΌμš°μ €κ°€ μš°λ¦¬μ—κ²Œ 쒋은 κ²°κ³Όλ₯Ό μΈμ‡„ν•˜λŠ” 것은 μ•„λ‹ˆλ©° Date 개체의 μ‹€μ œ κ°’μž…λ‹ˆλ‹€.

new Date().getTimezoneOffset()
-330

new Date().toISOString()
"2018-12-04T05:40:37.399Z"

λ‘˜μ§Έ, JSON.stringify() 도 μ˜μ—­ 값을 μ œκ±°ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. λ‹€μŒμ€ λΈŒλΌμš°μ € μ½˜μ†”μ—μ„œ λ³Έ 것과 λ™μΌν•©λ‹ˆλ‹€. λΈŒλΌμš°μ €λŠ” μš°λ¦¬μ—κ²Œ 쒋은 것을 μΈμ‡„ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.

JSON.stringify({d:new Date()})
"{"d":"2018-12-04T05:42:08.973Z"}"

λ”°λΌμ„œ APIκ°€ ν•΄λ‹Ή λ°€λ¦¬μ΄ˆ 값이 μ—†λŠ” ISO λ‚ μ§œλ₯Ό λ Œλ”λ§ν•˜κ³  UIκ°€ λ‚ μ§œλ§Œ μ„ νƒν•˜κ³  λ‚ μ§œλ₯Ό λ³€κ²½ν•˜λŠ” 일뢀 datepickerλ₯Ό μ‚¬μš©ν•˜λŠ” 경우 AngularλŠ” λ‚ μ§œλ₯Ό ISO ν˜•μ‹μœΌλ‘œ λ‹€μ‹œ λ³€ν™˜ν•  λ•Œ λ°€λ¦¬μ΄ˆκ°€ 없을 것이라고 λ―ΏμŠ΅λ‹ˆλ‹€. κ°’.

λ¨Όμ € Date 객체에 μ‹œκ°„λŒ€ 정보가 μ—†λ‹€λŠ” 말이 μ˜³μ§€ μ•Šλ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€.

λ‚˜λŠ” μ—¬μ „νžˆ :grin: A Date object _"λŠ” 1970λ…„ 1μ›” 1일 UTC μ΄ν›„μ˜ λ°€λ¦¬μ΄ˆ 수인 μ‹œκ°„ 값을 기반으둜 ν•˜λŠ” [...] 단일 μˆœκ°„μ„ λ‚˜νƒ€λƒ…λ‹ˆλ‹€."라고 λ§ν•˜λŠ” 것이 μ˜³λ‹€κ³  μƒκ°ν•©λ‹ˆλ‹€. _ (좜처: MDN ). λ”°λΌμ„œ 기본적으둜 각 Date μΈμŠ€ν„΄μŠ€λŠ” 이 ν•˜λ‚˜μ˜ 값에 λŒ€ν•΄μ„œλ§Œ μ•Œκ³  이 κ°’μ˜ λ‹€λ₯Έ λͺ¨λ“  ν‘œν˜„μ€ ν•΄λ‹Ή 정보와 λ‘œμΌ€μΌ/μ‹œμŠ€ν…œ μƒνƒœ(예: μ‹œκ°„λŒ€ μ˜€ν”„μ…‹)λ₯Ό 기반으둜 μœ λ„λ©λ‹ˆλ‹€.

#

Date κ°μ²΄μ—λŠ” getTimezoneOffset 및 toISOString λ©”μ„œλ“œκ°€ μžˆμŠ΅λ‹ˆλ‹€.

이듀은 Date 개체(일λͺ… μΈμŠ€ν„΄μŠ€) μžμ²΄κ°€ μ•„λ‹ˆλΌ Date ν”„λ‘œν† νƒ€μž…(좜처: MDN )의 λ©”μ„œλ“œμž…λ‹ˆλ‹€.

보닀 ꡬ체적으둜, getTimezoneOffset() 의 값은 ν˜„μž¬ λ‘œμΌ€μΌ(호슀트 μ‹œμŠ€ν…œ μ„€μ •)에 따라 λ‹€λ¦…λ‹ˆλ‹€. 이것이 λ™λ“±ν•œ setTimezoneOffset() λ©”μ†Œλ“œκ°€ μ—†λŠ” μ΄μœ μ™€ λ™μΌν•œ μ‹œμŠ€ν…œμ˜ λͺ¨λ“  Date κ°œμ²΄κ°€ getTimezoneOffset() λŒ€ν•΄ λ™μΌν•œ 값을 λ°˜ν™˜ν•˜λŠ” μ΄μœ μž…λ‹ˆλ‹€. 예:

const d1 = new Date('December 15, 2018 12:34:56');  // No timezone; uses the current system locale.
const d2 = new Date('December 15, 2018 12:34:56 GMT+10'); // Uses GTM+10 as timezone.

d1.getTimezoneOffset() === d2.getTimezoneOffset();  // true

λ”°λΌμ„œ Date μ „λ‹¬λœ λ‚ μ§œ λ¬Έμžμ—΄ ν‘œν˜„μ— μ§€μ •λœ μ‹œκ°„λŒ€ μ •λ³΄λŠ” μœ„μ—μ„œ μ„€λͺ…ν•œ λŒ€λ‘œ ν•΄λ‹Ή λ¬Έμžμ—΄μ„ ꡬ문 λΆ„μ„ν•˜κ³  νŠΉμ • μ‹œμ μ— λ§€ν•‘ν•˜λŠ” 데만 μ‚¬μš©λ©λ‹ˆλ‹€. κ²°κ³Ό Date κ°œμ²΄λŠ” μ‹œκ°„λŒ€μ— λŒ€ν•΄ 아무것도 λͺ¨λ¦…λ‹ˆλ‹€.

toISOString() λ©”μ„œλ“œλŠ” μ œμ•ˆν•œ λŒ€λ‘œ μ‹œκ°„λŒ€ 정보λ₯Ό μΈμ‡„ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€. UTC λ₯Ό λ‚˜νƒ€λ‚΄λŠ” Z λ₯Ό 끝에 μΆ”κ°€ν•©λ‹ˆλ‹€.

#

λ‘˜μ§Έ, JSON.stringify() 도 μ˜μ—­ 값을 μ œκ±°ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.

μœ„μ—μ„œ μ„€λͺ…ν•œ κ²ƒμ²˜λŸΌ λ‚ μ§œ 값을 UTC둜 ν‘œν˜„ν•˜λŠ” toISOString() λ₯Ό μ‚¬μš©ν•©λ‹ˆλ‹€(λ”°λΌμ„œ 끝에 Z λ₯Ό μΆ”κ°€ν•˜μ—¬ λ‚˜νƒ€λƒ„). λ°˜ν™˜λœ λ¬Έμžμ—΄μ— μ‹œκ°„λŒ€ 정보가 μ—†μŠ΅λ‹ˆλ‹€.

#

λ”°λΌμ„œ APIκ°€ ν•΄λ‹Ή λ°€λ¦¬μ΄ˆ 값이 μ—†λŠ” ISO λ‚ μ§œλ₯Ό λ Œλ”λ§ν•˜κ³  UIκ°€ λ‚ μ§œλ§Œ μ„ νƒν•˜κ³  λ‚ μ§œλ₯Ό λ³€κ²½ν•˜λŠ” 일뢀 datepickerλ₯Ό μ‚¬μš©ν•˜λŠ” 경우 AngularλŠ” λ‚ μ§œλ₯Ό ISO ν˜•μ‹μœΌλ‘œ λ‹€μ‹œ λ³€ν™˜ν•  λ•Œ λ°€λ¦¬μ΄ˆκ°€ 없을 것이라고 λ―ΏμŠ΅λ‹ˆλ‹€. κ°’.

λ°€λ¦¬μ΄ˆκ°€ 그것과 무슨 관련이 μžˆλŠ”μ§€ μ „ν˜€ λͺ¨λ¦…λ‹ˆλ‹€. μš°λ¦¬λŠ” μ‹œκ°„λŒ€ 정보에 λŒ€ν•΄ μ΄μ•ΌκΈ°ν•˜κ³  μžˆμ—ˆμŠ΅λ‹ˆλ‹€.

λ‹€μ‹œ λ§ν•˜μ§€λ§Œ 이것은 AngularJS와 아무 관련이 μ—†μŠ΅λ‹ˆλ‹€. 이것이 κΈ°λ³Έ 제곡 개체(예: Date 및 JSON )κ°€ μ„œλ‘œ μƒν˜Έ μž‘μš©ν•˜λŠ” λ°©μ‹μž…λ‹ˆλ‹€.

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