1

I'm trying to send (PUT) data to my backend using a Laravel (5.4) API. Everything works fine in Chrome, Firefox and Postman, but not in Safari and Internet Explorer(11). I use Axios inside a Vue component for the request:

axios.put(url, params)
    .then((resp) => {
        this.getScheduleFromDB();
        this.notice = this.generic.preferencesaved;
        setTimeout(() => {
            this.notice = '';
        }, 2000);
    })
    .catch((error) => {
        this.errormessage = "error saving prefered schedule";
        this.scheduleChanged = false;
    });

In the Safari dev tool (mac) I see that the data is being attached to the request as payload:

{
    "accesstoken": "myaccesstoken",
    "schedule": {
        "monday": [
            {
                "blocked": true
            }
        ],
        "tuesday": [],
        "wednesday": [],
        "thursday": [],
        "friday": [],
        "saturday": [],
        "sunday": [
            {
                "blocked": true
            }
        ]
    }
} 

However, in laravel the $request is completely empty (the controller function is called though, I put some logging in there).

I added a Request object to make this more visual. It has these rules:

public function rules() {
    return [
        "accesstoken" => "required",
        "schedule" => "required"
    ];
}

So now the response in Safari is:

{
    "accesstoken": [
        "The accesstoken field is mandatory."
    ],
    "schedule": [
        "The schedule field is mandatory."
    ]
}

In Chrome and Firefox, the response is a statuscode 200 and the database is updated.

I tried replacing axios by jQuery $.ajax. It has exactly the same result. It seems Laravel doesn't allow the PUT request payload from Safari and Internet Explorer, but it does allow this from Chrome, Firefox and Postman. I tried changing the method to POST, the same result. Does anyone know what I'm doing wrong?

Andrew Lohr
  • 5,380
  • 1
  • 26
  • 38
micksp
  • 123
  • 2
  • 15

2 Answers2

2

Found the solution, for anyone who has this issue in the future: My endpoint url end with a /. this makes laravel respond with a 301. After that the data is gone in safari. See https://stackoverflow.com/a/47209376/1292776 Removed my / at the end of the url and it works in all browsers.

micksp
  • 123
  • 2
  • 15
0

This can happen if Access-Control-Allow-Methods response header's value is set to *. It has to be explicitly set to allow methods(OPTIONS, POST, PUT, GET, DELETE, PATCH) instead of a wildcard as it is not supported by a safari in iOS.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Methods

code.rookie
  • 346
  • 2
  • 6