Share your wildest ChatGPT conversations with one click.

Introduction

ShareGPT is an open-source Chrome Extension for you to share your wildest ChatGPT conversations with one click. Imagine capturing the most entertaining or insightful poster sessions with your AI companion and effortlessly sharing them with the world. With ShareGPT, that dream becomes a reality!

Features

• Share your ChatGPT conversations with one-click
• Browse examples on sharegpt.com/explore
• Save your favorite conversations for later
• Leave comments on conversations

Tech Stack

ShareGPT is built with the following stack:

• Next.js – framework
• Typescript – language
• Tailwind – CSS
• Upstash – redis
• Planetscale – database
• NextAuth.js – auth
• Vercel – hosting

REST API

The ShareGPT API is a REST-styled API that allows you to write and read conversations from our database, exposed as HTTP endpoints.

Conversations Endpoint

POST: sharegpt.com/api/conversations

You can use this endpoint to add new conversations to our database.

Details Summary

First, if you haven’t already, process the ShareGPT conversation using the following code:

function conversationData() {
  const threadContainer = document.querySelector(
    '#__next main div:nth-of-type(1) div:nth-of-type(1) div:nth-of-type(1) div:nth-of-type(1)'
  );
  var result = {
    avatarUrl: getAvatarImage(),
    items: [],
  };
  for (const node of threadContainer.children) {
    const markdownContent = node.querySelector('.markdown');
    // tailwind class indicates human or gpt
    if ([...node.classList].includes('dark:bg-gray-800')) {
      result.items.push({
        from: 'human',
        value: node.textContent,
      });
    } else if ([...node.classList].includes('bg-gray-50')) {
      result.items.push({
        from: 'gpt',
        value: markdownContent.outerHTML,
      });
    }
  }
  return result;
}

function getAvatarImage() {
  // Create a canvas element
  const canvas = document.createElement('canvas');
  const image = document.querySelectorAll('img')[1];
  // Set the canvas size to 30x30 pixels
  canvas.width = 30;
  canvas.height = 30;
  // Draw the img onto the canvas
  canvas.getContext('2d').drawImage(image, 0, 0);
  // Convert the canvas to a base64 string as a JPEG image
  const base64 = canvas.toDataURL('image/jpeg');
  return base64;
}

Think of this code as a treasure map for finding and preserving the bounty that results from your interactions with ChatGPT. The `conversationData` function acts like a skilled explorer, navigating the tangled terrain of HTML to collect valuable information about your conversation. It identifies the speaker—be it the human or AI—much like deciphering ancient hieroglyphs, all while the `getAvatarImage` function converts images into a form that can be packaged and preserved for your future reference.

Next Steps

Then, send a POST request to the endpoint above with the payload and request headers:

const res = await fetch('https://sharegpt.com/api/conversations', {
  body: JSON.stringify(conversationData),
  headers: {
    'Content-Type': 'application/json',
  },
  method: 'POST',
});

This will return an object with an id attribute which will be the unique identifier for the generated post:

const id = await res.json();
const url = `https://shareg.pt/${id}`; // short link to the ShareGPT post

GET: sharegpt.com/api/conversations

PLEASE NOTE: This endpoint is currently disabled due to excess traffic.

This endpoint takes 3 optional query parameters:

• type: Used for sorting the results. Takes 2 string values: new or top.
• page: Used for pagination. Takes an integer as a factor of the PAGINATION_LIMIT, which is set to 50.
• search: Used for filtering records by title. E.g. search=python returns all records with “python” in the title.

Example:

await fetch(
  'https://sharegpt.com/api/conversations?type=new&page=2&search=python'
);

This returns a list of conversations with the following structure:

interface ConversationMeta {
  id: string; // unique id for the conversation
  title: string; // title of the conversation (first user prompt)
  avatar: string; // base64 encoded URI of the user's avatar
  saves: number; // number of times the conversation is saved on ShareGPT
  comments: number; // number of comments the conversation has on ShareGPT
  views: number; // number of times the conversation has been viewed on ShareGPT
  createdAt: Date; // timestamp when the conversation was created
}

Troubleshooting

If you encounter any issues while using ShareGPT, here are a few troubleshooting ideas:

• Ensure that you are using the latest version of the ShareGPT Chrome Extension.
• Check your internet connection as unstable networks can affect the sharing functionality.
• Make sure that your conversations conform to the system’s requirements (such as text format).
• If the API returns errors, check the console for any error messages that can guide you to a solution.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.