CORS ISSUE in API calls

Developers
, ,
#1

Hi,
I want to access certain GitHub pages for my tiddlywiki.

\procedure fetchDataAPI()
	<$action-sendmessage
		$message="tm-http-request"
        url="https://github.com/xyx/abc”
		method="GET"
        header-Content-Type="application/json"
        header-Authorization=`Bearer abcdefd`
		oncompletion=<<completion>>
		onprogress=<<progress>>
	/>
<$let data={{{ [[data]get[text]] }}}>
<<tiddlerize>>
</$let>
\end
<$button actions=<<fetchDataAPI>>>Fetch data directly</$button>

But always I’m getting CORS ISSUE if I try to access the page using macro calls.
How can I solve the issue here ? Can anyone guide me.

Thanks

#2

@saqimtiaz @EricShulman Can anyone guide me on this ?

#3

you have back ticks instead of quot marks here

#5

I tried both, backtick and quotes as well.

`Bearer abcdefd`

'Bearer abcdefd'

Still the error persist .

Access to XMLHttpRequest at ‘https://github.com/xyz/abc’ from origin ‘null’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.Understand this errorAI
http.js:330

#6

this works for me

\procedure store-fetched-output()
<$action-setfield $tiddler="bjresults" status=<<status>> error=<<error>> data=<<data>> headers=<<headers>>/>
\end

\procedure http-get()
	<$action-sendmessage
		$message="tm-http-request"
        header-Content-Type="application/json"
		url="https://api.github.com/repos/buggyj/tiddlyclip/contents/README.md"
		method="GET"
		oncompletion=<<store-fetched-output>>
	/>
\end

<$button actions=<<http-get>>>send HTTP GET</$button>
#7

my bad, backticks are fine.

#8

yeah this worked. What if i want to access a json file, example, manifest.json file ( manifest.json.
I changed the URL to url="https://api.github.com/repos/buggyj/tiddlyclip/contents/manifest.json " , but it was downloading something else rather than the expected .
Which path I need to give ?

#9

I get the correct file, you need to decode the contetnt:

\procedure store-fetched-output()
<$action-setfield $tiddler="bjresults" status=<<status>> error=<<error>> text={{{ [<data>jsonget[content]decodebase64[]] }}} headers=<<headers>>/>
\end

\procedure http-get()
	<$action-sendmessage
		$message="tm-http-request"
        header-Content-Type="application/json"
		url="https://api.github.com/repos/buggyj/tiddlyclip/contents/manifest.json "
		method="GET"
		oncompletion=<<store-fetched-output>>
	/>
\end

<$button actions=<<http-get>>>send HTTP GET</$button>
#10

When I ran it, I got :

{
  "name": "manifest.json",
  "path": "manifest.json",
  "sha": "f2159cdb2db128e8991b9805f40d2d4c8c1a9886",
  "size": 652,
  "url": "https://api.github.com/repos/buggyj/tiddlyclip/contents/manifest.json?ref=master",
  "html_url": "https://github.com/buggyj/tiddlyclip/blob/master/manifest.json",
  "git_url": "https://api.github.com/repos/buggyj/tiddlyclip/git/blobs/f2159cdb2db128e8991b9805f40d2d4c8c1a9886",
  "download_url": "https://raw.githubusercontent.com/buggyj/tiddlyclip/master/manifest.json",
  "type": "file",
  "content": "ewoJIm1hbmlmZXN0X3ZlcnNpb24iOiAyLAoJIndlYl9hY2Nlc3NpYmxlX3Jl\nc291cmNlcyI6IFsKCQkiY29udGVudC9yZXNvdXJjZXMvY3NzLyouY3NzIgoJ\nXSwKCSJiYWNrZ3JvdW5kIiA6IHsKCQkicGFnZSIgOiAiY29udGVudC9iYWNr\nZ3JvdW5kLmh0bWwiCgl9LAoJImNvbnRlbnRfc2NyaXB0cyIgOiBbIHsKCQki\nanMiIDogWwoJCQkiY29udGVudC91dGlsL2xvZ3NpbXBsZS5qcyIJLAkJCgkJ\nCSJjb250ZW50L2NvbnRlbnRTY3JpcHQuanMiCgkJXSwKICAgICAgIm1hdGNo\nZXMiIDogWwogICAgICAgICJodHRwOi8vKi8qIiwKICAgICAgICAiZmlsZTov\nLy8qIiwKICAgICAgICAiaHR0cHM6Ly8qLyoiCiAgICAgIF0sCgkJInJ1bl9h\ndCIgOiAiZG9jdW1lbnRfc3RhcnQiCgl9IF0sCgkiZGVzY3JpcHRpb24iIDog\nIkEgY29udGV4dCBtZW51IGV4dGVuc2lvbiBmb3IgdGlkZGx5d2lraSIsCgki\naWNvbnMiIDogewoJCSIxNiIgOiAic2tpbi9pY29uMTYucG5nIiwKCQkiNDgi\nIDogInNraW4vaWNvbi00OC5wbmciCgl9LAoJIm5hbWUiIDogInRpZGRseWNs\naXAiLAoJInBlcm1pc3Npb25zIiA6IFsKCQkidGFicyIsICI8YWxsX3VybHM+\nIiwKCQkiY29udGV4dE1lbnVzIiwKCQkibm90aWZpY2F0aW9ucyIKCV0sCgoJ\nInZlcnNpb24iIDogIjAuMC44Igp9Cg==\n",
  "encoding": "base64",
  "_links": {
    "self": "https://api.github.com/repos/buggyj/tiddlyclip/contents/manifest.json?ref=master",
    "git": "https://api.github.com/repos/buggyj/tiddlyclip/git/blobs/f2159cdb2db128e8991b9805f40d2d4c8c1a9886",
    "html": "https://github.com/buggyj/tiddlyclip/blob/master/manifest.json"
  }
}

The content of the manifest.json is encoded. do we have any way to decode it, im looking for the content inside “tiddlyclip/manifest.json at master · buggyj/tiddlyclip · GitHub” this?
But when I try to access the same issue as CORS I’m getting?

#11

I put the decoding in the above

1 Like
#12

Thank you very much, it worked. Great solution