Pylon

https://docs.usepylon.com
Admin
Pylon is the first B2B support platform designed to track customer issues across multiple channels,...
Tokens:27,278
Snippets:408
Trust Score:9.2
Update:8 months ago
Show doc for...
Tokens:
Raw
### Add Pylon Chat Widget Script to HTML

Source: https://docs.usepylon.com/pylon-docs/chat-widget/chat-setup

This script should be added to your index.html file just before the closing </body> tag. It initializes the Pylon chat widget and requires your unique APP_ID to be substituted.

```markup
<script>
(function(){var e=window;var t=document;var n=function(){n.e(arguments)};n.q=[];n.e=function(e){n.q.push(e)};e.Pylon=n;var r=function(){var e=t.createElement("script");e.setAttribute("type","text/javascript");e.setAttribute("async","true");e.setAttribute("src","https://widget.usepylon.com/widget/APP_ID");var n=t.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)};if(t.readyState==="complete"){r()}else if(e.addEventListener){e.addEventListener("load",r,false)}})();
</script>
```

--------------------------------

### Configure Pylon Chat Widget User Settings in JavaScript

Source: https://docs.usepylon.com/pylon-docs/chat-widget/chat-setup

This JavaScript code configures the Pylon chat widget with user-specific details such as email, name, and optional avatar URL or account information. It should be implemented after the user has logged in.

```js
window.pylon = {
  chat_settings: {
    app_id: "APP_ID",
    email: "USER_EMAIL",
    name: "USER_FULL_NAME",

    // (Optional) If you have the user's profile image available through something like Auth0
    avatar_url: "USER_PROFILE_IMAGE_URL",

    // (Optional) If you are using Pylon's identity verification
    email_hash: "USER_EMAIL_HASH",
    
    // (Optional) If you want to force association of an issue/contact with a certain account.
    account_id: "057a3564-fc1b-4224-9292-dcf718653452",
    
    // (Optional) If you want to force association of an issue/contact with a certain account.
    // Learn more about external IDs here: https://docs.usepylon.com/pylon-docs/developer/api/external-ids.
    account_external_id: "ab38e36b-3e28-4e2d-b976-6282735b77eb"
  },
};
```

```js
useEffect(() => {
  if (user.loggedIn) {
    window.pylon = {
      chat_settings: {
        app_id: APP_ID,
        email: user.email,
        name: user.fullName,
        avatar_url: user.profileImgUrl,
      },
    };
  }
}, [user]);
```

--------------------------------

### Snowflake Private Key Format

Source: https://docs.usepylon.com/pylon-docs/data-warehouse/snowflake

This snippet shows the expected format for an unencrypted RSA private key when providing it to Pylon for Snowflake authentication. Ensure the key includes the BEGIN and END PRIVATE KEY markers and the key contents in between.

```plaintext
-----BEGIN PRIVATE KEY-----
<Key Contents>
-----END PRIVATE KEY-----
```

--------------------------------

### Pre-populate Editor Messages with Pylon

Source: https://docs.usepylon.com/pylon-docs/chat-widget/javascript-api

The `showNewMessage` function pre-populates the chat widget's editor with a given message. This is useful for guiding users or providing context, especially when errors occur. The message can optionally be HTML, but only specific tags (`<a>`, `<b>`, `<p>`, `<i>`) are supported.

```javascript
window.Pylon("showNewMessage", "I'm experiencing an issue with syncing from Google Sheets to Email and could use some assistance");
```

```javascript
window.Pylon("showNewMessage", "I'm experiencing an issue with <a href='https://www.app.company.com/sync/123'>syncing</a> from Google Sheets to Email and could use some assistance", { isHtml: true});
```

--------------------------------

### Content Security Policy for Pylon Chat

Source: https://docs.usepylon.com/pylon-docs/chat-widget/chat-setup

This Content Security Policy (CSP) configuration is necessary if you have a CSP implemented on your site. It specifies the trusted sources for various types of content, including connections, scripts, fonts, styles, and images, to ensure secure loading of Pylon resources.

```text
Content-Security-Policy: 
    connect-src 'self' https://*.usepylon.com wss://*.pusher.com;
    script-src 'self' https://widget.usepylon.com;
    font-src 'self' https://*.usepylon.com;
    style-src 'self' https://*.usepylon.com;
    img-src 'self' https://*.usepylon.com https://pylon-avatars.s3.us-west-1.amazonaws.com https://d3vl36l12sfx26.cloudfront.net;
```

--------------------------------

### showKnowledgeBaseArticle

Source: https://docs.usepylon.com/pylon-docs/chat-widget/javascript-api

Navigates the chat bubble to display a specific knowledge base article, identified by its article ID.

```APIDOC
## `window.Pylon("showKnowledgeBaseArticle", "string")`

### Description
Navigates the chat bubble to a specified knowledge base article, by article ID.

### Method
`window.Pylon(methodName, articleId)`

### Parameters
#### Arguments
- **methodName** (string) - Must be "showKnowledgeBaseArticle".
- **articleId** (string) - The ID of the knowledge base article to display.

### Request Example
```javascript
window.Pylon("showKnowledgeBaseArticle", "123456789");
```

### Response
This method does not return a value.
```

