How to Fix the 'Mixed Content Blocked' Error for AJAX Calls on HTTPS Sites?

Resolving "Mixed Content Blocked" Error for HTTP AJAX Operations in HTTPS Pages

When attempting to perform an HTTP AJAX operation from an HTTPS page, you may encounter the "Mixed Content Blocked" error. This occurs when the browser detects an insecure HTTP request being made from a secure HTTPS page.

To address this issue, you can use the following solutions:

1. Use a Proper HTTP Method

If the target API supports HTTPS, you should update your AJAX request to use the HTTPS protocol:

url: "https://XX.XXX.XX.XX/vicidial/non_agent_api.php",

2. Use a Content Security Policy Meta Tag

If changing the API protocol is not possible, you can add the following meta tag to the HTML page to allow mixed content:

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

This will instruct the browser to automatically upgrade insecure HTTP requests to HTTPS, resolving the mixed content issue.

3. Use a Server-Side Proxy

If the previous solutions are not viable, you can create a server-side proxy script that receives the HTTP AJAX request and forwards it to the target API using HTTPS:

<?php
// Read and parse incoming data
$data = $_GET;

// Send data to API via HTTPS
$result = file_get_contents("https://XX.XXX.XX.XX/vicidial/non_agent_api.php?queries=" . http_build_query($data));

// Redirect user to thank-you page
header("Location: https://www.example.com/thank-you");
?>

The above is the detailed content of How to Fix the 'Mixed Content Blocked' Error for AJAX Calls on HTTPS Sites?. For more information, please follow other related articles on the PHP Chinese website!