Flutter Plugin to login via VK.com.
Easily add VK login feature in your application. User profile information included.
VK SDK version, used in plugin:
- iOS 9.0 and higher.
- Android 5.0 and newer (SDK 21). Minimum
compileSdkVersion
31.
To use this plugin:
- add
flutter_login_vk
as a dependency in your pubspec.yaml file; - create an app on VK.com
- setup android;
- setup ios;
- additional VK.com app setup;
- use plugin in application.
See documentation on VK.com for full information:
And here is instructions in Russian if it's your native language (русская версия).
Create an app on VK.com https://vk.com/editapp?act=create
- Enter "Title".
- Select Standalone app as "Platform".
- Click "Connect app".
An application will be created. Now select tab "Settings" and copy "App ID"
(referenced as [APP_ID]
in this readme).
-
Set
Package name for Android
- your package name for Android application (attributepackage
inAndroidManifest.xml
). -
Set
Main activity for Android
- your main activity class (with package). By default it would becom.yourcompany.yourapp.MainActivity
. -
To fill up
Signing certificate fingerprint for Android
you should create SHA1 fingerprint as described in the documentation (withoutSHA1:
prefix). Pay attention: you should remove all colons from the fingerprint string. Add fingerprints for debug and release certificates. Note: if your application uses Google Play App Signing than you should get certificate SHA-1 fingerprint from Google Play Console.⚠️ Important! You should add fingerprints for every build variants. E.g. if you have CI/CD which build APK for testing with it's own certificate (it may be auto generated debug certificate or some another) than you should add it's fingerprint too. -
Click "Save".
- Add your Bundle Identifier - set
App Bundle ID for iOS
(you can find it in Xcode: Runner - Target Runner - General, sectionIdentity
, fieldBundle Identifier
). - Also set
App ID for iOS
, it's youSKU
(you can find it in App Store Connect: My Apps - {Your application} - App Store - App Information, section "General Information"). Mostly often is't the same as bundle ID. - Click "Save".
Edit AndroidManifest.xml
(android/app/src/main/AndroidManifest.xml
):
- Add the
INTERNET
permission in the root of<manifest>
, if you haven't (probably you have):
<uses-permission android:name="android.permission.INTERNET" />
- Add an activity to the section
application
:
<activity android:name="com.vk.sdk.VKServiceActivity"
android:label="ServiceActivity"
android:theme="@style/VK.Transparent" />
- Add your VK application identifier to the resource file (e.g.
strings.xml
), replacing[APP_ID]
with your application id:
<resources>
<integer name="com_vk_sdk_AppId">[APP_ID]</integer>
</resources>
- Add rules
-keep class com.vk.** { *; }
in you proguard file (android/app/proguard-rules.pro
).
See full AndroidManifest.xml
in example.
Configure Info.plist
(ios/Runner/Info.plist
).
You can edit it as a text file from your IDE,
or you can open project (ios/Runner.xcworkspace
) in Xcode.
- In Xcode right-click on
Info.plist
, and chooseOpen As Source Code
. - Copy and paste the following XML snippet into the body of your file (
<dict>...</dict>
), replacing[APP_ID]
with your application id:
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>vk[APP_ID]</string>
</array>
</dict>
</array>
- Also add to
Info.plist
body (<dict>...</dict>
):
<key>LSApplicationQueriesSchemes</key>
<array>
<string>vk</string>
<string>vk-share</string>
<string>vkauthorize</string>
</array>
- Enter your VK application identifier.
<key>VKAppId</key>
<string>[APP_ID]</string>
See full Info.plist
in example.
CFBundleURLTypes
or LSApplicationQueriesSchemes
keys in your Info.plist
. If you have, you should merge their values, instead of adding a duplicate key.
If you want to use scope=nohttps
, which we strongly do not recommend, you should also add NSAppTransportSecurity
,
see the documentation.
Go to My Apps and click "Manage" on your app.
On tab "Information" you should:
- Enter "Description".
- Select a suitable "Category".
- Upload small icon "32x32 icon".
- Click "Save".
- Upload "Square banner" and "A square banner for catalog" - user can see it.
Setup other settings if you need it.
Than go to "Setting" tab and turn on application:
change "App status" from Application off
to Application on and visible to all
.
Click "Save".
First, you should create an instance of VKLogin
.
Than, before any method call or checking accessToken
you should initialize VK SDK:
final vk = VKLogin();
await vk.initSdk();
Now you can use the plugin.
Features:
- log in via VK.com;
- get access token;
- get user profile;
- get user email;
- check if logged in;
- log out.
Sample code:
import 'package:flutter_login_vk/flutter_login_vk.dart';
// Create an instance of VKLogin
final vk = VKLogin();
// Initialize
await vk.initSdk();
// Log in
final res = await vk.logIn(scope: [
VKScope.email,
VKScope.friends,
]);
// Check result
if (res.isValue) {
// There is no error, but we don't know yet
// if user logged in or not.
// You should check isCanceled
final VKLoginResult result = res.asValue!.value;
if (result.isCanceled) {
// User cancel log in
} else {
// Logged in
// Send access token to server for validation and auth
final VKAccessToken? accessToken = result.accessToken;
if (accessToken != null) {
print('Access token: ${accessToken.token}');
// Get profile data
final profileRes = await vk.getUserProfile();
final profile = profileRes.asValue?.value;
if (profile != null) {
print('Hello, ${profile.firstName}! You ID: ${profile.userId}');
}
// Get email (since we request email permissions)
final email = await vk.getUserEmail();
print('And your email is $email');
} else {
print('Something goes wrong');
}
}
} else {
// Log in failed
final errorRes = res.asError!;
print('Error while log in: ${errorRes.error}');
}
When you call initSdk()
, plugin try to restore previous session.
If token has been expired - it will be refreshed.
Also, during restoring, log in screen may be shown to user (only if user was logged in).
In additional, you can pass to initSdk()
required scope
,
and if current user session doesn't provide it - user will be
logged out.
Also you can specify API version to use, but you shouldn't.