--------------------------------

### Display Knowledge Base Article with Pylon

Source: https://docs.usepylon.com/pylon-docs/chat-widget/javascript-api

The `showKnowledgeBaseArticle` function allows you to direct the chat bubble to a specific knowledge base article. You need to provide the article's unique ID as an argument. The article ID can be found in the URL or the article settings panel.

```javascript
window.Pylon("showKnowledgeBaseArticle", "123456789");
```

--------------------------------

### Manage Chat Window Events with Callbacks

Source: https://docs.usepylon.com/pylon-docs/chat-widget/javascript-api

Register callback functions for chat window events using `window.Pylon('onShow', callback)` and `window.Pylon('onHide', callback)`. Pass `null` to remove existing callbacks. These are useful for managing application state based on chat visibility.

```javascript
window.Pylon("onShow", function () {
  console.log("Chat window shown!");
});

window.Pylon("onHide", function () {
  console.log("Chat window hidden!");
});

// To remove a callback:
// window.Pylon("onShow", null);
// window.Pylon("onHide", null);
```

--------------------------------

### showNewMessage

Source: https://docs.usepylon.com/pylon-docs/chat-widget/javascript-api

Prepopulates the message editor in the Chat Widget with a given string. Supports plain text and optionally HTML content with specific tag limitations.

```APIDOC
## `window.Pylon("showNewMessage", "string")`

### Description
Pass in a message to prepopulate in the editor. For example, use this when a user runs into an error in your application and you want to prefill a message they can submit.

Optionally, this string can also be HTML. For example, for rendering a link. Pass an optional argument indicating the message to be shown is HTML.

**Note:** Only specific HTML tags are supported: `<a>`, `<b>`, `<p>`, and `<i>`. If other tags are used, the editor may error.

### Method
`window.Pylon(methodName, message, options)`

### Parameters
#### Arguments
- **methodName** (string) - Must be "showNewMessage".
- **message** (string) - The message content to display in the editor. Can include limited HTML tags.
- **options** (object, optional) - An object that can contain an `isHtml` property.
  - **isHtml** (boolean, optional) - If true, the message string will be interpreted as HTML. Defaults to false.

### Request Example
```javascript
// Plain text message
window.Pylon("showNewMessage", "I'm experiencing an issue with syncing from Google Sheets to Email and could use some assistance");

// HTML message
window.Pylon("showNewMessage", "I'm experiencing an issue with <a href='https://www.app.company.com/sync/123'>syncing</a> from Google Sheets to Email and could use some assistance", { isHtml: true});
```

### Response
This method does not return a value.
```

--------------------------------

### Control Chat Window Visibility with JavaScript

Source: https://docs.usepylon.com/pylon-docs/chat-widget/javascript-api

Use `window.Pylon('show')` to open the chat window and `window.Pylon('hide')` to close it. These functions are useful for triggering the chat from specific user interactions or support flows.

```javascript
window.Pylon("show");
window.Pylon("hide");
```

--------------------------------

### Generate HMAC-SHA256 Hash for Identity Verification

Source: https://docs.usepylon.com/pylon-docs/chat-widget/identity-verification

This snippet demonstrates how to generate an HMAC-SHA256 hash for user email addresses using a secret key. This is crucial for verifying user identities in the chat widget and preventing impersonation. Ensure the secret key is kept secure and is properly decoded from hex before use.

```JavaScript (Node.js)
const { createHmac } = require("node:crypto");

const secret = "GENERATED_IDENTITY_SECRET";
const email = "CHAT_USER_EMAIL";

const secretBytes = Buffer.from(secret, "hex");
const verificationHash = createHmac("sha256", secretBytes)
  .update(email)
  .digest("hex");
```

```Python
import hmac
import hashlib

def sign_message_with_hmac(message, secret):
    secret_bytes = bytes.fromhex(secret)
    signature = hmac.new(secret_bytes, message.encode(), hashlib.sha256).hexdigest()
    return signature
```

```Go
package auth

import (
	"crypto/hmac"
	"crypto/sha256"
	"encoding/hex"
)

func SignMessageWithHMAC(message, secret string) (*string, error) {
	secretBytes, err := hex.DecodeString(secret)
	if err != nil {
		return nil, errors.New("unable to decode secret")
	}

	h := hmac.New(sha256.New, secretBytes)
	h.Write([]byte(message))
	signature := h.Sum(nil)

	signedMsg := hex.EncodeToString(signature)

	return &signedMsg, nil
}
```

--------------------------------

### Set Email Hash on Window Object

Source: https://docs.usepylon.com/pylon-docs/chat-widget/identity-verification

This JavaScript snippet shows how to set the generated HMAC hash onto the window object. This hash is then used by the Pylon chat widget to verify the user's identity on the frontend.

```javascript
window.pylon.chat_settings.email_hash = HMAC_HASH
```
Tokens:
Raw