Angular Downloading a file using contenturl with Basic Authentication

I have a contentUrl when user clicks on that,file should be downloaded.
If I try to browse the contentUrl in the browser it asks for Userid and password.I believe this is Basic Authentication.I dont want user to enter UserId and Password so I am passing it Authorization(Please see below code).
Url looks some thing like this:
http://XXX.XXX.XX.XXX:8080/flowable-rest/service/runtime/tasks/90875/attachments/90555/content

let username : string = 'admin';

let pwd : string = 'test';



let headers = new Headers();

headers.set('Accept', 'text/json'); 

headers.append('Content-Type', 'application/json');

headers.set('Access-Control-Allow-Origin', '*');

headers.set('Access-Control-Allow-Methods','POST, GET, OPTIONS, PUT, DELETE');

headers.set('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');

headers.append("Authorization", "Basic " + btoa(username + ":" + pwd)); 

return this.http.get(url, { headers: headers })

    .pipe(map(r => {

        console.log(r);           



    })).pipe(catchError(this.handleError));

I am not 100% sure whether this approach is fine for my requirement.

I tried contentUrl in the PostMan.In PostMan down right corner 'Download' button appeared and asked me to download.Below is the message it says

This response could not be previewed. Download the response to open it with an appropriate application.

If I click on Download my attachment is getting downloaded.

Pro-grammatically is http.get equivalent to Download? If not how should I code it? Basically my requirement is if I click on the link attachment should be downloaded.

PostMan Execution

edited Jan 2 at 14:02

asked Jan 2 at 13:49

reddy

2916

In the IIS server set Anonymous Authentication: Disabled and ASP.NET Impersonation Enabled. This will make the user have to log into the site and then you can pass the credentials through to the other server.

– jriver27
Jan 4 at 17:32

add a comment |

let username : string = 'admin';

let pwd : string = 'test';



let headers = new Headers();

headers.set('Accept', 'text/json'); 

headers.append('Content-Type', 'application/json');

headers.set('Access-Control-Allow-Origin', '*');

headers.set('Access-Control-Allow-Methods','POST, GET, OPTIONS, PUT, DELETE');

headers.set('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');

headers.append("Authorization", "Basic " + btoa(username + ":" + pwd)); 

return this.http.get(url, { headers: headers })

    .pipe(map(r => {

        console.log(r);           



    })).pipe(catchError(this.handleError));

I am not 100% sure whether this approach is fine for my requirement.

I tried contentUrl in the PostMan.In PostMan down right corner 'Download' button appeared and asked me to download.Below is the message it says

This response could not be previewed. Download the response to open it with an appropriate application.

If I click on Download my attachment is getting downloaded.

Pro-grammatically is http.get equivalent to Download? If not how should I code it? Basically my requirement is if I click on the link attachment should be downloaded.

PostMan Execution

edited Jan 2 at 14:02

asked Jan 2 at 13:49

reddy

2916

In the IIS server set Anonymous Authentication: Disabled and ASP.NET Impersonation Enabled. This will make the user have to log into the site and then you can pass the credentials through to the other server.

– jriver27
Jan 4 at 17:32

add a comment |

let username : string = 'admin';

let pwd : string = 'test';



let headers = new Headers();

headers.set('Accept', 'text/json'); 

headers.append('Content-Type', 'application/json');

headers.set('Access-Control-Allow-Origin', '*');

headers.set('Access-Control-Allow-Methods','POST, GET, OPTIONS, PUT, DELETE');

headers.set('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');

headers.append("Authorization", "Basic " + btoa(username + ":" + pwd)); 

return this.http.get(url, { headers: headers })

    .pipe(map(r => {

        console.log(r);           



    })).pipe(catchError(this.handleError));

I am not 100% sure whether this approach is fine for my requirement.

I tried contentUrl in the PostMan.In PostMan down right corner 'Download' button appeared and asked me to download.Below is the message it says

This response could not be previewed. Download the response to open it with an appropriate application.

If I click on Download my attachment is getting downloaded.

Pro-grammatically is http.get equivalent to Download? If not how should I code it? Basically my requirement is if I click on the link attachment should be downloaded.

PostMan Execution

edited Jan 2 at 14:02

asked Jan 2 at 13:49

reddy

2916

let username : string = 'admin';

let pwd : string = 'test';



let headers = new Headers();

headers.set('Accept', 'text/json'); 

headers.append('Content-Type', 'application/json');

headers.set('Access-Control-Allow-Origin', '*');

headers.set('Access-Control-Allow-Methods','POST, GET, OPTIONS, PUT, DELETE');

headers.set('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');

headers.append("Authorization", "Basic " + btoa(username + ":" + pwd)); 

