porfidev/uploadFormFiles.html

## uploadFormFiles.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Upload FORM FILES</title>
</head>
<body>

<form id="uploadFileForm">
  <fieldset>
    <legend>Archivos para cargar</legend>
    <input type="file" accept="image/jpeg" name="imageToUpload">
  </fieldset>
  <br/>
  <button>Cargar Imagen</button>
</form>

<script type="module">
  // Import the functions you need from the SDKs you need
  import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-app.js';
  import { getStorage, ref, uploadBytes } from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-storage.js';

  // Your web app's Firebase configuration
  const firebaseConfig = await fetch('./firebaseConfig.json')
    .then((response) => response.json());

  // Initialize Firebase
  const app = initializeApp(firebaseConfig);

  // Initialize Cloud Storage and get a reference to the service
  const storage = getStorage(app);

  // Get Form
  const uploadForm = document.getElementById('uploadFileForm');

  // Add Submit Event to upload file
  uploadForm.addEventListener('submit', (event) => {
    event.preventDefault();
    const [newImage] = event.target.imageToUpload.files;
    const {name} = newImage;
    const newRef = ref(storage, 'imagenes/' + name);
    uploadBytes(newRef, newImage).then((snapshot) => {
      console.log('Uploaded a blob or file!', snapshot);
    });
  });
</script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Upload FORM FILES</title>
	</head>
	<body>

	<form id="uploadFileForm">
	<fieldset>
	<legend>Archivos para cargar</legend>
	<input type="file" accept="image/jpeg" name="imageToUpload">
	</fieldset>
	<br/>
	<button>Cargar Imagen</button>
	</form>

	<script type="module">
	// Import the functions you need from the SDKs you need
	import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-app.js';
	import { getStorage, ref, uploadBytes } from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-storage.js';

	// Your web app's Firebase configuration
	const firebaseConfig = await fetch('./firebaseConfig.json')
	.then((response) => response.json());

	// Initialize Firebase
	const app = initializeApp(firebaseConfig);

	// Initialize Cloud Storage and get a reference to the service
	const storage = getStorage(app);

	// Get Form
	const uploadForm = document.getElementById('uploadFileForm');

	// Add Submit Event to upload file
	uploadForm.addEventListener('submit', (event) => {
	event.preventDefault();
	const [newImage] = event.target.imageToUpload.files;
	const {name} = newImage;
	const newRef = ref(storage, 'imagenes/' + name);
	uploadBytes(newRef, newImage).then((snapshot) => {
	console.log('Uploaded a blob or file!', snapshot);
	});
	});
	</script>
	</body>
	</html>