axios get api is not working with X-Api-Key to access API Gateway - axios

I am accessing API gateway end point from Front end react application and it was working fine. Recently, I have enabled Api key in AWS API gateway and deploy API. I have created API key and set up that to Usage plan. I test this API from Postman, I added x-api-key in header and it works perfect in postman. Same API when I access through axios from my front end react application it always failed in preflight and give me CORS error. Below is my front end code. It seems that it doesn't send X-Api-Key at all to API end point. I would appreciate your response.
import axios from "axios";
export default axios.create({
baseURL: ${process.env.BASE_URL},
headers: {
"Content-Type": "application/json",
"Accept": "application/json",
"X-Api-Key": ${process.env.APPKEYID},
},
});

Related

Unable to authenticate via PAT token GitHub API for GitHub Enterprise version when SAML SSO is enabled

I'm pretty new for GitHub API usage. I'm trying to get GitHub pull request data through API from my org.'s enterprise github enterprise where SAML SSO is enabled. I have generated Private Access Token for the same. But I'm unable to get correct response.
Every time I'm getting html page as response showing link to redirect to SAML SSO login page.
Kindly let me know where I'm missing something.
I copied few request cURL from browser and ran those via Postman, noticed that cookies are enabling UI requests to success, But I'm not sure how to create that cookies for different users who will run my API script. Below authentications I've tried till now:
import requests
headers = {'Authorization': 'Bearer ' + 'MY_TOKEN'}
login = requests.get('https://git.<org_name>.com/<org>/<repo_name>/pull/400', headers)
print(login.text)
import requests
headers = {'Authorization': 'token ' + 'MY_TOKEN'}
login = requests.get('https://git.<org_name>.com/<repo_name>/pull/400', headers)
print(login.text)
import requests
headers = {'Authorization': 'Basic ' + '<Base64 version of username:token>'}
login = requests.get('https://git.<org_name>.com/<repo_name>/pull/400', headers)
print(login.text)
import requests
login = requests.get('https://git.<org_name>.com/<repo_name>/pull/400', auth=(<username>,<PAT>))
print(login.text)
I'm expecting that PR's details in response.

AppSync request from API Gateway: Valid authorization header not provided

I have an AWS architecture like this:
An API Gateway with many endpoints. One of them is "/graphql"
The "/graphql" API Gateway endpoint points to a "/graphql" AppSync endpoint
My API Gateway uses COGNITO_USER_POOL to authentificate users. When an user makes a request to "/graphql" endpoint of API Gateway, he must to add id_token to "Authorization" header on the request. It works well.
My integration method on API Gateway gets the "Authorization" header and puts it on AppSync request using this HTTP Headers mapping:
Authorization = method.request.header.Authorization
It seems to work correctly also. Nevermind, I got this AppSync error when requesting the API Gateway endpoint:
{
"errors": [
{
"errorType": "UnauthorizedException",
"message": "Valid authorization header not provided."
}
]
}
It doesn't seems to be a token problem, because it works correctly when I request the AppSync endpoint directly (with the same Authorization header).
I observed that API Gateway adds some headers on the AppSync request, to generate a Signature. So my question is: Is there any way to do a request on AppSync from API Gateway without pass the Signature, only the id_token that user got from Cognito User Pool? I'd like to ignore IAM and use only the token (as I do when the request is done directly on AppSync from Postman).
Many thanks!

How to use the website URL as base URL for Axios requests in a Nuxt.js app

I have a webapp deployed and it's visitable via the domain url www.myapp.com.
Also I have a backend deployed that is called by a middleware calls via nuxt.config.js and serverMiddleware.
serverMiddleware: [
{ path: '/backend', handler: '~/api/backend.js' }
]
When deployed and using Axios out of the box the calls to the backend/middleware are done by http://localhost:3000 instead of www.myapp.com. Therefore CORS is being triggered and giving me this error in the console:
Access to XMLHttpRequest at 'http://localhost:3000/backend/packingplan/all?owner=123' from origin 'https://www.myapp.com' 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.
So I did a little research and found out that I can override the base URL Axios uses. That way I can turn the http://localhost:3000 into www.myapp.com and avoid the CORS problem.
I am doing this like this:
create a Nuxt plugin ~/plugins/axios.js
add the following code
export default function (context) {
context.$axios.defaults.timeout = 15000
context.$axios.defaults.baseURL = context.$config.baseUrl || 'http://axios.plugin.failed'
}
add the plugin to the nuxt.config.js
plugins: [
'~/plugins/axios.js'
]
And this works. Now the CORS problem is solved.
BUT
It just works when I call my app with www.myapp.com. As soon as I open my webapp without the www then CORS is triggered again.
Access to XMLHttpRequest at 'https://www.myapp.com/backend/packingplan/all?owner=62443cb7d0f6b2006a8526e5' from origin 'https://myapp.com' 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.
So I wonder if I can tell Axios somehow to use the URL that is defined in the browser? If the user is visiting the site via www.myapp.com it should use that as Base URL for Axios and if the user is visiting the site via myapp.com it should use that one?
How can I achieve that? Any ideas?

JIRA REST API cors

I keep getting the following CORS error when trying to consume the JIRA ReST API:
Fetch API cannot load
https://jira.our-domain-name.com/jira/rest/api/2/search?jql=project=tcc%20and%20cf[10809]~8423362.
Response to preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin 'https://application-url.our-domain-name.com' is therefore not allowed
access. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
However, this search URL works 100% when I paste it directly into the browser, or running it through Postman, or using CURL from command line.
My app is calling the API, using the javascript fetch API. I set the following headers when making the GET request:
headers: {
"content-type": "application/json",
"authorization": "Basic <<encrypted>>"
}
I have ensured that the requesting host has been whitelised in JIRA admin - I have tested the host using the test feature on the whitelist page.
When I change the whitelist from wildcard to Domain Name, I suddenly get this:
Fetch API cannot load
https://jira.our-domain-name.com/jira/rest/api/2/search?jql=project=tcc%20and%20cf[10809]~8423362.
Request header field authorization is not allowed by
Access-Control-Allow-Headers in preflight response.
Any ideas?
You have 2 options.
The easiest way is to proxy your request through your backend (if that's possible) since the CORS restrictions are enforced on JavaScript running within the browser.
The other way would be to reconfigure the Tomcat server that Jira is running on to support sending a CORS header. This can have other security implications if not done right.

calling rest api from meteor app

How can I call a rest api with authentication from meteor, appreciate if you can guide to an example, I have added the http package to the meteor project. Using advanced rest client chrome app, I am able to get the data by passing the following URL and 2 headers. This app is using the already logged in browser session.
URL: https://xxxxx:9443/ccm/oslc/contexts/_ZoC0QNS3EeGPlow7Bl9IAw/workitems
headers: Accept", "application/json"
OSLC-Core-Version", "2.0"
How can I pass the headers and user name password of the rest api service.