用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦

關於JavaScript的跨域題目(Cross Domain)的議論, 網上有太多的資本了。國內的順序猿寫了異常多的優異文章,Jerry這裏就不再反覆了。

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

直入主題,近來我正在做一個原型開闢:經由過程SAP雲平台和SAP Cloud Connector把On-Premise體繫上的ABAP function module STFC_CONNECTION 暴露出來,給微信消耗。

這個function module的邏輯很簡樸,直接把輸入參數REQUTEXT的內容不加任何處置懲罰,拷貝到輸出參數ECHOTEXT。

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

細緻操縱步驟參考我的民眾號文章:運用Java+SAP雲平台+SAP Cloud Connector挪用ABAP On-Premise體系裡的函數

布置到SAP雲平台後,經由過程以下的API endpoint舉行挪用:

https://demoi042416trial.hana…

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

然後在我的微信音訊效勞器上提議以下的AJAX挪用去消耗(由於是POC,所以把API endpoint硬編碼在第3行):

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

碰到了意料之中的跨域毛病: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

怎樣處理?

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

解法1:Cross-Origin Resource Sharing

假如效勞器端的相應能夠經由過程編程或設置去影響,那末能夠藉助Cross-Origin Resource Sharing,在HTTP相應構造中增加字段Access-Control-Allow-Origin,其內容依據現實營業賦以須要的origin字段即可。這裏的origin在Jerry看來就是一個白名單。

處理方案參考我的博客:

Cross domain request in ABAP and Java

https://blogs.sap.com/2017/05…

解法2:JSONP

用JSONP也能處理跨域題目,但這個要領一樣須要在效勞器端經由過程編程體式格局做一些處置懲罰。細緻運用體式格局參考我的博客:

Play around with JSONP in nodeJS server and ABAP server

https://blogs.sap.com/2017/06…

而我運用SAP雲平台加上Cloud Connector將On Premise上的function module暴露到公網,這類體式格局開闢人員沒法對HTTP的相應頭舉行編程或設置。因而JSONP關於我原型開闢處理跨域題目也沒有協助。

在SAP雲平台的Mobile Service for Development and Operations cockpit里有對應的Cross Domain Access參數設置。不過我的原型開闢沒有用到SAP雲平台Mobile Service這套架構,因而也不實用。

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

解法3:自開闢ProxyServlet

接下來咋辦?Jerry之前做CRM Fiori開闢時,用的是Eclipse IDE,在當地起一個Tomcat,上面跑的Fiori運用也能經由過程localhost這個域接見到On-Premise體系域上的OData效勞。當時咋不會碰到跨域題目呢?細緻回想了一下,當時我們的Tomcat效勞器上還布置了一個Proxy Servlet。Index.html發送的AJAX要求被ProxyServlet阻攔,由ProxyServlet經由過程Java代碼向On-Premise體系提議要求。要求獲得相應以後,ProxyServlet再將其發送給Index.html。

這類範例的Servlet其道理在我的這篇博客里有細緻引見:

Explore the com.sap.ui5.resource.ResourceServlet

https://blogs.sap.com/2014/12…

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

思路清楚后,寫代碼完成就很輕易了。上圖對應的Java Web項目的源代碼在我的github上:

https://github.com/i042416/SC…

1. index.html里發送的AJAX要求現實指向的處置懲罰者是ProxyServlet:注重下圖第三行的要求url途徑中的proxy

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

2. 開闢一個ProxyServlet,阻攔url途徑里包括proxy的那些要求。回到我的原型開闢需求,SAP雲平台上的API消耗現在經由過程ProxyServlet來完成,為簡樸起見,我將API endpoint硬編碼在ProxyServlet里。

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

經由測試,能根據希冀的體式格局事情:域localhost的AJAX要求能夠勝利接見SAP雲平台上的API:

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

《用JavaScript接見SAP雲平台上的效勞碰到跨域題目該怎麼辦》

寫完以後我在Google上搜了一下,發明SAP已經在github上宣布了一個規範的Proxy project,用於處置懲罰這類JavaScript跨域接見的題目,人人有興緻能夠相識一下:

https://github.com/SAP/cloud-…

更多瀏覽

要獵取更多Jerry的原創技術文章,請關注民眾號”汪子熙”.

    原文作者:JerryWangSAP
    原文地址: https://segmentfault.com/a/1190000015048041
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