Failed to load resource: the server responded with a status of 404 ()
matharotheelf opened this issue · comments
Tom Lawrence commented
I am trying to 'square' a file using WASM-ImageMagick however I am facing an error I can't figure out. I seems that I can't load some files and my requests to the api are causing 404s.
Here is the Javascript in the 'index.html' I am running:
<script type='module'>
//import the library to talk to imagemagick
import * as Magick from 'https://knicknic.github.io/wasm-imagemagick/magickApi.js';
// various html elements
let rotatedImage = document.getElementById('rotatedImage');
// Fetch the image to rotate, and call image magick
let DoMagickCall = async function () {
let fetchedSourceImage = await fetch("artwork.jpg");
let arrayBuffer = await fetchedSourceImage.arrayBuffer();
let sourceBytes = new Uint8Array(arrayBuffer);
// calling image magick with one source image, and command to rotate & resize image
const files = [{ 'name': 'srcFile.jpg', 'content': sourceBytes }];
const command = [
"convert",
"srcFile.jpg",
"-bordercolor",
"transparent",
"-border",
"1",
"-set",
'option:distort:viewport "%[fx:max(w,h)]x%[fx:max(w,h)]-%[fx:max((h-w)/2,0)]-%[fx:max((w-h)/2,0)]"',
"-virtual-pixel",
"edge",
"-distort",
"SRT",
"0",
"the_square.jpg"];
let processedFiles = await Magick.Call(files, command);
// response can be multiple files (example split)
// here we know we just have one
let firstOutputImage = processedFiles[0]
rotatedImage.src = URL.createObjectURL(firstOutputImage['blob'])
console.log("created image " + firstOutputImage['name'])
};
DoMagickCall();
</script>
I get the following errors:
I would appreciate any help!