I had browsing for files working in chrome extensions but suddenly it stopped working (im guessing because of a chrome upgrade (to v33?))
i have looked around and all answers seem outdated...
here are my files (i got it from this: Upload File as a Form Data through chrome extension)
manifest.json:
{
"background": {
"persistent": false,
"scripts": ["background.js"]
},
"name": "yoyo",
"manifest_version": 2,
"version": "1.0.0",
"browser_action": {
"default_title": "Test Extension",
"default_popup": "popup.html"
},
"permissions": [
"https://www.example.com/uploads"
]
}
popup.html:
<html>
<head>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<input type="button" id="button" value="Browse and Upload" />
</body>
</html>
popup.js:
document.addEventListener('DOMContentLoaded', function () {
document.getElementsByTagName('input')[0].addEventListener('click', function () {
chrome.runtime.sendMessage({ action: 'browseAndUpload' }, function(response){});
window.close();
});
});
background.js:
var uploadURL = 'https://www.example.com/uploads';
/* Creates an `input[type="file]` */
var fileChooser = document.createElement('input');
fileChooser.type = 'file';
fileChooser.addEventListener('change', function () {
var file = fileChooser.files[0];
var formData = new FormData();
formData.append(file.name, file);
var xhr = new XMLHttpRequest();
xhr.open('POST', uploadURL, true);
xhr.addEventListener('readystatechange', function (evt) {
console.log('ReadyState: ' + xhr.readyState,
'Status: ' + xhr.status);
});
xhr.send(formData);
form.reset(); // <-- Resets the input so we do get a `change` event,
// even if the user chooses the same file
});
/* Wrap it in a form for resetting */
var form = document.createElement('form');
form.appendChild(fileChooser);
/* Listen for messages from popup */
chrome.runtime.onMessage.addListener(function (msg) {
if (msg.action === 'browseAndUpload') {
fileChooser.click();
}
});
