1. Crear una cuenta en Cloudinary
Si aún no tienes una cuenta en Cloudinary, ve a cloudinary.com y crea una cuenta gratuita.
2. Obtener tus credenciales de API
Una vez que te registres, ve a tu panel de control y busca las credenciales de la API. Necesitarás el Cloud Name, API Key y API Secret para poder interactuar con la API de Cloudinary.
3. Subir el archivo MP3 usando JavaScript
Puedes usar JavaScript para hacer la carga de archivos MP3 a Cloudinary. Aquí te mostramos un ejemplo básico:
Pasos:
- Incluir la biblioteca de Cloudinary en tu archivo HTML:
- Escribir el código para subir el archivo:
<script src="https://upload.widget.cloudinary.com/global/all.js"></script>Ejemplo de código:
// Inicializa Cloudinary
cloudinary.setCloudName('TU_CLOUD_NAME');
// Configura el widget de subida
const widget = cloudinary.createUploadWidget({
cloudName: 'TU_CLOUD_NAME',
uploadPreset: 'TU_UPLOAD_PRESET', // Este preset lo puedes crear en el panel de Cloudinary
resourceType: 'auto' // Esto permite subir imágenes, videos o audios automáticamente
}, (error, result) => {
if (!error && result && result.event === "success") {
console.log("Archivo subido con éxito: ", result.info.secure_url);
alert("¡El archivo ha sido subido exitosamente!");
}
});
// Activar el widget al hacer clic en el botón
document.getElementById("upload_button").addEventListener("click", function() {
widget.open();
});
Este código abrirá un widget en el que puedes seleccionar tu archivo MP3. Al subirlo, Cloudinary te proporcionará la URL segura del archivo.
4. Verificar el archivo subido
Una vez que el archivo se haya subido correctamente, podrás acceder a él usando la URL que Cloudinary te proporcionará. El archivo estará disponible para ser utilizado en tus proyectos web.
5. Usar el archivo MP3 en tu sitio web
Una vez que el archivo esté en Cloudinary, puedes incrustarlo en tu página web usando una etiqueta de audio HTML, como se muestra a continuación:
<audio controls>
<source src="URL_DEL_ARCHIVO_MP3">
Tu navegador no soporta el elemento de audio.
</audio>
¡Ya has subido tu archivo MP3 a Cloudinary! Si tienes alguna duda, visita la documentación oficial.
