6
Próbuję użyć , aby przesłać png do imgur. Użyłem kodu bezpośrednio z Imgur API example, ale myślę, że nie przekazuję poprawnie pliku png, ponieważ pojawia się komunikat o błędzie z informacją: file.type is undefined. Myślę, że plik jest ok, jak próbowałem to z kilkoma różnymi pngs. Mój kod wygląda następująco:Przesyłanie png do imguru za pomocą javascript
<html>
<head>
<script type="text/javascript">
function upload(file) {
// file is from a <input> tag or from Drag'n Drop
// Is the file an image?
if (!file || !file.type.match(/image.*/)) return;
// It is!
// Let's build a FormData object
var fd = new FormData();
fd.append("image", file); // Append the file
fd.append("key", "mykey"); // Get your own key: http://api.imgur.com/
// Create the XHR (Cross-Domain XHR FTW!!!)
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://api.imgur.com/2/upload.json"); // Boooom!
xhr.onload = function() {
// Big win!
// The URL of the image is:
JSON.parse(xhr.responseText).upload.links.imgur_page;
}
// Ok, I don't handle the errors. An exercice for the reader.
// And now, we send the formdata
xhr.send(fd);
}
</script>
</head>
<body>
<button type="button" onclick="upload('test.png')">upload to imgur</button>
</body>
</html>
Plik test.pngpng jest przechowywany w tym samym katalogu, co moim pliku html.
Dzięki za sugestie. Aby dodać obraz do płótna, czy obraz 'id'? Zakładam, że nie mogę się do niego odwołać, używając nazwy pliku, na podstawie komentarza @ skimberk1. – djq
Nie można odwołać się do obrazu za pomocą nazwy pliku. Będziesz musiał załadować go do elementu img, a następnie załadować jego zawartość do płótna za pomocą drawImage. Ważne jest, aby tę ostatnią część wykonać w module obsługi ładowania img. W przeciwnym razie to nie zadziała. –
Dzięki bebraw, która pomaga mi zrozumieć przepływ. Obecnie eksperymentuję z http://html2canvas.hertzen.com/; wygląda na to, że wykona część tych kroków. – djq