Testing the webresource locally

[lucavice]

Hi kip-dk,

first of all, thank you for your guide regarding Angular projects in Dynamics 365. I've experimented with this myself before reading your guide, and came to similar conclusions regarding the build processes for Angular applications in Dynamics.

I am opening this issue to let you know that I found a way to test locally the application in localhost:4200 with a working connection to Dynamics 365 (online), which was the main hurdle in having a full working environment for testing quickly Angular applications.

To achieve this I am using two Chrome Extensions:

• *Allow-Control-Allow-Origin: ** -- this extension allows me to bypass CORS and send requests from localhost to the Dynamics instance
• Requestly -- this extensions allows to set custom headers for requests to defined domains. In this extension I manually set the "Cookie" header that I can retrieve with Chrome Developer Tools while browsing Dynamics 365 while authenticated.

This approach is not perfect, but the cookie will last for a few hours, allowing me to test and debug the application for a whole working day.

[kip-dk]

Hi Lucavice

Tnx. for your input. I appreciate.

I am currently working with a more robust way of doing this, but in another project (kipon-xrmservice).

kipon-xrmservice project is a angular HttpClient based wrapper that makes it a lot easier to work with the Dynamics 365 Web API.

Currently it does not support authentication (meaning that it can only run as a WebResource inside Dynamics 365), but i am in the process of adding support for authentication, using the adal.js library.

This will allow the library to be used in external SPA applications, running outside the Dynamics 365, and as such, it will also give the perfect container for developing using ng serve.

This article has a pretty good description on how it is done:

https://community.dynamics.com/crm/b/scaleablesolutionsblog/archive/2016/01/18/web-api-authentication-from-javascript

only catch is that you have to registre your application under the AZURE active directory, but that pretty straight forward to do.

I will update this issue when that effort is ready to be shared.

thanks again.

[lucavice]

Hi kip-dk,

thank you for the reply. I agree that for developing a fully featured SPA, using the adal.js and AD authentication is a much better approach, but it is obviously adding quite a bit of overhead in authentication management that is not required if you are working within a webresource in Dynamics 365 (for example, for an advanced widget to add to a entity form). I still think that working with a webresource has many good use cases.

I just had a look at your kipon-xrmservice project, I think it looks very good! I like a lot the automatic mapping from typed classes for CRUD operations, I hope I get a chance to play with it soon.

[lucavice]

I wanted to update this issue to let you know that I found a better way to test web resources locally for development. By starting Chrome with the shortcut '"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-data-dir="C://Chrome dev session" --disable-web-security' (as explained here) same origin policy gets disabled and you obtain two results:

• CORS are disabled, therefore requests from localhost to Dynamics online go through
• If you login in Dynamics within this "special" Chrome session, the authentication Cookie is also sent when requesting a Dynamics resource from localhost.

With the approach above, I can run ng serve and get full access to the Dynamics online API endpoints without plugins or any manual step. It is currently working really well for me.

[kip-dk]

Thanks for the update on running local. I took the liberty to update the Git based article to include this approach.

That approach is really cool if the end target for the angular application is to run inside Dynamics 365 as a web resource.

regards Kjeld

Mvh. Kjeld Poulsen

Mail: kip@kipon.dk Phone: +45 30 70 11 48 Web: http://kipon.dk in: https://www.linkedin.com/in/kipon

Interesseret i angular og Dynamics 365 udvikling, se min seneste artikel om emnet:

Angular and Dynamics 365 https://www.linkedin.com/pulse/dynamics-365-web-resources-angular-4-kjeld-poulsen

2018-05-17 20:08 GMT+02:00 Luca V. notifications@github.com:

I wanted to update this issue to let you know that I found a better way to test web resources locally for development. By starting Chrome with the shortcut '"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-data-dir="C://Chrome dev session" --disable-web-security' (as explained here https://stackoverflow.com/questions/3102819/disable-same-origin-policy-in-chrome) same origin policy gets disabled and you obtain two results:

• CORS are disabled, therefore requests from localhost to Dynamics online go through
• If you login in Dynamics within this "special" Chrome session, the authentication Cookie is also sent when requesting a Dynamics resource from localhost.

With the approach above, I can run ng serve and get full access to the Dynamics online API endpoints without plugins or any manual step. It is currently working really well for me.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/kip-dk/angular-xrm-webresource/issues/1#issuecomment-389958152, or mute the thread https://github.com/notifications/unsubscribe-auth/AIYGJ3y6rcTpKmSLeWyVkbEBOGkPVqc8ks5tzbyggaJpZM4S63Pj .