vik

8 лет назад

Создаем собственный сайт на базе blockchain голоса за ~ 30 минут.

Попробуйте представить golos.io не как отдельный сайт, а как блоговую платформу. Причем не вида ЖЖ, Bloggera и tumblr, а масштабов и областей применения схожими с wordpress. Гибкая, универсальная и разворачиваемая за считанные минуты основа вашего сайта с готовым решением монетизации и поощрения ваших пользователей.

Если мы хотим сделать из Голоса действительно богатую экосистему, а не один сайт, который вряд ли прыгнет выше размеров Хабры, то единственная возможность для этого - привлечь разработчиков которые создадут на платформе тысячи сайтов и приложений в рунете.

@hipster в рамках поста Инициатива кибер•Фонда

Представьте "Голос" на вашем собственном домене, со своим дизайном и нишей контента.

БМ, @mapala, @siski не только представили, но уже успешно реализуют.

Вы блоггер или медийная личность?
Создайте блог с собственным доменом, с собственным дизайном, но храните записи в блокчейн, получая за них награды.
У вас новостной или региональный портал?... Форум?
Собирайте тысячи голосов за каждый пост и приумножайте аудиторию.
Интернет магазин?
Интегрируйте отзывы о продукции с блокчейн голоса и предоставляйте клиентам скидки взамен голосов.
Придумывайте собственные решения, пока не поздно :)

Воссоздание и подключения клиента golos.io на собственном домене

Временный пример http://rubtc.info

Возможности по кастомизации и настройкам ограниченны только вашими навыками

Домен и хостинг

В качестве хостинга я выбрал bithost.io - это реселлер DigitalOcean, который принимает bitcoin в качестве оплаты. Домен покупать не пришлось, есть в запасе. Но последний раз брал на crowncloud - соответственно тоже можно за bitcoin.

На слабенький VPS с 2gb ОЗУ я установил Ubuntu 16.10. К выбору предлагалась уже с собранным nodejs, но я предпочел чистую, так как на предустановленной может быть что-то лишнее и несовместимое.

Через SSH подключаемся к терминалу под root и последовательно вводим команды:

Скачиваем последнюю версию клиента
git clone https://github.com/GolosChain/tolstoy

Переходим в папку проекта (можно переименовать. Я переименовал на короткое i)
cd tolstoy ну и или в моем случае далее cd i

Создаем в папке еще одну с именем tmp
mkdir tmp

Скачиваем последний NVM. (В будущем проверяйте, какой номер версии последний)
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.0/install.sh | bash

Экспортируем и раскладываем скрипты nvm
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"

Ставим и начинаем использовать последний node js
nvm install node

nvm use node

Находясь в папке проекта i (tolstoy)
npm install

npm install -g babel-cli

npm i pm2 -g

Переходим в папку конфигов и создаем там скрипты
cd config

cp steem-example.json steem-dev.json

Выполняем команду в node
node

crypto.randomBytes(32).toString('base64')

Сохраняем ключ. Обычно он заканчивается символом =
Переходим в папку app/config и создаем там файлы
cd app/config

cp public-example.json public.json

Ставим mysql сервер БД
sudo apt-get update

sudo apt-get install mysql-server

Во время установки будет предложено создать пароль. Не забудьте его.
После установки вводим
sudo mysql -u root -p

Если у вас ubuntu от 16.10, последовательно вводим

DROP USER 'root'@'localhost';
CREATE USER 'root'@'%' IDENTIFIED BY '';
GRANT ALL PRIVILEGES ON *.* TO 'root'@'%';
FLUSH PRIVILEGES;

И заходим далее
mysql -u root

Создаем БД
create database steemit_dev; - команду нужно вводить если вы зашли в mysql и видите значок >

quit выходим из mysql.

Устанавливаем sequelize-cli
npm install -g sequelize-cli pm2 mysql

Переходим в папку bd проекта и выполняем
sequelize db:migrate

Открываем или создаем если нет конфиг командой
nano /root/tolstoy/db/config/config.json

И пишем в нем

{
  "development": {
    "username": "root",
    "password": null,
    "database": "steemit_dev",
    "host": "127.0.0.1",
    "dialect": "mysql"
  }
}

Закрываем сохраняя (ctrl-X и y)

В папке config открываем файл steem-dev.json и добавляем строку с вашим ключом.
"server_session_secret": "NzsAoTf===ВАШ==КЛЮЧ==H0d5EsgFsjQM0=",

Если есть параметр server_session_secret напротив, если нет, создайте вместе с ним и поместите после session key

Переходим в папку проекта.
cd

cd tolstoy или cd имя если переименовали.

Вводим
npm start

Видим надпись webpack-dev-server listening on port 3001

И ждем компиляции ~ 2 - 5 минут

В случае успеха вы увидите уведомления

Возможно некоторые ошибки будут, это не критично. В финале вы увидите надпись
Application started on port 3002

Это значит, что вы можете ввести в браузере ip своего сервера и в конце указать порт ..*:3002 и если все установлено верно - попадете на клон голоса на вашем сервере.
Если вы хотите, что бы доступ был без порта, а из корня, вам будет необходимо открыть файл
/root/tolstoy/server/server.js и поменять порт 3002 на 80 в конфиге

