[Powerful] D3.js visualizes the number of SSH brute force attacks

[Powerful] D3.js visualizes the number of SSH brute force attacks

This blog post is from 51CTO blogger Lao Xu_kevin. If you have any questions, please go to the blogger's page for interactive discussion!

Blog address: http://laoxu.blog..com/4120547/1618400

A server for mobile app applications is on a cloud. I am curious how many times it will be brute-force hacked every day if the ssh port is not changed. With this question in mind, check the log in /var/log/messages and grep for the number of log records containing "Failed". . .

Since the messages log will be logrotated, so:

  1.  grep "^Mar 1" / var /log/messages* | grep "Failed" | wc -l

The number of brute force cracking attempts from the 1st to the 7th of this month are:

  1.  2015-03-07,4126
  2.  2015-03-06,33499
  3.  2015-03-05,80096
  4.  2015-03-04,70208
  5.  2015-03-03,79273
  6.  2015-03-02,40995
  7.  2015-03-01,11845

Except for the relatively quiet day on the 7th, the average number of hacks was 50,000 to 60,000 per day. It seems that hackers are very busy every day.

Although the data is relatively small, it looks rather dull and there is no trend. To visualize the data, let’s use d3.js. Here is the code...

The d3 library file can be obtained directly from github.

index.html

  1.  <!DOCTYPE html >    
  2.  < html   lang = "en" >    
  3.      < head >    
  4.          < meta   charset = "utf-8" >    
  5.          < link   rel = "stylesheet"   href = "css/style.css"   media = "screen"   type = "text/css"   />    
  6.          < title > SSH blasting times </ title >    
  7.      </ head >    
  8.      < body >    
  9.          < center > < div   id = "container" > </ div > </ center >    
  10.          < script   type = "text/javascript"   src = "js/d3.v3.js" > </ script >    
  11.          < script   type = "text/javascript"   src = "js/index.js" > </ script >    
  12.      </ body >    
  13.  </ html >  

style.css

  1.  #container {
  2.  background : #eee ; //background color of the container
  3.  width : 600px ;
  4.  height : 270px ;
  5.  } 
  6.     
  7.  body { font : 12px   Arial ;} 
  8.     
  9.  path {
  10.  stroke: mediumturquoise; //The color of the curve can be debugged in the Chrome console using stroke TAB
  11.  stroke- width : 2 ;
  12.  fill: none ;
  13.  } 
  14.     
  15.  .axis path,
  16.  .axis line {
  17.  fill: none ;
  18.  stroke: gray ;
  19.  stroke -width : 1 ;
  20.     shape-rendering: crispEdges;
  21.  }

data.csv

  1.  date,close
  2.  2015-03-07,4126
  3.  2015-03-06,33499
  4.  2015-03-05,80096
  5.  2015-03-04,70208
  6.  2015-03-03,79273
  7.  2015-03-02,40995
  8.  2015-03-01,11845