return this.http.get(url, { headers: headers })

    .pipe(map(r => {

        console.log(r);           



    })).pipe(catchError(this.handleError));

I am not 100% sure whether this approach is fine for my requirement.

I tried contentUrl in the PostMan.In PostMan down right corner 'Download' button appeared and asked me to download.Below is the message it says

This response could not be previewed. Download the response to open it with an appropriate application.

If I click on Download my attachment is getting downloaded.

Pro-grammatically is http.get equivalent to Download? If not how should I code it? Basically my requirement is if I click on the link attachment should be downloaded.

PostMan Execution

angular postman swagger-codegen flowable

edited Jan 2 at 14:02

asked Jan 2 at 13:49

reddy

2916

edited Jan 2 at 14:02

asked Jan 2 at 13:49

reddy

2916

edited Jan 2 at 14:02

asked Jan 2 at 13:49

reddy

2916

asked Jan 2 at 13:49

reddy

2916

asked Jan 2 at 13:49

reddy

2916

In the IIS server set Anonymous Authentication: Disabled and ASP.NET Impersonation Enabled. This will make the user have to log into the site and then you can pass the credentials through to the other server.

– jriver27
Jan 4 at 17:32

add a comment |

In the IIS server set Anonymous Authentication: Disabled and ASP.NET Impersonation Enabled. This will make the user have to log into the site and then you can pass the credentials through to the other server.

– jriver27
Jan 4 at 17:32

In the IIS server set Anonymous Authentication: Disabled and ASP.NET Impersonation Enabled. This will make the user have to log into the site and then you can pass the credentials through to the other server.

– jriver27
Jan 4 at 17:32

add a comment |

1 Answer
1

active

oldest

votes

Try setting withCredentials: true.

i.e.

// let username : string = 'admin'; //don't do this

// let pwd : string = 'test';   //don't do this

const headerJson = {

    'Content-Type': 'application/json'

};



const headers = new HttpHeaders(headerJson);



return this.http.get(url, { headers: headers, withCredentials: true })

    .pipe(map(r => {

        console.log(r);

    })).pipe(catchError(this.handleError));

answered Jan 2 at 14:05

jriver27

470213

this didn't work..

– reddy
Jan 3 at 7:44

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54007514%2fangular-downloading-a-file-using-contenturl-with-basic-authentication%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

Try setting withCredentials: true.

i.e.

// let username : string = 'admin'; //don't do this

// let pwd : string = 'test';   //don't do this

const headerJson = {

    'Content-Type': 'application/json'

};



const headers = new HttpHeaders(headerJson);



return this.http.get(url, { headers: headers, withCredentials: true })

    .pipe(map(r => {

        console.log(r);

    })).pipe(catchError(this.handleError));

answered Jan 2 at 14:05

jriver27

470213

this didn't work..

– reddy
Jan 3 at 7:44

add a comment |

Try setting withCredentials: true.

i.e.

// let username : string = 'admin'; //don't do this

// let pwd : string = 'test';   //don't do this

const headerJson = {

    'Content-Type': 'application/json'

};



const headers = new HttpHeaders(headerJson);



return this.http.get(url, { headers: headers, withCredentials: true })

    .pipe(map(r => {

        console.log(r);

    })).pipe(catchError(this.handleError));

answered Jan 2 at 14:05

jriver27

470213

this didn't work..

– reddy
Jan 3 at 7:44

add a comment |

Try setting withCredentials: true.

i.e.

// let username : string = 'admin'; //don't do this

// let pwd : string = 'test';   //don't do this

const headerJson = {

    'Content-Type': 'application/json'

};



const headers = new HttpHeaders(headerJson);



return this.http.get(url, { headers: headers, withCredentials: true })

    .pipe(map(r => {

        console.log(r);

    })).pipe(catchError(this.handleError));

answered Jan 2 at 14:05

jriver27

470213

Try setting withCredentials: true.

i.e.

// let username : string = 'admin'; //don't do this

// let pwd : string = 'test';   //don't do this

const headerJson = {

    'Content-Type': 'application/json'

};



const headers = new HttpHeaders(headerJson);



return this.http.get(url, { headers: headers, withCredentials: true })

    .pipe(map(r => {

        console.log(r);

    })).pipe(catchError(this.handleError));

answered Jan 2 at 14:05

jriver27

470213

answered Jan 2 at 14:05

jriver27

470213

answered Jan 2 at 14:05

jriver27

470213

answered Jan 2 at 14:05

jriver27

470213

this didn't work..

– reddy
Jan 3 at 7:44

add a comment |

this didn't work..

– reddy
Jan 3 at 7:44

this didn't work..

– reddy
Jan 3 at 7:44

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Bdtjtk