0. Introduction à l'architecture
Simulez des flux en temps réel en ligne, tels que les journaux des opérations utilisateur. Après avoir collecté des données, traitez-les. Pour le moment, ne considérez que la collecte de données et utilisez-les Html+Jquery+Nginx+Ngx_kafka_module+Kafka
pour la réaliser. Parmi eux, Ngx_kafka_module est un Kafka
composant open source spécifiquement utilisé pour s'interfacer avec Nginx .
1. Description des exigences
1.1 Utiliser html
et jquery
simuler les journaux des demandes des utilisateurs
Y compris les éléments suivants:
ID utilisateur: user_id, temps d'accès: act_time, operation: (action, y compris clic, job_collect, cv_send, cv_upload)
Code entreprise job_code
1.2 Utilisez Nginx pour accepter les demandes en 1.1
1.3 Après avoir reçu la requête, utilisez ngx_kafka_module pour envoyer les données au sujet tp_individual de Kafka.
1.4 Utiliser un consommateur pour consommer le sujet dans Kafka, observer
2. Étapes de construction
2.1 Kafka
Comme l' image docker-kafka installée prête à l'emploi est utilisée, elle peut être démarrée directement.
2.2 Installez Nginx et démarrez
$ cd /usr/local/src
$ git clone [email protected]:edenhill/librdkafka.git
# 进入到librdkafka,然后进行编译
$ cd librdkafka
$ yum install -y gcc gcc-c++ pcre-devel zlib-devel
$ ./configure
$ make && make install
$ yum -y install make zlib-devel gcc-c++ libtool openssl openssl-devel
$ cd /opt/hoult/software
# 1.下载
$ wget http://nginx.org/download/nginx-1.18.0.tar.gz
# 2.解压
$ tar -zxf nginx-1.18.0.tar.gz -C /opt/hoult/servers
# 3. 下载模块源码
$ cd /opt/hoult/software
$ git clone [email protected]:brg-liuwei/ngx_kafka_module.git
# 4. 编译
$ cd /opt/hoult/servers/nginx-1.18.0
$ ./configure --add-module=/opt/hoult/software/ngx_kafka_module/
$ make && make install
# 5.删除Nginx安装包
$ rm /opt/hoult/software/nginx-1.18.0.tar.gz
# 6.启动nginx
$ cd /opt/hoult/servers/nginx-1.18.0
$ nginx
3. Configuration associée
3.1 Configuration de nginx nginx.conf
#pid logs/nginx.pid;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
# '$status $body_bytes_sent "$http_referer" '
# '"$http_user_agent" "$http_x_forwarded_for"';
#access_log logs/access.log main;
sendfile on;
#tcp_nopush on;
#keepalive_timeout 0;
keepalive_timeout 65;
#gzip on;
kafka;
kafka_broker_list linux121:9092;
server {
listen 9090;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
#------------kafka相关配置开始------------
location = /kafka/log {
#跨域相关配置
add_header 'Access-Control-Allow-Origin' $http_origin;
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
kafka_topic tp_individual;
}
#error_page 404 /404.html;
}
}
3.2 Démarrer le producteur et le consommateur de Kafka
# 创建topic
kafka-topics.sh --zookeeper linux121:2181/myKafka --create --topic tp_individual --partitions 1 --replication-factor 1
# 创建消费者
kafka-console-consumer.sh --bootstrap-server linux121:9092 --topic tp_individual --from-beginning
# 创建生产者测试
kafka-console-producer.sh --broker-list linux121:9092 --topic tp_individual
3.3 Ecrire du code Html + Jquery
<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1,shrink-to-fit=no">
<title>index</title>
<!-- jquery cdn, 可换其他 -->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.js"></script>
</head>
<body>
<input id="click" type="button" value="点击" οnclick="operate('click')" />
<input id="collect" type="button" value="收藏" οnclick="operate('job_collect')" />
<input id="send" type="button" value="投简历" οnclick="operate('cv_send')" />
<input id="upload" type="button" value="上传简历" οnclick="operate('cv_upload')" />
</body>
<script>
function operate(action) {
var json = {'user_id': 'u_donald', 'act_time': current().toString(), 'action': action, 'job_code': 'donald'};
$.ajax({
url:"http://192.168.18.128:9090/kafka/log",
type:"POST" ,
crossDomain: true,
data: JSON.stringify(json),
// 下面这句话允许跨域的cookie访问
xhrFields: {
withCredentials: true
},
success:function (data, status, xhr) {
// console.log("操作成功:'" + action)
},
error:function (err) {
// console.log(err.responseText);
}
});
};
function current() {
var d = new Date(),
str = '';
str += d.getFullYear() + '-';
str += d.getMonth() + 1 + '-';
str += d.getDate() + ' ';
str += d.getHours() + ':';
str += d.getMinutes() + ':';
str += d.getSeconds();
return str;
}
</script>
</html>
Sera a.html
placé dans le répertoire nginx, le navigateur visite 192.168.18.128:9090
4. Démo
4.1 Commencez par démarrer le cluster zk, cluster kafka
4.2 Puis créer un sujet, créer un consommateur, créer un producteur, un sujet de test
4.3 Démarrez nginx pour visiter la page, cliquez pour observer le statut du consommateur
L'ensemble du processus est le suivant:
Wu Xie, Xiao San Ye, un petit rookie en arrière-plan, big data et intelligence artificielle.
Veuillez prêter attention à plus