Search code examples
web-servicesangularasmx

Call asmx webservice from angular 2


I'm trying my first Angular 2 app. Currently I'm facing the problem with web service call. I've got web service with url like www.myserver.domain/folder/api/webservice.asmx/method.

When I try to call it using Firefox, the method is displayed and if I run it on localhost, I can test it correctly. But if I try to call it from angular code, it will fail. Can anybody tell me, what am I doing wrong?

My code:

@Injectable()
export class MyService {
    // URL to web api
    private serviceUrl = 'http://www.myserver.domain/folder/api/webservice.asmx/method';

    constructor(private http: Http) { }

    getData() {
        let body = JSON.stringify({ Param1: "0", Param2: "0", Param3: "0" });
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });
        return this.http.post(this.serviceUrl, body, options)
            .toPromise()
            .then(response => response.json().data as MyDataClass[])
            .catch(this.handleError);
    }

    handleError(error: any) {
        console.error('An error occurred', error);
        return Promise.reject(error.message || error);
    }
}

For referrence, here is how my webservice looks like:

[WebService(Namespace = "mynamespace")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[ScriptService]
public class webservice: System.Web.Services.WebService
{
    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public void List(int Param1 = 0, int Param2 = 0, int Param3 = 0)
    {
        //... some code to populate result of type List<Dictionary<string, string>>
        data.Message = Common.TranslateToSerialize(result);
        Context.Response.Write(js.Serialize(data.Message));
        return;
    }

Thank you for any help provided. Please consider that I'm new to JS/Ang2, so when asking, please be as detailed as possible :)


Solution

  • Just to let everybody know what caused the problem: the service is returning JSON response followed by {"d" : null} string. When I remove it, everything is parsed correctly.

    I will leave this question open for a while. I would like to see if somebody know why this string is appended. I will mark your answer as the correct one, if you can explain to me. I don't know what is origin of this string since the web service is returning JSON without it for sure.

    Thanks to everybody who will try to answer / explain.