27

I'm developing a Telegram bot, and I want to set the webhook to my domain's URL. I've already generated a self-signed certificate following the Telegram's guide. However, I'm not able to set the webhook. I've searched previous answers and found this one, but it doesn't work to me. Can anybody explain me how to upload the SSL certificate and set the webhook?

dmulter
  • 2,608
  • 3
  • 15
  • 24
Ignasi93
  • 533
  • 2
  • 5
  • 14

3 Answers3

49

Set Webhook

https://api.telegram.org/bot{my_bot_token}/setWebhook?url={url_to_send_updates_to}

For instance:

https://api.telegram.org/bot123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11/setWebhook?url=https://www.example.com

Delete Webhook

https://api.telegram.org/bot{my_bot_token}/setWebhook?url=

response:

{"ok":true,"result":true,"description":"Webhook was deleted"}

Get Webhook

https://api.telegram.org/bot{my_bot_token}/getWebhookInfo
4n70wa
  • 337
  • 4
  • 19
Mahdi Bashirpour
  • 17,147
  • 12
  • 117
  • 144
28

I created a file on my server for conveniently setting up telegram webhooks.

You can use the same file on your server.

This should be on the same server from which you wish to run the Telegram Bot

<html>

<head>
  <title>Set Webhooks</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.0/css/bulma.min.css" />
  <script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>

<body>
  <div class="container">
    <div id="app" class="section">
      <form :action="set_webhook" method="post" enctype="multipart/form-data">
        <label class="label">Enter your Token</label>
        <p class="control">
          <input class="input" type="text" v-model="token" />
        </p>
        <label class="label">Enter your Host</label>
        <p class="control">
          <input class="input" type="text" v-model="host" />
        </p>
        <label class="label">Enter your Port</label>
        <p class="control">
          <input class="input" type="text" v-model="port" />
        </p>

        <input type="hidden" name="url" v-model="bot_url">
        <label class="label">Maximum Connections?</label>
        <p class="control">
          <input class="input" type="text" name="max_connections" value="100" />
        </p>
        <br/>
        <p style="color:blue">{{ bot_url }}</p>
        <br/>
        <label class="label">Enter your Certificate</label>
        <p class="control">
          <input type="file" name="certificate" id="fileToUpload" />
        </p>
        <br/>
        <div class="control is-grouped">
          <p class="control">
            <button class="button is-primary" name="submit">Set Webhook</button>
          </p>
          <br/>
          <p class="control">
            <a :href="get_webhook_info" target="_blank" class="button is-info">Get Webhook Info</a>
          </p>
        </div>
    </div>
  </div>
  <script>
    new Vue({
      el: '#app',
      data: {
        token: 'xxx',
        port: 88,
        host: 'your-server.com',
      },
      computed: {
        get_webhook_info: function () {
          return 'https://api.telegram.org/bot' + this.token + '/getwebhookinfo'
        },
        set_webhook: function () {
          return 'https://api.telegram.org/bot' + this.token + '/setwebhook'
        },
        bot_url: function () {
          return 'https://' + this.host + ':' + this.port + '/' + this.token
        }
      }
    }

    )
  </script>
</body>

</html>
  1. Drop this file on the same server you wish to host you bots
  2. Ensure the mime-type for .pem is enabled on your webserver
  3. Browse to this page on our server
  4. Fill the form with your BOT_TOKEN and chosen PORT
  5. Upload your certificate file
  6. Submit the form

You will get a successful result:

{"ok":true,"result":true,"description":"Webhook was set"}

enter image description here

Charles Okwuagwu
  • 10,538
  • 16
  • 87
  • 157
  • 3
    It's great! Made few improvements and created a repo with live demo: https://github.com/igronus/telegramhook.tk – igronus Apr 16 '18 at 12:45
  • 1
    This page is broker if you use the vue dist (because it's using the 3.0 branch). You can use the https://unpkg.com/vue@2.6.1/dist/vue.js in order to work – Samuel Aiala Ferreira Jul 06 '22 at 22:23
0

this is the correct one

<html>

<head>
  <title>Set Webhooks</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.0/css/bulma.min.css" />
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
</head>

<body>
  <div class="container">
    <div id="app" class="section">
      <form :action="set_webhook" method="post" enctype="multipart/form-data">
        <label class="label">Enter your Token</label>
        <p class="control">
          <input class="input" type="text" v-model="token" />
        </p>
        <label class="label">Enter your Host</label>
        <p class="control">
          <input class="input" type="text" v-model="host" />
        </p>
        <label class="label">Enter your Port</label>
        <p class="control">
          <input class="input" type="text" v-model="port" />
        </p>

        <input type="hidden" name="url" v-model="bot_url">
        <label class="label">Maximum Connections?</label>
        <p class="control">
          <input class="input" type="text" name="max_connections" value="100" />
        </p>
        <br/>
        <p style="color:blue">{{ bot_url }}</p>
        <br/>
        <label class="label">Enter your Certificate</label>
        <p class="control">
          <input type="file" name="certificate" id="fileToUpload" />
        </p>
        <br/>
        <div class="control is-grouped">
          <p class="control">
            <button class="button is-primary" name="submit">Set Webhook</button>
          </p>
          <br/>
          <p class="control">
            <a :href="get_webhook_info" target="_blank" class="button is-info">Get Webhook Info</a>
          </p>
        </div>
    </div>
  </div>
  <script>
   const { createApp } = Vue

   Vue.createApp({
      el: '#app',
      data() {
      return {
         token: 'xxx',
        port: 88,
        host: 'your-server.com',
      }
     },
     
      computed: {
        get_webhook_info: function () {
          return 'https://api.telegram.org/bot' + this.token + '/getwebhookinfo'
        },
        set_webhook: function () {
          return 'https://api.telegram.org/bot' + this.token + '/setwebhook'
        },
        bot_url: function () {
          return 'https://' + this.host + ':' + this.port + '/' + this.token
        }
      }
    }

    ).mount('#app')
  </script>
</body>

</html>
user3173814
  • 197
  • 1
  • 1
  • 8
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Nov 16 '22 at 09:01