How can I add referer header ionic v1 app in case of device

Hi @all,

I am integrating a payment gateway in my app that is developed in Ionic v1, so payment gate way need a form redirection as soon as I click on pay now button , it redirect to payment gateway with a form hidden form.

   <body ng-app="payment">            
	<div ng-controller="PaymentCtrl" style="text-align: center; color: #FF0000;">
                   <form name="sendParam" method="post" action="https://test.sbiepay.com/secure/AggregatorHostedListener">
                            <input  type="hidden" id="EncryptTrans" name="EncryptTrans"  />                                
                            <input  type="hidden" name="merchIdVal" value= "1000003" />                                
			<input type="submit" value="enter" style="position: absolute; left: -9999px"/>
		</form>
                <div class="loaderImg"><img style="width:300px;" src="img/loader.gif" /></div>
		<p style="font-weight: bold;">Please device wait..!</p>
		<p>We are redirecting you to payment gateway</p>
                    <p>Please do not hit refresh or back button or close the window..</p>
	</div>            
	<script>                    
               var transactionParam = window.localStorage.getItem('transParams');  
               document.getElementById('EncryptTrans').value = transactionParam;		   
               setTimeout(function(){ document.sendParam.submit(); }, 5000);                   
	</script>
</body>

So , on browser it append all required headers automatically, but in case of device it does not add the required header which payment gateway ask to add in case of android. Like while sending request from device payment gateway verify the Referer Header, but it does not present in that case, so it refuse the request.

Can anyone assist me in this, I have tried so many tricks but nothing working.

No one is there in this community who can help me with this issue?

If you want to add headers, then you should call $http post on submit and add headers there

var req = {
 method: 'POST',
 url: 'http://example.com',
 headers: {
   'Content-Type':'application/x-www-form-urlencoded' 
   // or  'Content-Type':'application/json'
 },
 data: { test: 'test' }
}

$http(req).then(function(){...}, function(){...});

Hi @thesourav

I am opening an html in InAppBrowser as.

  window.localStorage.setItem('transParams', fieldDevice);      
    
     //Post all required paremeters to the payment gateway   
    iabRef = window.open('epayDevice.html', '_self', 'location=no'); 

And in ePayDevice.html has a form which submit using javascript as following.

   <form name="sendParam" method="post" action="https://test.sbiepay.com/secure/AggregatorHostedListener">
                            <input  type="hidden" id="EncryptTrans" name="EncryptTrans"  />                                
                            <input  type="hidden" name="merchIdVal" value= "1000003" /> 
                            <input type="hidden" name="Origin" value="http://192.168.10.152:8080" />
			<input type="submit" value="enter" style="position: absolute; left: -9999px"/>
		</form>

 <script>                    
               var transactionParam = window.localStorage.getItem('transParams');  
               document.getElementById('EncryptTrans').value = transactionParam;   
  setTimeout(function(){
document.sendParam.submit(); 


}, 5000);     

Can you let me know how to use $http here? . I tried to submit from using Ajax form post but in this case getting error CORS.

Thanks

which header are you trying to pass. Can you give an example what you see in the browser when it works. I already gave an example in my first reply. You can find thousands of those examples on google

In Browser it shows Origin herder and referer header as we… As following.

Please check Origin header, in case of browser its goes fine but in case of device it send it as NULL.

You cannot change the Origin or the referer header. I think it is checking with the X-Auth-Token field. If you are loading your local form.html inside window.open, it does not make a difference.I think the api works in a specific way. You have to contact your provider to see how their api works.( How to fetch the token etc…) .

Yes , this is the issue with ionic only. payment gateway verify the origin of the request. and refuse the request if it found origin as NULL. any way thanks for your attention.

If you have time then check this one oopen issue with ionic.

Have a great day ahead.