ํ์ฌ Angular 7, apollo-rest link 0.7.3 ์ฌ์ฉ
๋ง์นจ๋ด ๋์ฐ๋ณ์ด๊ฐ ๋ถ๋ถ์ ์ผ๋ก ์๋ํ๊ณ global
๊ฐ ์ด๊ธฐํ๋์ง ์๊ณ ์ด ์ค๋ฅ๊ฐ ๋ฐ์ํ๋ ํ ๊ฐ์ง ๋ฌธ์ ๊ฐ ์์ต๋๋ค.
core.js:15724 ERROR Error: Network error: global is not defined
at new ApolloError (bundle.esm.js:60)
at Object.error (bundle.esm.js:1032)
at notifySubscription (Observable.js:134)
at onNotify (Observable.js:165)
at SubscriptionObserver.error (Observable.js:224)
at Object.error (Observable.js:463)
at notifySubscription (Observable.js:134)
at onNotify (Observable.js:165)
at SubscriptionObserver.error (Observable.js:224)
at bundle.umd.js:807
ํด๋ผ์ด์ธํธ ์ด๊ธฐํ
const restLink = new RestLink({
uri: 'http://localhost:5000/api',
credentials: 'same-origin',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json'
}
});
return {
link: restLink,
cache
};
์ด ๋์ฐ๋ณ์ด๊ฐ ์์ต๋๋ค.
export const addTodo = gql`
mutation addTodo($input: Todo!){
addTodo(input: $input) @rest( type: "Todo", method: "POST", path: "/todos" ) {
...todoFragment
}
}
${todoFragment}
`;
๋ค์๊ณผ ๊ฐ์ด ์คํํฉ๋๋ค.
add(text: string): void {
this.apollo.mutate({
mutation: addTodo,
variables: {
input: {
description: text,
completed: false
}
}
}).subscribe(({data}) => {
console.log('got data', data);
}, (error) => {
console.log('there was an error sending the query', error);
});
์ค๋ฅ๋ฅผ ์ผ์ผํค๋ ์ ์ ๊ทธ๋ฆผ์ ์๋์ ์์ต๋๋ค.
์ด global.FileList
์ ์ญ ๊ฐ์ฒด๊ฐ ์ ์๋์ง ์์ ์ด์ ๋ฅผ ์์ญ๋๊น?
// FileList/File are only available in some browser contexts
// Notably: *not available* in react-native.
if ((global.FileList && object instanceof FileList) ||
(global.File && object instanceof File)) {
// Object is a FileList or File object => no keys to convert!
return object;
}
์ด๊ฒ์ polyfills.ts์ ์ค์ ์ถ๊ฐํด์ผํ๊ธฐ ๋๋ฌธ์ ์ฒ์์๋ angular-cli ๋ฌธ์ ์ฒ๋ผ ๋ณด์ ๋๋ค.
https://github.com/angular/angular-cli/issues/8160
๊ทธ๋ฌ๋ ์ด์ ๋ํ ์๋ต์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค. globals does not exists in browser and should not be in the client-side code
?
REST LINK์ ์์ด์ผํฉ๋๊น?
์ ์๊ฒ ๋ด์ค์
๋๋ค. React-Native ๋ฐ ๊ธฐํ ํ๊ฒฝ์์ global
๊ฐ ์กด์ฌํฉ๋๊น? ๋ธ๋ผ์ฐ์ ์์ global
๊ฐ์ฒด๋ ์ฐฝ์ด๋ฏ๋ก window.global = window
์ ๊ฐ์ด ํ ์ ์์ต๋๋ค.
๋ด๊ฐ ํ ์ผ์ Angular์์ ์ ์ํ ๊ฒ๊ณผ ๊ฐ์์ง๋ง ๊ทธ๋ค์ ์ด๊ฒ์ ์ง์ฅ์ผ๋ก ๊ฐ์ฃผํฉ๋๋ค. ์ด๊ฒ์ด ๋ด๊ฐ ๋งจ ์๋์์ ํ ์ผ์ ๋๋ค.
https://github.com/fkolar/todo-rest/blob/master/src/polyfills.ts
๋๋ ์ด๊ฒ์ด ํดํน์ด๋ผ๋ ๋ฐ ๋์ํ์ง๋ง ์ฝ๋๊ฐ ๋ธ๋ผ์ฐ์ ์์ ์คํ๋์ด์ผํ๋์ง ์๋๋ฉด ๋ฐ์ ๋ค์ดํฐ๋ธ์์ ์คํ๋์ด์ผํ๋์ง ์๊ณ ์์ต๋๋ค. Apollo-link-rest๋ฅผ ์์ฑํ๋ ๋ ๋์ ๋ฐฉ๋ฒ์ ์๊ณ / ๋งํฌ ํ ์ ์๋ค๋ฉด ๋ณ๊ฒฝ์ ์ง์ํ ๊ฒ์
๋๋ค! ์ํ๊น๊ฒ๋ window
์ (๋) ๋ชจ๋ฐ์ผ์ ์กด์ฌํ์ง ์์ผ๋ฏ๋ก ์ฌ๊ธฐ์ ์ฝ๊ฐ ๊ฐํ ์์ต๋๋ค!
๋ฐฉ๊ธ์ด ๋ฌธ์ ์ ๋ถ๋ช ํ์ต๋๋ค. ์ด๋ฏธ ํด๊ฒฐ์ฑ ์ด ์์ต๋๊น?