How i can solve the Forbidden (403) React.js framework? - javascript

I am working with React.js framework on my project, all is well only when I try to update data, always seen Forbidden (403).

I don't think its a problem with react.
According to MDN web docs :-
403 Forbidden
The HTTP 403 Forbidden response status code indicates that the server understands the request but refuses to authorize it.
This status is similar to 401, but for the 403 Forbidden status code re-authenticating makes no difference. The access is permanently forbidden and tied to the application logic, such as insufficient rights to a resource.
It means you don't have permission to that endpoint, maybe because of you are not added the credentials (password, jwt, token or something like that which authorize the request) to the request header in react front-end.

Related

Cors and preflight errors with axios in vue

In my application I have got laravel as backend, jwt-auth as authentication, socialite as oauth2 provider and vue as my frontend.
Now I use axios to authorize the user by github for example (https://github.com/login/oauth/authorize) inside the client and then get the access token by the backend api.
If I do the authorize request with POSTMAN everything works, but if I do the request with my frontend axio request I get always errors. I think I get them because some Header values which are not correct. Can someone explain me which variables an axion request needs to perform an authorization request.
Kind Regards.
you can either disable cors in your browser which is very bad or you have to enable cors in your backend and to check if cors is enabled in your backend look for Access-Control-Allow-Origin header in browser network tab or you have to use proxy so that the requests are made to the same origin as seen by the browser but are redirected to some other url.
In create-react-app this works by adding
"proxy":"http://youUrl:portNo."

bypass json web token to do POST via broswer

In network tab I saw this on the request
Then I try to use https://www.hurl.it to try to post to the request. It failed. What is that authorization about? is that a security layer?
It's a JWT token used for authentication purposes
You can read about it here

Power BI API Authentication

How can I call the Power BI API from my application and understand Microsoft APIs?
I have successfully authorized users via the Azure AD library for JavaScript. However I have not been able to get a successful response from the API in the console. I get an unauthorized error, no access control allow origin header is present on the requested resource.
I am used to making API calls using Javascript and Angular, but not with Microsoft APIs and how they must be authorized. I have tried to read articles but they go over my head.
The errors are as follows
Failed to load resource: the server responded with a status of 404 (Not Found)
XMLHttpRequest: cannot load https://api.powerbi.com/v1.0/myorg/dashboards. Response to preflight request doesn't pass access control check: No Access-Control-Allow-Origin header is present on the requested resource. Origin http://renniesb.github.io is therefore not allowed access. The response had HTTP status code 404.
nope
Repository with my project code
https://github.com/Renniesb/sample_dashboard/tree/gh-pages
Place in repository that shows my Power B.I API call https://github.com/Renniesb/sample_dashboard/blob/gh-pages/app/services/powerbi.service.js
Expected behavior
List dashboards in the console.
Test site
https://Renniesb.github.io/sample_dashboard. To test I authorize with my credentials. How would I let users of this forum test the behavior. How do I enable their credentials?
List of things I've tried already
Created a reverse proxy using the following website: http://shawnsimondeveloper.com/nodeproxyangular/
Used the JSONP hack to attempt to get around CORS problem.
Put in the origin of the call in the webconfig file.
Tested the site both locally and on a webpage on GitHub
You shouldn't need to use both CORS and the HTTP proxy. Since you are using the ADAL JS library it will automatically append your Power BI token to your outgoing HTTP requests.
You will also need to setup the following:
Enable implicit grant flow as described in Step 3
Also, the dashboards endpoint is still only available in the "beta" version. This was causing the 404's.
Update your URLs to https://api.powerbi.com/beta/myorg/dashboards
To continue to use standard AJAX call with CORS:
Update your Angular powerbiService service to make HTTP requests directly to the https://api.powerbi.com domain rather than relative urls.

Reddit OAuth2 User Authentication

I am working on a web app which requires a user to login to their reddit account and according to https://github.com/reddit/reddit/wiki/OAuth2#retrieving-the-access-token I need to send a POST request to https://www.reddit.com/api/v1/access_token with some parameters. I am currently running the server from localhost and I keep getting the error:
XMLHttpRequest cannot load https://www.reddit.com/api/v1/access_token. Request header field Access-Control-Allow-Origin is not allowed by Access-Control-Allow-Headers.
I was struggling with this same issue and figured out that I need to register my app as "Installed" instead of "Web". This will make the authorization redirect with the bearer token instead of the code.
http://wattydev.com/authenticating_a_js-based_reddit_application_with_user_login_%28implicit_grant_flow%29

Javascript and SAML redirect fails

I try to access a resource at http://**/rest that is protected by Shibboleth SAML Serviceprovider. For that I make an XMLHttpRequest call to that address. On the resource server CORS headers are set and if there is no SAML Authentication everything works fine.
But if SAML Authentication is activated I get the following error in Chrome:
XMLHttpRequest cannot load *****/rest. The request was redirected to 'https://idp.testshib.org/idp/profile/SAML2/Redirect/SSO?SAMLRequest=********', which is disallowed for cross-origin requests that require preflight.
If I have a look at the network console I can see the following requests:
1.
Request URL:http://<resource_server>/rest
Request Method:OPTIONS
Status Code:200 OK
2.
Request URL:http://<resource_server>/rest
Request Method:GET
Status Code:302 Found
Response-Header: Location:https://idp.testshib.org/idp/profile/SAML2/Redirect/SSO?SAMLRequest=*****
So it seems that redirect will be initialized but then stops because of the error above.
Does anyone have any ideas how I can get this working?
Regards
Philipp
The 302 response is not an error. That is how a SAML protected resource requests authentication: by redirecting the user to the identity provider. Since you are making an AJAX call, however, the browser cannot follow the redirect to be authenticated.
Assuming the common Web Browser SSO Profile: The browser client needs to establish an authentication session in the same application that supports http://**/rest before you make the AJAX call. Most authentication session states are managed with cookies, so i would expect that once you have a session cookie for the application, the request to http://**/rest + the session cookie will result in a success.
There is also the Enhanced Client or Proxy (ECP) Profile. This would require passing on the authentication SAML payload from the IDP to the resource - see the spec https://www.oasis-open.org/committees/download.php/35389/sstc-saml-profiles-errata-2.0-wd-06-diff.pdf .

Categories

Resources