@pyrocancode/react-native-vk-auth 1.0.0 → 1.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +0 -1
- package/README.md +104 -138
- package/package.json +12 -2
package/LICENSE
CHANGED
package/README.md
CHANGED
|
@@ -1,18 +1,14 @@
|
|
|
1
1
|
# @pyrocancode/react-native-vk-auth
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
Форк библиотеки [@devsomersets/react-native-vk-auth](https://www.npmjs.com/package/@devsomersets/react-native-vk-auth) ([исходный репозиторий](https://github.com/somersets/react-native-vk-auth), автор Nikita Likhachev). Разработка ведётся в [pyrocancode/react-native-vk-auth](https://github.com/pyrocancode/react-native-vk-auth).
|
|
3
|
+
Тонкая обёртка над **VK ID SDK** для React Native: **OAuth 2.1**, нативные модули iOS и Android. Репозиторий: [pyrocancode/react-native-vk-auth](https://github.com/pyrocancode/react-native-vk-auth).
|
|
6
4
|
|
|
7
5
|
## Installation
|
|
8
6
|
|
|
9
|
-
Из npm (после публикации пакета):
|
|
10
|
-
|
|
11
7
|
```sh
|
|
12
8
|
npm install @pyrocancode/react-native-vk-auth
|
|
13
9
|
```
|
|
14
10
|
|
|
15
|
-
|
|
11
|
+
Альтернатива — установка из GitHub (конкретная ветка или коммит):
|
|
16
12
|
|
|
17
13
|
```sh
|
|
18
14
|
npm install github:pyrocancode/react-native-vk-auth
|
|
@@ -26,7 +22,7 @@ npm install github:pyrocancode/react-native-vk-auth
|
|
|
26
22
|
cd ios && pod install
|
|
27
23
|
```
|
|
28
24
|
|
|
29
|
-
Шаг 2. Поддержка URL схемы
|
|
25
|
+
Шаг 2. Поддержка URL схемы
|
|
30
26
|
Чтобы пользователь мог авторизоваться бесшовно, SDK взаимодействует с клиентом VK на устройстве пользователя. Если в клиенте есть активная сессия, пользователь увидит свои данные (имя, аватарку и телефон) в кнопках и шторке. Авторизация завершится в один клик по кнопке "Продолжить как 'username'".
|
|
31
27
|
|
|
32
28
|
Чтобы переход за авторизацией в клиент VK работал, необходимо поддержать схему URL. Для этого добавьте схему vkauthorize-silent в ключ LSApplicationQueriesSchemes в Info.plist.
|
|
@@ -88,21 +84,25 @@ cd ios && pod install
|
|
|
88
84
|
}
|
|
89
85
|
```
|
|
90
86
|
|
|
91
|
-
|
|
92
|
-
|
|
87
|
+
Подключите `Linking` из React Native и `VK` из этого пакета — в обработчике вызывайте `VK.openURL`, чтобы завершить OAuth-поток после возврата из клиента VK.
|
|
88
|
+
|
|
89
|
+
```tsx
|
|
90
|
+
import { Linking } from 'react-native';
|
|
91
|
+
import { VK } from '@pyrocancode/react-native-vk-auth';
|
|
92
|
+
|
|
93
93
|
React.useEffect(() => {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
});
|
|
94
|
+
Linking.getInitialURL()
|
|
95
|
+
.then((url) => {
|
|
96
|
+
if (url) handleOpenURL({ url });
|
|
97
|
+
})
|
|
98
|
+
.catch((err) => console.warn('getInitialURL', err));
|
|
99
|
+
|
|
100
|
+
const sub = Linking.addEventListener('url', handleOpenURL);
|
|
101
|
+
return () => sub.remove();
|
|
102
|
+
}, []);
|
|
103
103
|
|
|
104
104
|
function handleOpenURL(event: { url: string }) {
|
|
105
|
-
|
|
105
|
+
VK.openURL(event.url);
|
|
106
106
|
}
|
|
107
107
|
```
|
|
108
108
|
|
|
@@ -146,148 +146,118 @@ dependencies { }
|
|
|
146
146
|
<string name="vk_account_manager_id" translatable="false">your.package.account</string>
|
|
147
147
|
```
|
|
148
148
|
|
|
149
|
-
##
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
149
|
+
## Минимальный общий сценарий (JS)
|
|
150
|
+
|
|
151
|
+
Инициализация выполняется **один раз** при старте приложения. Используйте `VK`, `VKID` и при необходимости `VKOneTapButton` из `@pyrocancode/react-native-vk-auth`.
|
|
152
|
+
|
|
153
|
+
### 1. Инициализация
|
|
154
|
+
|
|
155
|
+
```tsx
|
|
156
|
+
import { Image } from 'react-native';
|
|
157
|
+
import { VK, VKID } from '@pyrocancode/react-native-vk-auth';
|
|
158
|
+
|
|
159
|
+
const logo = Image.resolveAssetSource(require('./assets/logo.png'));
|
|
160
|
+
|
|
161
|
+
const vkid = new VKID(
|
|
162
|
+
'Моё приложение',
|
|
163
|
+
'1.0.0',
|
|
164
|
+
logo,
|
|
165
|
+
{
|
|
166
|
+
serviceUserAgreement: 'https://example.com/terms',
|
|
167
|
+
servicePrivacyPolicy: 'https://example.com/privacy',
|
|
168
|
+
serviceSupport: null,
|
|
169
|
+
}
|
|
167
170
|
);
|
|
168
171
|
|
|
169
172
|
VK.initialize(
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
},
|
|
175
|
-
mode: VK.Mode.DEBUG,
|
|
173
|
+
{
|
|
174
|
+
credentials: {
|
|
175
|
+
clientId: 'YOUR_CLIENT_ID',
|
|
176
|
+
clientSecret: 'YOUR_CLIENT_SECRET',
|
|
176
177
|
},
|
|
177
|
-
|
|
178
|
+
mode: VK.Mode.DEBUG,
|
|
179
|
+
},
|
|
180
|
+
vkid
|
|
178
181
|
);
|
|
179
182
|
```
|
|
180
183
|
|
|
181
|
-
2.
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
ok: true,
|
|
198
|
-
accessToken: {
|
|
199
|
-
token: new VKID.Token(accessToken),
|
|
200
|
-
userID: new VKID.UserID(userId),
|
|
201
|
-
}
|
|
202
|
-
};
|
|
203
|
-
return result;
|
|
204
|
-
});
|
|
205
|
-
}
|
|
206
|
-
}
|
|
184
|
+
### 2. Подписка на авторизацию и выход
|
|
185
|
+
|
|
186
|
+
```tsx
|
|
187
|
+
vkid.setOnAuthChanged({
|
|
188
|
+
onAuthorized(payload) {
|
|
189
|
+
// OAuth 2.1: access token и идентификатор пользователя VK
|
|
190
|
+
console.log(payload.accessToken, payload.userId, payload.profile);
|
|
191
|
+
},
|
|
192
|
+
onLogout() {
|
|
193
|
+
console.log('Пользователь вышел');
|
|
194
|
+
},
|
|
195
|
+
onAuthFailed(message) {
|
|
196
|
+
console.warn(message);
|
|
197
|
+
},
|
|
198
|
+
});
|
|
199
|
+
```
|
|
207
200
|
|
|
208
|
-
|
|
209
|
-
vkid.setOnAuthChanged(new class implements VKID.AuthChangedCallback {
|
|
210
|
-
onAuth(userSession: VKID.Session.UserSession): void {
|
|
211
|
-
if (userSession instanceof VKID.Session.Authorized) {
|
|
212
|
-
// user was successfuly authorized, so show authorized flow or get user profile info
|
|
213
|
-
userSession.userProfile.then((profileInfo) => {
|
|
214
|
-
setProfileInfo("Profile info: " + profileInfo.userID.value + " " + profileInfo.firstName);
|
|
215
|
-
})
|
|
216
|
-
}
|
|
217
|
-
}
|
|
201
|
+
### 3. Кнопка One Tap или ручной старт
|
|
218
202
|
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
})
|
|
203
|
+
```tsx
|
|
204
|
+
import { Button } from 'react-native';
|
|
205
|
+
import { VKOneTapButton, VKID } from '@pyrocancode/react-native-vk-auth';
|
|
223
206
|
|
|
224
|
-
//
|
|
225
|
-
import { VKOneTapButton } from 'react-native-superappkit-pub';
|
|
207
|
+
// В разметке
|
|
226
208
|
<VKOneTapButton />
|
|
227
209
|
|
|
228
|
-
//
|
|
229
|
-
<Button title=
|
|
230
|
-
function auth() {
|
|
231
|
-
vkid.startAuth();
|
|
232
|
-
}
|
|
210
|
+
// Или кнопка «Войти через VK»
|
|
211
|
+
<Button title="Войти через VK" onPress={() => vkid.startAuth()} />
|
|
233
212
|
|
|
234
|
-
//
|
|
213
|
+
// Принудительно закрыть экран авторизации
|
|
235
214
|
function forceCloseAuth() {
|
|
236
|
-
|
|
215
|
+
vkid.closeAuth();
|
|
237
216
|
}
|
|
238
217
|
|
|
239
|
-
// Logout
|
|
240
218
|
function logout() {
|
|
241
|
-
|
|
219
|
+
vkid.logout();
|
|
242
220
|
}
|
|
243
221
|
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
let isLoggedIn = sessions.some((session) => session instanceof VKID.UserSession.Authorized)
|
|
222
|
+
async function checkLoggedIn() {
|
|
223
|
+
const sessions = await vkid.userSessions();
|
|
224
|
+
return sessions.some((s) => s instanceof VKID.Session.Authorized);
|
|
248
225
|
}
|
|
249
226
|
```
|
|
250
227
|
|
|
251
|
-
### One Tap
|
|
252
|
-
|
|
253
|
-
|
|
228
|
+
### Кастомизация One Tap
|
|
229
|
+
|
|
230
|
+
```tsx
|
|
231
|
+
import { VKOneTapButton, VKOneTapButtonSpace } from '@pyrocancode/react-native-vk-auth';
|
|
232
|
+
|
|
254
233
|
<VKOneTapButton
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
actionText: 'Login as {firstName} {lastName}', /* {firstName} and {lastName} are templates that will be replaced by real user names */
|
|
277
|
-
phoneText: 'With phone {phone}', /* {phone} is a template that will be replaced by user phone */
|
|
278
|
-
}}
|
|
279
|
-
oneLineTextSize={ 16 }
|
|
280
|
-
firstLineTextSize={ 16 }
|
|
281
|
-
secondLineTextSize={ 14 }
|
|
282
|
-
avatarSize={ 64 }
|
|
283
|
-
iconSize={ 64 }
|
|
284
|
-
progressSize={ 56 }
|
|
234
|
+
style={styles.vkView}
|
|
235
|
+
backgroundStyle={{
|
|
236
|
+
style: VKOneTapButtonSpace.BgColor.CUSTOM,
|
|
237
|
+
customVkIconColor: '#fff',
|
|
238
|
+
customBackgroundColor: '#0077FF',
|
|
239
|
+
customTextColor: '#fff',
|
|
240
|
+
}}
|
|
241
|
+
iconGravity={VKOneTapButtonSpace.IconGravity.START}
|
|
242
|
+
firstLineFieldType={VKOneTapButtonSpace.LineFieldType.ACTION}
|
|
243
|
+
secondLineFieldType={VKOneTapButtonSpace.LineFieldType.PHONE}
|
|
244
|
+
texts={{
|
|
245
|
+
noUserText: 'Войти через VK',
|
|
246
|
+
actionText: 'Продолжить как {firstName} {lastName}',
|
|
247
|
+
phoneText: 'Телефон {phone}',
|
|
248
|
+
}}
|
|
249
|
+
oneLineTextSize={16}
|
|
250
|
+
firstLineTextSize={16}
|
|
251
|
+
secondLineTextSize={14}
|
|
252
|
+
avatarSize={64}
|
|
253
|
+
iconSize={64}
|
|
254
|
+
progressSize={56}
|
|
285
255
|
/>
|
|
286
256
|
```
|
|
287
257
|
|
|
288
258
|
## Usage
|
|
289
259
|
|
|
290
|
-
|
|
260
|
+
После настройки iOS/Android (см. выше) используйте API из раздела «Минимальный общий сценарий»: `VK.initialize`, `vkid.setOnAuthChanged`, `vkid.startAuth` / `VKOneTapButton`, `VK.openURL` для deep link.
|
|
291
261
|
|
|
292
262
|
## Contributing
|
|
293
263
|
|
|
@@ -295,8 +265,4 @@ See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the
|
|
|
295
265
|
|
|
296
266
|
## License
|
|
297
267
|
|
|
298
|
-
[MIT](LICENSE).
|
|
299
|
-
|
|
300
|
-
---
|
|
301
|
-
|
|
302
|
-
Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
|
|
268
|
+
[MIT](LICENSE). См. полный текст в файле `LICENSE`.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pyrocancode/react-native-vk-auth",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "Тонкая обёртка над VK ID SDK для React Native: OAuth 2.1, нативные модули iOS и Android.",
|
|
5
5
|
"main": "src/index.tsx",
|
|
6
6
|
"module": "src/index.tsx",
|
|
@@ -28,6 +28,16 @@
|
|
|
28
28
|
],
|
|
29
29
|
"keywords": [
|
|
30
30
|
"react-native",
|
|
31
|
+
"react-native-vk-auth",
|
|
32
|
+
"vk",
|
|
33
|
+
"vk-auth",
|
|
34
|
+
"vk-id",
|
|
35
|
+
"vkid",
|
|
36
|
+
"vkontakte",
|
|
37
|
+
"oauth",
|
|
38
|
+
"oauth2",
|
|
39
|
+
"authentication",
|
|
40
|
+
"login",
|
|
31
41
|
"ios",
|
|
32
42
|
"android"
|
|
33
43
|
],
|
|
@@ -35,7 +45,7 @@
|
|
|
35
45
|
"type": "git",
|
|
36
46
|
"url": "https://github.com/pyrocancode/react-native-vk-auth.git"
|
|
37
47
|
},
|
|
38
|
-
"author": "
|
|
48
|
+
"author": "Maksim Kulakov <fya-07@list.ru>",
|
|
39
49
|
"contributors": [
|
|
40
50
|
"pyrocancode (https://github.com/pyrocancode)"
|
|
41
51
|
],
|