После чего запустить npm start снова, в результате ответа вы должны увидеть

Application started on port 80

Теперь можете перейти по адресу своего сервера и увидеть работающий сайт.
Или прописать A - запись в DNS своего домена указывающую на ваш сервер.

Но если вы покинете процесс в консоли - сервер остановится! Что бы запустить его в постоянном режиме введите команду:
pm2 start npm -- start - Для запуска

pm2 restart npm -- start - Для рестарта

Теперь сайт постоянно онлайн.

Поздравляем! Все работает!

Вы можете полноценно использовать клиент голоса на своем сервере или локально на компьютере. Использовать, совершенствовать, стилизовать!

Собственный CSS cтиль в формате SCSS можно добавить в файл
/app/assets/stylesheets/foundation-overrides.scss
Все паблик шаблоны и стили клиента в папке
/app/components

Так же много настроек в /root/i/config/client_config.js

И хотя все работает полноценно, вы находитесь в режиме разработчика. Что бы переключится в финальный production режим - вам необходимо ввести

npm run build
npm run prod

Однако вы получите ошибки о незаполненном CSP файле.
https://developer.mozilla.org/ru/docs/Web/HTTP/Headers/Content-Security-Policy
Файл с шаблонами настроек хранится тут:
/root/i/node_modules/helmet-csp/lib/config.json
И выглядит вот так:

{
  "directives": {
    "base-uri": { "type": "sourceList" },
    "child-src": { "type": "sourceList" },
    "connect-src": { "type": "sourceList" },
    "default-src": { "type": "sourceList" },
    "font-src": { "type": "sourceList" },
    "form-action": { "type": "sourceList" },
    "frame-ancestors": { "type": "sourceList" },
    "frame-src": { "type": "sourceList" },
    "img-src": { "type": "sourceList" },
    "manifest-src": { "type": "sourceList" },
    "media-src": { "type": "sourceList" },
    "object-src": { "type": "sourceList" },
    "script-src": {
      "type": "sourceList",
      "hasUnsafes": true
    },
    "style-src": {
      "type": "sourceList",
      "hasUnsafes": true
    },
    "plugin-types": { "type": "pluginTypes" },
    "sandbox": { "type": "sandbox" },
    "report-uri": { "type": "reportUri" },
    "upgrade-insecure-requests": { "type": "boolean" },
    "block-all-mixed-content": { "type": "boolean" }
  },
  "allHeaders": [
    "Content-Security-Policy",
    "X-Content-Security-Policy",
    "X-WebKit-CSP"
  ],
  "mustQuote": ["none", "self", "unsafe-inline", "unsafe-eval"],
  "unsafes": ["'unsafe-inline'", "unsafe-inline", "'unsafe-eval'", "unsafe-eval"],
  "sandboxDirectives": [
    "allow-forms",
    "allow-modals",
    "allow-orientation-lock",
    "allow-pointer-lock",
    "allow-popups",
    "allow-popups-to-escape-sandbox",
    "allow-presentation",
    "allow-same-origin",
    "allow-scripts",
    "allow-top-navigation"
  ]
}

Вы должны составить его в зависимости от своих настроек в т.ч. адреса сервера и CDN. Например мне нужно прописать cloudflare, так как использую его.
CSP голоса выглядят так:

default-src 'self' golos.io www.youtube.com staticxx.facebook.com ;
child-src 'self' www.youtube.com staticxx.facebook.com w.soundcloud.com player.vimeo.com chat.golos.io livejournal.com ;
script-src 'self' cyber.fund www.google-analytics.com connect.facebook.net js-agent.newrelic.com bam.nr-data.net cdn.polyfill.io cdn.segment.com cdn.mxpnl.com mc.yandex.ru chat.golos.io media.reformal.ru ;
style-src 'self' 'unsafe-inline' cdnjs.cloudflare.com fonts.googleapis.com ;
img-src data: * ;
font-src data: fonts.gstatic.com ;
connect-src 'self' cyber.fund wss://ws.golos.io wss://ws.r1.golos.io wss://ws.r2.golos.io wss://ws.r3.golos.io wss://ws.r4.golos.io wss://ws.r5.golos.io api.segment.io api.blocktrades.us query.yahooapis.com api.blockcypher.com api.mixpanel.com mc.yandex.ru ;
report-uri https://golos.io/api/v1/csp_violation ;
object-src 'self' ;
plugin-types application/pdf ;
frame-ancestors 'none'

В заключение

В основе работы клиента будет его взаимодействие с основной нодой голоса wss://ws.golos.io
Я уже посвятил несколько постов взаимодействию с нодой Подключаемся к ноде wss://ws.golos.io через блокнот , но если ранее это были очень урезанные возможности - то в описываемом клиенте они полноценны. Кроме того, при наличии запаса мощности на сервере вы можете поднять собственную ноду!

По затратам это по-сути копейки:
Около 10$ в год стоит домен
И 15-20$ в месяц сервер. (в зависимости от мощности можно дешевле, можно дороже)

107