does anybody know how to upload file to local storage using angualr2 ?
@Vinod_Hum check this out: http://valor-software.com/ng2-file-upload/
tried it, its not working
did it work for you ?
getting this error
XMLHttpRequest cannot load http://192.168.1.9:8080/api/v2/files/images. Response to preflight request doesn’t pass access control check: Credentials flag is ‘true’, but the ‘Access-Control-Allow-Credentials’ header is ‘’. It must be ‘true’ to allow credentials. Origin ‘http://192.168.1.9:8100’ is therefore not allowed access.
finally after 2 days I was able to figure out upload with angualr 2
I am not pro programmer so feel free it improve the code below
`uploadImage(file : any,name : string){
return new Promise((resolve, reject) => {
console.log(file);
let xhr = new XMLHttpRequest();
xhr.onreadystatechange = () => {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
resolve(JSON.parse(xhr.response));
} else {
reject(xhr.response);
}
}
}
const URL = `${constants.DSP_INSTANCE_URL}files/images/`;
xhr.open("POST", URL+name, true);
let token = localStorage.getItem('session_token');
xhr.setRequestHeader('X-Dreamfactory-API-Key' ,constants.DSP_API_KEY);
xhr.setRequestHeader('X-Dreamfactory-Session-Token', token);
xhr.setRequestHeader('Content-Type', file.type);
xhr.send(file);
});
}`
do you have a github with the df file upload working? I am struggling with mine still.
nop i don’t have any GitHub and here is easy and better option using http module
which uses base64 and save its in folder
//upload function
uploadImage (data : any) {
return this.http.post(`http://${serverIP}/api/v2/files/images/`,
JSON.stringify({resource : [data] }))
.map((data) => {
return data;
});
}
onChange(files : any){
// calling upload function
let base64 = this.getBase64(files[0])
let src = base64.replace("data:image/jpeg;base64,",'');
let name = `whateverName.jpg`
let data = {
"name": name,
"type": "file",
"is_base64": true,
"content": src
}
this.uploadImage(data).subscribe(
data => console.log(data),
error => console.log(error)
)
}
//convert to base64
getBase64(file){
var reader = new FileReader();
reader.addEventListener("load", function (event ) {
return event.target.result;
}, false);
if (file) {
reader.readAsDataURL(file);
}
}
<input type="file" #image onchange="onChange(image.files)" />
this will save whateverName.jpg in /files/images/
source https://wiki.dreamfactory.com/DreamFactory/Tutorials/Uploading_File
hope this help
Awesome, thank you so much!