No 'Access-Control-Allow-Origin' header error in ionic 3 - php

hey im new to ionic 3 i prepared a form of contact for my application where the server (php) has to send an email after the filling of the form by the user .
in the server i use the function mail to send email by the server it works find and it sends email even with the appearence of error of No 'Access-Control-Allow-Origin' header
I already added the two headers in my php scripts
header("Access-Control-Allow-Origin: *");
header('Content-Type: text/html; charset=utf-8');

This is not a problem of your ionic app. The server you try to access via api call doens't support CORS. Hopefully this article helps you to solve your problem.
https://blog.ionicframework.com/handling-cors-issues-in-ionic/
There is a tutorial or solution to solve your problem.
Here is the important part for you
Dealing with CORS in Ionic
CORS is only an issue when we are running or testing our app when running ionic serve or ionic run -l.
There are two ways to solve the issue: The first, and easier, solution
is to just allow all origins from your API endpoint. However, we can’t
always control the endpoint we are accessing. What we need, then, is a
request that does not specify an origin.
We can do this by using a proxy server. Let’s look how the Ionic CLI
provides an easily configurable proxy server.

Related

Laravel passport is working on localhost but not on heroku

I am working on an authentication (login & registration) application using java (android).
Now in order to communicate with a database I was requested to implement it using Laravel web app. I configured everything (Laravel passport) and tested it using postman.
I deployed the website on Heroku and configured pgsql with it. then I duplicated the request in postman and changed the URL.
the problem is that it is adding the new user in the database but it is returning 500 internal server error with no access token
postman response when adding the user:
the new user in the db:
the code responsible for adding users (same code is still working on localhost)
You probably have an error after creating the user. You receive a server-side 500 response because it is not sending you the correct headers to respond in json.
Some APIs require you to send particular headers along with requests, typically to provide additional metadata about the operation you are performing. You can set these up in the Headers tab. Enter any key-value pairs you need and Postman will send them along with your request. As you type, Postman will prompt you with common options you can use to autocomplete your setup, such as Accept
Make sure you are sending Accept: application/json and in your .env file this APP_DEBUG=true to see the error.

React proxy issue with the API server

I am a newbie with the react project deployment. The API server is the Laravel project and it's hosted on the Siteground.
I am sure the APIs works by Postman. And the react project runs on localhost:3000. In order to fetch some data with API, I have added the proxy: "http://api server domain" into the package.json.
It always says "Not allowed method" when I am going to fetch the data.
So I have hosted the API server on the localhost. In this case, I have added the proxy: "http://localhost:8000 into the package.json, it works perfectly.
How can I solve this issue?
It's seems like you're having a CORS (Cross-Origin Resource Sharing) problem.
According to MDN, CORS is a mechanism that uses additional HTTP headers to tell browsers to give a web application running at one origin, access to selected resources from a different origin. A web application executes a cross-origin HTTP request when it requests a resource that has a different origin (domain, protocol, or port) from its own.
An example of a cross-origin request: the front-end JavaScript code served from https://domain-a.com uses XMLHttpRequest to make a request for https://domain-b.com/data.json.
For security reasons, browsers restrict cross-origin HTTP requests initiated from scripts. For example, XMLHttpRequest and the Fetch API follow the same-origin policy. This means that a web application using those APIs can only request resources from the same origin the application was loaded from, unless the response from other origins includes the right CORS headers.
More technical details HERE.
Solving:
You need to enable CORS on your API service.
If you don't have access to configure Apache, you can still send the header from a PHP script. It's a case of adding the following to your PHP scripts:
<?php header("Access-Control-Allow-Origin: *");
The following link shows how to: How to enable CORS on PHP
Since you're using Laravel, using a middleware may be a good way to solve your CORS situation.
CORS Middleware for Laravel should help you.

Angular not making CORS preflight

I'm trying to build a new API using Lumen (even though I'm having second thoughts about that), and am trying to use barryvdh's CORS package. I think I have it setup properly, so decided to do a simple request in angular to the default route setup.
With my current, manually setup API, when I make an API request, I always see 2 requests: the first being an OPTIONS request, the second being the POST/GET/DELETE/whatever. When I hit the Lumen api (on a different subdomain), I only see one request, being the POST or GET I'm testing. Both return me the expected results, but I still get the No 'Access-Control-Allow-Origin' header is present on the requested resource., presumably because there was no OPTIONS request?
Do I not understand CORS well enough? Is this expected? Do I not understand Lumen? I have no idea where I've gone wrong with this one.
You will need to intercept the OPTIONS request in Lumen and make sure it returns the cors headers. See https://gist.github.com/danharper/06d2386f0b826b669552 Also you can try and use Postman (a nice app for testing apis) to inspect if the headers were send correctly. https://www.getpostman.com/.The headers you are looking to add are
'Access-Control-Allow-Origin' '*';
'Access-Control-Allow-Headers' 'Content-Type';
Note the headers can also be added to your web server instead of your app but that's not always a good idea.

Access a remote Laravel 5 web app using ajax through a Hybrid App

I'm developing a Hybrid App where I use ajax requests to connect to a remote database. The database is accessed through the Laravel(5) framework. When I send requests to the remote laravel web app, I get the following case.
Error with message, No Access Control Allow Origin Header Present.
To solve this problem I added the access control headers to the index.php at public/ directory. Then the above error no longer occurs(Yes, I know that we can do the same using a Middleware and it is the recommended way). But then an internal server error occurs saying csrf Token mismatch exception. I know that if this was a web appilication, we could have easily added the csrf_token. Since this is a hybrid app, I cant set a token since I can't run any PHP here and I can't obtain a token by an ajax request.
Up to now, I have read almost every thread related to this in Laravel Forums. But there were no feasible answer. Does anyone have an idea about how to solve this issue?
Thanks in Advance!

CURL request for AZURE Push Notification is not working

I have gone through links that provide some CURL request samples for AZURE push notifications but none of them works for me.
Like in this url CURL request using Ruby language is provided but like others it is also not working.
"Internal Server Error (500)"
occurred every time when I made a request using CURL requests.
If anybody can provide me with working code of CURL request for AZURE push notifications then it would be convenient for me to solve the issue. Keeping in mind that push notifications from web portal of AZURE are working absolutely fine.
May I know whether you are using Azure Service Bus Notification Hub? If so, the most likely problem from my experience is you may haven't formatted the request properly. It’s needed to prepare the following information, and send them in request headers:
Content-Type: Based on the platform you choose, the value will be different. For instance, for Windows Store apps, content type is application/xml.
ServiceBusNotification-Format: The device type, such as windows.
X-WNS-Type: Push notification type, such as wns/toast.
Authorization: The rules are described in https://msdn.microsoft.com/en-us/library/azure/dn495627.aspx. Pay special attention to the Create SAS Security Token part.
And the request content. The format is different for different devices. For example, for Windows Store apps, it’s needed to use xml like:
<?xml version="1.0" encoding="utf-16"?><toast><visual><binding template="ToastText01"><text id="1">Hello!</text></binding></visual></toast>
If you're using CURL command line, please make sure to use double quotes instead of single quotes.
Also please make sure you have correctly registered the push notification service provider in Azure. For instance, for Windows Store apps, please register the SID and the client secret.
If the issue is still encountered, please share more information. It would be better if you can let us know:
• Are you trying to use the CURL command line or PHP code?
• What kind of device you're using?
• What kind of message you want to send?

Categories