Skip to content

Instantly share code, notes, and snippets.

@Spikeysanju
Created January 18, 2024 16:06
Show Gist options
  • Save Spikeysanju/958b0877d9b9021e6258f22bd229e2c4 to your computer and use it in GitHub Desktop.
Save Spikeysanju/958b0877d9b9021e6258f22bd229e2c4 to your computer and use it in GitHub Desktop.

API Request Documentation

This code snippet demonstrates a JavaScript fetch request that sends a PUT request to a dynamic API endpoint. Below is a concise documentation for the request:

Request Overview

  • Endpoint: The target API endpoint is https://cooptheapp.spikeysanju.workers.dev/, which seems to be hosted on Cloudflare Workers.
  • When uploading a file set filename and it's extenstion as endpoint. ex - https://cooptheapp.spikeysanju.workers.dev/sanju.png (you can give any random names but make sure to provide extension)

Request Details

  1. HTTP Method: PUT

    • The fetch function is configured to send a PUT request to the specified endpoint.
  2. Headers:

    • Content-Type: The Content-Type header is set dynamically based on the fileType variable. It indicates the media type of the file being transmitted. Examples include image/png, image/jpeg, image/gif, and video/mp4. The format of fileType is expected to be in the form of .png, .jpeg, .gif, or .mp4.
    • X-CF-Secret: This custom header, X-CF-Secret, is possibly used for authentication purposes.
  3. Request Body:

    • The body of the request is constructed using a Uint8Array converted from binary data. It appears to handle the conversion of base64-encoded data to binary. The base64 data is extracted from the file variable, removing any data URI prefix (data:image/png;base64,).
  4. Response Handling:

    • The response is logged to the console assuming it is in text format. If the response is not in text format, consider using appropriate methods to handle different content types.

Example Usage

const apiEndpoint = 'https://cooptheapp.spikeysanju.workers.dev/sanju.png';
const fileType = 'image/png'; // Replace with the actual file type. Ex file type : image/png or image/jpeg or image/gif or video/mp4
const CLOUDFLARE_SECRET = 'your-secret'; // Replace with the actual Cloudflare secret
const file = 'base64_encoded_data_here'; // Replace with the actual base64-encoded data

const response = await fetch(apiEndpoint, {
  method: 'PUT',
  headers: {
    'Content-Type': fileType,
    'X-CF-Secret': CLOUDFLARE_SECRET
  },
  body: Uint8Array.from(atob(file.replace(/^data[^,]+,/, '')), (v) => v.charCodeAt(0))
});

console.log(await response.text());

Important Notes

  • Ensure that placeholders like fileType, CLOUDFLARE_SECRET, and file are replaced with actual values.
  • Verify the API documentation for additional details on authentication, expected responses, and any specific requirements.
@Spikeysanju
Copy link
Author

@msomu please check this out!

@Spikeysanju
Copy link
Author

Once uploaded. you can use https://media.sanju.sh/sanju.png (instead of sanju.png use the name which you have given)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment