I am trying to create a chrome extension which gets response from ChatGPT. I am not ready to pay for an API key. So i tried to use an iframe. But got a “frame-ancestor” error, and solved that using Framer extension which makes this easy. But now I am unable to send questions as i am restricted from accessing a cross-origin frame.
Cannot access iframe content: DOMException: Failed to read a named property ‘document’ from ‘Window’: Blocked a frame with origin “http://127.0.0.1:5500” from accessing a cross-origin frame.at window. Onload (http://127.0.0.1:5500/i.html:26:59)
Is there any other way to solve this problem or use ChatGPT in my extension?
I tried using Gemini API and I was able to get 60 responses per mkinute but I want to integrate ChatGPT in my extension.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<iframe style="width: 1000px; height: 1000px;" id="myIframe"
src="https://chatgpt.com/"></iframe>
<button id="myBtn">Click me</button>
<script>
window.onload = function() {
var iframe = document.getElementById('myIframe');
try {
var iframeDocument = iframe.contentWindow.document;
var content = iframeDocument.body.innerHTML;
console.log(content);
} catch (e) {
console.error('Cannot access iframe content:', e);
}}
</script>
</body>
</html>
This is the code i am currently working on and I am unable to solve the error.