index.js

  1.  var margin = {top: 30, right: 30, bottom: 50, left: 80},
  2.     width = 600 - margin.left - margin.right,
  3.     height = 270 - margin.top - margin.bottom; 
  4.     
  5.  var parseDate = d3.time.format( "%Y-%m-%d" ).parse; 
  6.     
  7.  var x = d3.time.scale().range([0, width]); 
  8.     
  9.  var y = d3.scale.linear().range([height, 0]); 
  10.     
  11.  var xAxis = d3.svg.axis().scale(x)
  12.     .orient( "bottom" ).ticks(7)
  13.     .tickFormat(d3.time.format( "%b/%d" )); 
  14.     
  15.  var yAxis = d3.svg.axis().scale(y)
  16.     .orient( "left" ).ticks(10); 
  17.     
  18.  var valueline = d3.svg.line()
  19.     .x( function (d) { return x(d.date); })
  20.     .y( function (d) { return y(d.close); })
  21.  .interpolate( "basis" ); 
  22.     
  23.     
  24.  var svg = d3.select( "#container" )
  25.  .append( "svg" )
  26.  .attr( "width" , width + margin.left + margin.right)
  27.  .attr( "height" , height + margin.top + margin.bottom)
  28.  .append( "g" )
  29.  .attr( "transform" , "translate(" + margin.left + "," + margin.top + ")" ); 
  30.     
  31.     
  32.  // Get the data  
  33.  d3.csv( "data/data.csv" , function (error, data) {
  34.      data.forEach( function (d) {
  35.      d.date = parseDate(d.date);
  36.  d.close = +d.close;
  37.  });
  38.  // Scale the range of the data  
  39.  x.domain(d3.extent(data, function (d) { return d.date; }));
  40.  y.domain([0, d3.max(data, function (d) { return d.close; })]);
  41.  svg.append( "path" ) // Add the valueline path.  
  42.  .attr( "class" , "line" )
  43.    .attr( "d" , valueline(data)); 
  44.     
  45.  svg.append( "g" ) // Add the X Axis  
  46.    .attr( "class" , "x axis" )
  47.    .attr( "transform" , "translate(0," + height + ")" )
  48.  .call(xAxis); 
  49.     
  50.  svg.append( "text" ) // text label for the x axis  
  51.  .attr( "x" , 265 )
  52.  .attr( "y" , 238 )
  53.    .style( "text-anchor" , "middle" )
  54.  .text( "date" ); 
  55.     
  56.  svg.append( "g" ) // Add the Y Axis  
  57.    .attr( "class" , "y axis" )
  58.  .call(yAxis); 
  59.     
  60.  svg.append( "text" )
  61.    .attr( "transform" , "rotate(-90)" )
  62.    .attr( "y" ,0 - margin.left)
  63.    .attr( "x" ,0 - (height / 2))
  64.  .attr( "dy" , "1em" )
  65.    .style( "text-anchor" , "middle" )
  66.  .text( "SSH blasting times" );
  67.  });

The above is the code of a page. Visit the page to see the data visualization effect of d3.js. . .

How is the effect? ​​D3 is pretty good, right? There are many cooler effects... Keep trying...

<<:  Is Android about to be taken away?

>>:  How to learn Android development? Android information sharing

Recommend

A total of 29 online and offline private domain touchpoints have been fully sorted out!

Before formally sorting out the online and offlin...

What are the product methods to improve user retention?

Recently I saw a written test question that requi...

The M9 is a milestone for Huawei in the global automotive industry

After the Ideal L9 and other competitors were alr...

Douyin e-commerce product selection strategy, worth 10 million yuan!

Today I will share with you 80 Douyin e-commerce ...

How much is the market price for a pound of bull whip? How much does a pound of bull whip cost now?

Influenced by traditional Chinese culture, people...

A comprehensive guide to the event planning process!

Although event planning is very important, when w...

Mobile game channel cooperation model ushered in innovation, "joint operation + delivery" became the new standard

The game market has never stopped debating whethe...

A complete guide to brand growth on TikTok in 2022

Since the second half of last year, many mainstre...

International Day for Biological Diversity丨One million species are facing the threat of extinction, and this reason cannot be ignored

Climate change has always been a global concern, ...

What is Web Hosting? What are the advantages and disadvantages of shared hosting?

After the website is completed, where should it b...

A guide to traffic channels for Douyin live streaming rooms!

When it comes to Tik Tok live streaming , the mos...

Jaguar Land Rover to hire 5,000 new people to develop autonomous and electric car technologies

LONDON (Reuters) - Britain's largest carmaker...

Changsha Tea Tasting Peripheral Reliable Recommendation

Content: Changsha New Tea website appointment arr...

Now, it’s time to go high-end! The road to another breakthrough for domestic mobile phones

Just after the Spring Festival, Xiaomi mentioned ...

Deconstructing the underlying logic behind the growth of new domestic beauty brands!

In the cosmetics category, there are two phenomen...