当人们在我的网站上打开开发工具时，如何使自定义消息出现在控制台部分？

Question

I recently opened dev tools on Reddit.com and Facebook.com and both of them have custom messages displayed to developers who open the console on their site. Reddit has an ad that recruits developers and facebook has a warning in the console section warning people not to paste in code that could result in their account getting hijacked.

How can I achieve something like this? Is this a part of the Header or footer in HTML?

Answer 1

If you look at the source of Reddit in the dev tools you will find a line that looks like this:

        console.log("\n                  ,d\"=≥,.,qOp,\n                 ,7'  ''²$(  )\n                ,7'      '?q$7'\n             ..,$$,.\n   ,.  .,,--***²\"\"²***--,,.  .,\n ²   ,p²''              ''²q,   ²\n:  ,7'                      '7,  :\n ' $      ,db,      ,db,      $ '\n  '$      ²$$²      ²$$²      $'    Using Reddit at work? Work for Reddit.\n  '$                          $'        https://www.reddit.com/jobs\n   '$.     .,        ,.     .$'\n    'b,     '²«»«»«»²'     ,d'\n     '²?bn,,          ,,nd?²'\n       ,7$ ''²²²²²²²²'' $7,\n     ,² ²$              $² ²,\n     $  :$              $:  $\n     $   $              $   $\n     'b  q:            :p  d'\n      '²«?$.          .$?»²'\n         'b            d'\n       ,²²'?,.      .,?'²²,\n      ²==--≥²²==--==²²≤--==²\n")

It's just a console.log() statement. You can open the snippet below and try it yourself:

 console.log("\\n ,d\\"=≥,.,qOp,\\n ,7' ''²$( )\\n ,7' '?q$7'\\n ..,$$,.\\n ,. .,,--***²\\"\\"²***--,,. .,\\n ² ,p²'' ''²q, ²\\n: ,7' '7, :\\n ' $ ,db, ,db, $ '\\n '$ ²$$² ²$$² $' Using Reddit at work? Work for Reddit.\\n '$ $' https://www.reddit.com/jobs\\n '$. ., ,. .$'\\n 'b, '²«»«»«»²' ,d'\\n '²?bn,, ,,nd?²'\\n ,7$ ''²²²²²²²²'' $7,\\n ,² ²$ $² ²,\\n $ :$ $: $\\n $ $ $ $\\n 'bq: :p d'\\n '²«?$. .$?»²'\\n 'b d'\\n ,²²'?,. .,?'²²,\\n ²==--≥²²==--==²²≤--==²\\n") 

You can get color in the browser's console with code like (it won't work in a SO snippet, but if you copy/paste into the browser console it will):

console.log('%c This is reversed! ', 'background: #ee11cc; color: #eee');

You can find the code for the ad by searching in the source as well.

Answer 2

You can write to the console with the console.log() command.

https://www.w3schools.com/js/js_output.asp