Введение в API Вконтакте

Главная » Видеоуроки » JavaScript » Введение в API Вконтакте
В ближайшие 2-3 урока мы рассмотрим основные базовые возможности api ВКонтакте, используя полученные знания об ajax. В этом уроке мы рассмотрим создание приложения для работы в api Вконтакте, а также установим несколько виджетов ВКонтакте для сайтов
API ВКонтакте доступно по адресу https://vk.com/dev.
Вам надо выбрать раздел Web. Далее вам нужно создать приложение в разделе Мои приложения.
После создания приложения мы установим несколько виджетов на наш сайт из соответствующего раздела https://vk.com/dev/widgets_for_sites.
Виджеты устанавливаются очень легко — вам достаточно скопировать готовый код, при необходимости установив некоторые базовые настройки, и виджет станет доступным для использования.
Особое внимание обратите внимание на виджет авторизации через ВК — https://vk.com/dev/Login.
В уроке рассмотрен простой пример, но советую подробно изучить документацию к данному виджету.
Код урока (виджеты)
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <script src="https://vk.com/js/api/openapi.js?146" type="text/javascript"></script>
        <script type="text/javascript" src="https://vk.com/js/api/share.js?95" charset="windows-1251"></script>
    </head>
    <body>


        <script type="text/javascript">
            VK.init({apiId: 6141213});
        </script>


<!-- Put this div tag to the place, where Auth block will be -->
<div id="vk_auth"></div>
<script type="text/javascript">
VK.Widgets.Auth("vk_auth", {authUrl: '/hello.php'});
</script>


<!-- Put this div tag to the place, where the Comments block will be -->
<div id="vk_comments"></div>
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, attach: "*"});
</script>

<!-- VK Widget -->
<div id="vk_community_messages"></div>
<script type="text/javascript">
VK.Widgets.CommunityMessages("vk_community_messages", 85705787, {expanded: "1",tooltipButtonText: "Есть вопрос?"});
</script>

<!-- Put this script tag to the place, where the Share button will be -->
<script type="text/javascript"><!--
document.write(VK.Share.button(false,{type: "round", text: "Сохранить"}));
--></script>

<!-- Put this div tag to the place, where the Like block will be -->
<div id="vk_like"></div>
<script type="text/javascript">
VK.Widgets.Like("vk_like", {type: "button"});
</script>

    </body>
</html>
Код урока (авторизация через api ВКонтакте)
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>

    <?php
        $hash = $_GET['hash'];

        if($hash == md5('614121390759251MXvRdponYG8lktKIhh9I')) { ?>
            <h1>Hello</h1>
        <?php } else { ?>
            <h1>Ошибка входа</h1>
        <?php } ?>



            


    </body>
</html>

0 Комментариев

Оставить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Подписаться на рассылку

Будьте в курсе - получайте последние статьи на свой email

Ваша подписка успешно оформлена

Pin It on Pinterest

Share This